diff --git a/src/components/widgets/search/search.jsx b/src/components/widgets/search/search.jsx index dfb18367..b04f0e9f 100644 --- a/src/components/widgets/search/search.jsx +++ b/src/components/widgets/search/search.jsx @@ -1,7 +1,9 @@ -import { useState } from "react"; +import { useState, useEffect, Fragment } from "react"; import { useTranslation } from "next-i18next"; import { FiSearch } from "react-icons/fi"; import { SiDuckduckgo, SiMicrosoftbing, SiGoogle, SiBaidu, SiBrave } from "react-icons/si"; +import { Listbox, Transition } from "@headlessui/react"; +import classNames from "classnames"; export const searchProviders = { google: { @@ -36,21 +38,55 @@ export const searchProviders = { }, }; +function getAvailableProviderIds(options) { + if (options.provider && Array.isArray(options.provider)) { + return Object.keys(searchProviders).filter((value) => options.provider.includes(value)); + } + if (options.provider && searchProviders[options.provider]) { + return [options.provider]; + } + return null; +} + +const localStorageKey = "search-name"; + +export function getStoredProvider() { + if (typeof window !== 'undefined') { + const storedName = localStorage.getItem(localStorageKey); + if (storedName) { + return Object.values(searchProviders).find((el) => el.name === storedName); + } + } + return null; +} + export default function Search({ options }) { const { t } = useTranslation(); - const provider = searchProviders[options.provider]; - const [query, setQuery] = useState(""); + const availableProviderIds = getAvailableProviderIds(options); - if (!provider) { + const [query, setQuery] = useState(""); + const [selectedProvider, setSelectedProvider] = useState(searchProviders[availableProviderIds[0] ?? searchProviders.google]); + + useEffect(() => { + const storedProvider = getStoredProvider(); + let storedProviderKey = null; + storedProviderKey = Object.keys(searchProviders).find((pkey) => searchProviders[pkey] === storedProvider); + if (storedProvider && availableProviderIds.includes(storedProviderKey)) { + setSelectedProvider(storedProvider); + } + }, [availableProviderIds]); + + if (!availableProviderIds) { return null; } function handleSubmit(event) { const q = encodeURIComponent(query); - if (provider.url) { - window.open(`${provider.url}${q}`, options.target || "_blank"); + const url = { selectedProvider }; + if (url) { + window.open(`${url}${q}`, options.target || "_blank"); } else { window.open(`${options.url}${q}`, options.target || "_blank"); } @@ -60,6 +96,11 @@ export default function Search({ options }) { setQuery(""); } + const onChangeProvider = (provider) => { + setSelectedProvider(provider); + localStorage.setItem(localStorageKey, provider.name); + } + return (
); } diff --git a/src/pages/index.jsx b/src/pages/index.jsx index 22b10248..6c42ab71 100644 --- a/src/pages/index.jsx +++ b/src/pages/index.jsx @@ -22,7 +22,7 @@ import { bookmarksResponse, servicesResponse, widgetsResponse } from "utils/conf import ErrorBoundary from "components/errorboundry"; import themes from "utils/styles/themes"; import QuickLaunch from "components/quicklaunch"; -import { searchProviders } from "components/widgets/search/search"; +import { getStoredProvider, searchProviders } from "components/widgets/search/search"; const ThemeToggle = dynamic(() => import("components/toggles/theme"), { ssr: false, @@ -197,12 +197,17 @@ function Home({ initialSettings }) { let searchProvider = null; const searchWidget = Object.values(widgets).find(w => w.type === "search"); if (searchWidget) { - if (searchWidget.options?.provider === 'custom') { - searchProvider = { - url: searchWidget.options.url - } + if (Array.isArray(searchWidget.options?.provider)) { + // if search provider is a list, try to retrieve from localstorage, fall back to the first + searchProvider = getStoredProvider() ?? searchProviders[searchWidget.options.provider[0]]; } else { - searchProvider = searchProviders[searchWidget.options?.provider]; + if (searchWidget.options?.provider === 'custom') { + searchProvider = { + url: searchWidget.options.url + } + } else { + searchProvider = searchProviders[searchWidget.options?.provider]; + } } }