[wip] zbycz#119 prefill search

OpenPlaceGuide · Sep 15, 2024 · 1317486 · 1317486
1 parent d004f55
commit 1317486
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 11 deletions.
diff --git a/src/components/App/App.tsx b/src/components/App/App.tsx
@@ -77,13 +77,20 @@ const useUpdateViewFromHash = () => {
   }, [setView]);
 };
 
+const useSearchQuery = () => {
+  const queryString = global.window?.location.search;
+  const urlParams = new URLSearchParams(queryString);
+  return urlParams.get('q');
+};
+
 const IndexWithProviders = () => {
   const isMobileMode = useMobileMode();
   const { feature, featureShown } = useFeatureContext();
   const router = useRouter();
   useUpdateViewFromFeature();
   usePersistMapView();
   useUpdateViewFromHash();
+  const searchQuery = useSearchQuery();
 
   // TODO add correct error boundaries
 
@@ -96,7 +103,7 @@ const IndexWithProviders = () => {
   return (
     <>
       <Loading />
-      <SearchBox />
+      <SearchBox searchQuery={searchQuery} />
       {featureShown && !isMobileMode && <FeaturePanelOnSide />}
       {featureShown && isMobileMode && <FeaturePanelInDrawer />}
       {isClimbingDialogShown && (

diff --git a/src/components/SearchBox/AutocompleteInput.tsx b/src/components/SearchBox/AutocompleteInput.tsx
@@ -69,6 +69,13 @@ export const AutocompleteInput = ({
   const { showToast } = useSnackbar();
   const mapCenter = useMapCenter();
   const { currentTheme } = useUserThemeContext();
+  const onChange = onSelectedFactory(
+    setFeature,
+    setPreview,
+    bbox,
+    showToast,
+    setOverpassLoading,
+  );
   return (
     <Autocomplete
       inputValue={inputValue}
@@ -86,13 +93,7 @@ export const AutocompleteInput = ({
         ''
       }
       getOptionKey={(option) => JSON.stringify(option)}
-      onChange={onSelectedFactory(
-        setFeature,
-        setPreview,
-        bbox,
-        showToast,
-        setOverpassLoading,
-      )}
+      onChange={onChange}
       onHighlightChange={onHighlightFactory(setPreview)}
       getOptionDisabled={(o) => o.loader}
       autoComplete

diff --git a/src/components/SearchBox/SearchBox.tsx b/src/components/SearchBox/SearchBox.tsx
@@ -1,4 +1,4 @@
-import React, { useRef, useState } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 import styled from '@emotion/styled';
 import SearchIcon from '@mui/icons-material/Search';
 import { CircularProgress, IconButton, Paper } from '@mui/material';
@@ -72,16 +72,20 @@ const useOnClosePanel = () => {
   };
 };
 
-const SearchBox = () => {
+const SearchBox = ({ searchQuery }) => {
   const isMobileMode = useMobileMode();
   const { featureShown } = useFeatureContext();
   const { inputValue, setInputValue } = useInputValueState();
   const [options, setOptions] = useState([]);
   const [overpassLoading, setOverpassLoading] = useState(false);
   const autocompleteRef = useRef();
   const onClosePanel = useOnClosePanel();
-
   useOptions(inputValue, setOptions);
+  useEffect(() => {
+    if (searchQuery) {
+      setInputValue(searchQuery);
+    }
+  });
 
   return (
     <TopPanel $isMobileMode={isMobileMode}>