Enhancement: Separated quicklaunch's search provider dependency from the search widget settings

docs/configs/settings.md

@@ -378,16 +378,26 @@ You can use the 'Quick Launch' feature to search services, perform a web search
 There are a few optional settings for the Quick Launch feature:
 
 - `searchDescriptions`: which lets you control whether item descriptions are included in searches. This is off by default. When enabled, results that match the item name will be placed above those that only match the description.
-- `hideInternetSearch`: disable automatically including the currently-selected web search (e.g. from the widget) as a Quick Launch option. This is false by default, enabling the feature.
+- `showSearchSuggestions`: shows search suggestions for the internet search. This is true by default. For custom providers the `suggestionUrl` needs to be set in order for this to work.
-- `showSearchSuggestions`: shows search suggestions for the internet search. This value will be inherited from the search widget if it is not specified. If it is not specified there either, it will default to false.
 - `hideVisitURL`: disable detecting and offering an option to open URLs. This is false by default, enabling the feature.
+- `provider`: search engine provider. If none is specified then internet search will be disabled.
 
 ```yaml
 quicklaunch:
   searchDescriptions: true
-  hideInternetSearch: true
+  showSearchSuggestions: true # Optional
-  showSearchSuggestions: true
   hideVisitURL: true
+  provider: google # google, duckduckgo, bing, baidu, brave or custom
+```
+
+or for a custom search:
+
+```yaml
+quicklaunch:
+  provider: custom
+  url: https://www.ecosia.org/search?q=
+  target: _blank
+  suggestionUrl: https://ac.ecosia.org/autocomplete?type=list&q= # Optional
 ```
 
 ## Homepage Version

src/components/quicklaunch.jsx

@@ -3,24 +3,16 @@ import { useEffect, useState, useRef, useCallback, useContext } from "react";
 import classNames from "classnames";
 
 import ResolvedIcon from "./resolvedicon";
+import { searchProviders } from "./widgets/search/search";
 
 import { SettingsContext } from "utils/contexts/settings";
 
-export default function QuickLaunch({
+export default function QuickLaunch({ servicesAndBookmarks, searchString, setSearchString, isOpen, close }) {
-  servicesAndBookmarks,
-  searchString,
-  setSearchString,
-  isOpen,
-  close,
-  searchProvider,
-}) {
   const { t } = useTranslation();
 
   const { settings } = useContext(SettingsContext);
   const { searchDescriptions = false, hideVisitURL = false } = settings?.quicklaunch ?? {};
-  const showSearchSuggestions = !!(
+  const showSearchSuggestions = !!(settings?.quicklaunch?.showSearchSuggestions ?? true);
-    settings?.quicklaunch?.showSearchSuggestions ?? searchProvider?.showSearchSuggestions
-  );
 
   const searchField = useRef();
 
@@ -29,9 +21,27 @@ export default function QuickLaunch({
   const [url, setUrl] = useState(null);
   const [searchSuggestions, setSearchSuggestions] = useState([]);
 
+  function getSearchProvider() {
+    let searchProvider = null;
+
+    if (settings?.quicklaunch?.provider === "custom") {
+      searchProvider = settings.quicklaunch;
+    } else if (settings?.quicklaunch?.provider) {
+      searchProvider = searchProviders[settings.quicklaunch.provider];
+    }
+
+    return searchProvider;
+  }
+
+  const searchProvider = getSearchProvider();
+
   function openCurrentItem(newWindow) {
     const result = results[currentItemIndex];
-    window.open(result.href, newWindow ? "_blank" : result.target ?? settings.target ?? "_blank", "noreferrer");
+    window.open(
+      result.href,
+      newWindow ? "_blank" : result.target ?? searchProvider?.target ?? settings.target ?? "_blank",
+      "noreferrer",
+    );
   }
 
   const closeAndReset = useCallback(() => {

src/pages/index.jsx

@@ -26,7 +26,6 @@ import { bookmarksResponse, servicesResponse, widgetsResponse } from "utils/conf
 import ErrorBoundary from "components/errorboundry";
 import themes from "utils/styles/themes";
 import QuickLaunch from "components/quicklaunch";
-import { getStoredProvider, searchProviders } from "components/widgets/search/search";
 
 const ThemeToggle = dynamic(() => import("components/toggles/theme"), {
   ssr: false,
@@ -204,20 +203,6 @@ function Home({ initialSettings }) {
 
   const [searching, setSearching] = useState(false);
   const [searchString, setSearchString] = useState("");
-  let searchProvider = null;
-  const searchWidget = Object.values(widgets).find((w) => w.type === "search");
-  if (searchWidget) {
-    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 if (searchWidget.options?.provider === "custom") {
-      searchProvider = searchWidget.options;
-    } else {
-      searchProvider = searchProviders[searchWidget.options?.provider];
-    }
-    // to pass to quicklaunch
-    searchProvider.showSearchSuggestions = searchWidget.options?.showSearchSuggestions;
-  }
   const headerStyle = settings?.headerStyle || "underlined";
 
   useEffect(() => {
@@ -403,7 +388,6 @@ function Home({ initialSettings }) {
           setSearchString={setSearchString}
           isOpen={searching}
           close={setSearching}
-          searchProvider={settings.quicklaunch?.hideInternetSearch ? null : searchProvider}
         />
         <div
           id="information-widgets"