diff --git a/src/components/SiteSearch.jsx b/src/components/SiteSearch.jsx index 480822c0dac2..60f4b24524b0 100644 --- a/src/components/SiteSearch.jsx +++ b/src/components/SiteSearch.jsx @@ -111,14 +111,17 @@ function capitalizeFirstLetter(val) { return String(val).charAt(0).toUpperCase() + String(val).slice(1); } -const SearchBar = ({ setResults }) => { - const [query, setQuery] = useState(""); - +const SearchBar = ({ setResults, setQuery, query }) => { const handleSearchBar = (e) => { const input = e.target.value; setQuery(input); }; + const handleClose = () => { + setQuery(""); + setResults({ general: [], blogs: [], events: [] }); + } + const handleSubmit = (event) => { event.preventDefault(); const input = query; @@ -136,7 +139,7 @@ const SearchBar = ({ setResults }) => {
- setQuery("")} path={mdiClose} /> + handleClose()} path={mdiClose} /> Search ) @@ -238,6 +241,26 @@ const FilterModal = ({ isModalOpen, setIsModalOpen, filters, handleCheckboxChang ) }; +function setLocalStorageState(key, value, minutes) { + const expires = Date.now() + minutes * 60 * 1000; + localStorage.setItem(key, JSON.stringify({ value, expires })); +} + +function getLocalStorageState(key) { + const item = localStorage.getItem(key); + if (!item) return null; + try { + const { value, expires } = JSON.parse(item); + if (Date.now() > expires) { + localStorage.removeItem(key); + return null; + } + return value; + } catch { + return null; + } +} + export const SiteSearch = () => { const [isModalOpen, setIsModalOpen] = useState(false); //modal control @@ -273,6 +296,8 @@ export const SiteSearch = () => { pageSizes: [5, 10, 15, 25, 50] }); + const [query, setQuery] = useState(""); + useEffect(() => { document.body.classList.add("min-w-fit") }) @@ -296,6 +321,24 @@ export const SiteSearch = () => { setOptionsEvent(prev => ({ ...prev, itemCount: results.events.length })); }, [results]); + // Try to load from localStorage on mount + useEffect(() => { + const state = getLocalStorageState('siteSearchState'); + if (state && state.query !== undefined && state.filters) { + setFilters(state.filters); + setQuery(state.query); + if (state.query && state.query.trim() !== "") { + const searchResults = searchContent(state.query, STORE); + setResults(searchResults); + } + } + }, []); + + // Save to localStorage on query or filter change + useEffect(() => { + setLocalStorageState('siteSearchState', { query, filters }, 30); + }, [query, filters]); + const handleCheckboxChange = useCallback((option) => { handleFilterChange({ ...filters, @@ -360,7 +403,7 @@ export const SiteSearch = () => {
- +