@civicactions/cmsds-open-data-components 4.0.19-alpha.1 → 4.0.19-alpha.3

package/dist/main.js

@@ -1426,8 +1426,6 @@ async function $eff7d34c30f5a0fc$export$2d2256cb46e92ff7(rootUrl, options, ACA)
 
 
 const $e873081a6e8f024e$export$1040147c129fdde9 = (query)=>{
-    // Only allow letters, numbers, spaces, and empty string
-    // A search containing any special character will be rejected
     return /^[a-zA-Z0-9 ]*$/.test(query.trim());
 };
 const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
@@ -1454,103 +1452,87 @@ const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
             value: 'titleZA'
         }
     ];
-    const defaultSortBy = "";
-    const defaultFulltext = "";
-    const defaultSelectedFacets = {
-        theme: [],
-        keyword: []
-    };
-    const defaultSortOrder = "";
-    const defaultPage = 1;
     const location = (0, $hgUW1$useLocation)();
-    const transformedParams = (0, $eff7d34c30f5a0fc$export$60ec7cc1d341a524)(location.search, defaultSort);
-    const [currentResultNumbers, setCurrentResultNumbers] = (0, $hgUW1$useState)({
-        total: 0,
-        startingNumber: 0,
-        endingNumber: 0
-    });
-    const [noResults, setNoResults] = (0, $hgUW1$useState)(false);
-    const [announcementText, setAnnouncementText] = (0, $hgUW1$useState)('');
-    let [searchParams, setSearchParams] = (0, $hgUW1$useSearchParams)();
-    const [fulltext, setFullText] = (0, $hgUW1$useState)(transformedParams.fulltext);
-    const [filterText, setFilterText] = (0, $hgUW1$useState)(transformedParams.fulltext);
-    const [totalItems, setTotalItems] = (0, $hgUW1$useState)(0);
-    const [page, setPage] = (0, $hgUW1$useState)(transformedParams.page ? transformedParams.page : defaultPage);
-    const [sort, setSort] = (0, $hgUW1$useState)(transformedParams.sort ? transformedParams.sort : defaultSort ? defaultSort.defaultSort : defaultSortBy);
-    const [sortOrder, setSortOrder] = (0, $hgUW1$useState)(transformedParams.sortOrder ? transformedParams.sortOrder : defaultSort ? defaultSort.defaultOrder : defaultSortOrder);
-    const [sortDisplay, setSortDisplay] = (0, $hgUW1$useState)(()=>{
-        return sort === 'modified' ? sortOrder === 'desc' ? 'newest' : 'oldest' : sortOrder === 'desc' ? 'titleZA' : 'titleAZ';
-    });
-    const [selectedFacets, setSelectedFacets] = (0, $hgUW1$useState)(transformedParams.selectedFacets ? transformedParams.selectedFacets : {
-        theme: [],
-        keyword: []
-    });
+    const [searchParams, setSearchParams] = (0, $hgUW1$useSearchParams)();
+    // Derive all search state from URL params
+    const selectedFacets = (0, $hgUW1$useMemo)(()=>({
+            theme: searchParams.getAll('theme'),
+            keyword: searchParams.getAll('keyword')
+        }), [
+        searchParams
+    ]);
+    const page = Number(searchParams.get('page')) || 1;
+    const sort = searchParams.get('sort') || defaultSort.defaultSort;
+    const sortOrder = searchParams.get('sortOrder') || defaultSort.defaultOrder;
+    const fulltext = searchParams.get('fulltext') || '';
+    const sortDisplay = sort === 'modified' ? sortOrder === 'desc' ? 'newest' : 'oldest' : sortOrder === 'desc' ? 'titleZA' : 'titleAZ';
+    // Local UI state only
+    const [filterText, setFilterText] = (0, $hgUW1$useState)(fulltext);
     const [invalidSearch, setInvalidSearch] = (0, $hgUW1$useState)(false);
-    const setSortOptions = (value)=>{
-        setSortDisplay(value);
+    // Sync filterText from URL on back/forward
+    (0, $hgUW1$useEffect)(()=>{
+        setFilterText(fulltext);
+    }, [
+        fulltext
+    ]);
+    function buildNextParams(overrides) {
+        const next = new URLSearchParams(searchParams);
+        Object.entries(overrides).forEach(([key, value])=>{
+            next.delete(key);
+            if (value === null) return;
+            const values = Array.isArray(value) ? value : [
+                value
+            ];
+            values.forEach((v)=>next.append(key, v));
+        });
+        return next;
+    }
+    function updateSelectedFacets(key, value) {
+        const current = searchParams.getAll(key);
+        const idx = current.indexOf(value);
+        const updated = idx > -1 ? current.filter((_, i)=>i !== idx) : [
+            ...current,
+            value
+        ];
+        setSearchParams(buildNextParams({
+            [key]: updated.length ? updated : null,
+            page: null
+        }));
+    }
+    const setSortOptionsHandler = (value)=>{
+        let nextSort;
+        let nextSortOrder;
         switch(value){
             case 'newest':
-                setSort('modified');
-                setSortOrder('desc');
+                nextSort = 'modified';
+                nextSortOrder = 'desc';
                 break;
             case 'oldest':
-                setSort('modified');
-                setSortOrder('asc');
+                nextSort = 'modified';
+                nextSortOrder = 'asc';
                 break;
             case 'titleAZ':
-                setSort('title');
-                setSortOrder('asc');
+                nextSort = 'title';
+                nextSortOrder = 'asc';
                 break;
             case 'titleZA':
-                setSort('title');
-                setSortOrder('desc');
+                nextSort = 'title';
+                nextSortOrder = 'desc';
                 break;
+            default:
+                return;
         }
-    };
-    function updateSelectedFacets(key, value) {
-        const newFacets = {
-            theme: [
-                ...selectedFacets.theme
-            ],
-            keyword: [
-                ...selectedFacets.keyword
-            ]
+        const overrides = {
+            sort: nextSort === defaultSort.defaultSort ? null : nextSort,
+            sortOrder: nextSortOrder === defaultSort.defaultOrder ? null : nextSortOrder
         };
-        if (key === 'theme') {
-            const existingFacet = newFacets.theme.findIndex((s)=>s === value);
-            if (existingFacet > -1) newFacets.theme.splice(existingFacet, 1);
-            else newFacets.theme.push(value);
-        }
-        if (key === 'keyword') {
-            const existingFacet = newFacets.keyword.findIndex((s)=>s === value);
-            if (existingFacet > -1) newFacets.keyword.splice(existingFacet, 1);
-            else newFacets.keyword.push(value);
-        }
-        setSelectedFacets(newFacets);
-    }
-    const pageSize = defaultPageSize;
+        setSearchParams(buildNextParams(overrides));
+    };
     function resetFilters() {
-        setFullText(defaultFulltext);
-        setFilterText(defaultFulltext);
-        setSelectedFacets(defaultSelectedFacets);
-        setPage(defaultPage);
-        const url = new URL(window.location.href);
-        window.history.pushState({}, '', `${url.origin}${url.pathname}`);
-    }
-    function buildSearchParams(includePage) {
-        let newParams = {};
-        if (Number(page) !== 1 && includePage) newParams.page = page;
-        if (sort !== defaultSort.defaultSort) newParams.sort = sort;
-        if (sortOrder !== defaultSort.defaultOrder) newParams.sortOrder = sortOrder;
-        if (fulltext !== '') newParams.fulltext = fulltext;
-        if (Object.keys(selectedFacets).length) Object.keys(selectedFacets).forEach((key)=>{
-            newParams[key] = selectedFacets[key];
-        });
-        return (0, $hgUW1$qs).stringify(newParams, {
-            addQueryPrefix: includePage,
-            encode: true
-        });
+        setFilterText('');
+        setSearchParams({});
     }
+    const pageSize = defaultPageSize;
     let params = {
         fulltext: fulltext ? fulltext : undefined,
         ...selectedFacets,
@@ -1571,55 +1553,30 @@ const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
             })}`);
         }
     });
-    // Sync totalItems state with API response data
-    // Moved to useEffect to prevent state updates during render (which can cause infinite loops)
-    (0, $hgUW1$useEffect)(()=>{
-        if (data?.data?.total !== undefined && data.data.total !== totalItems) setTotalItems(data.data.total);
-    }, [
-        data?.data?.total
-    ]);
+    const totalItems = data?.data?.total ? Number(data.data.total) : 0;
     const facets = data && data.data.facets ? (0, $eff7d34c30f5a0fc$export$959638e8dca60ce6)(data ? data.data.facets : []) : {
         theme: null,
         keyword: null
     };
-    (0, $hgUW1$useEffect)(()=>{
-        const baseNumber = Number(totalItems) > 0 ? 1 : 0;
-        const startingNumber = baseNumber + (Number(pageSize) * Number(page) - Number(pageSize));
-        const endingNumber = Number(pageSize) * Number(page);
-        setCurrentResultNumbers({
-            total: Number(totalItems),
-            startingNumber: Number(totalItems) >= startingNumber ? startingNumber : 0,
-            endingNumber: Number(totalItems) < endingNumber ? Number(totalItems) : endingNumber
-        });
-        if (totalItems <= 0 && currentResultNumbers !== null) setNoResults(true);
-        else setNoResults(false);
+    const currentResultNumbers = (0, $hgUW1$useMemo)(()=>{
+        const baseNumber = totalItems > 0 ? 1 : 0;
+        const startingNumber = baseNumber + (pageSize * page - pageSize);
+        const endingNumber = pageSize * page;
+        return {
+            total: totalItems,
+            startingNumber: totalItems >= startingNumber ? startingNumber : 0,
+            endingNumber: totalItems < endingNumber ? totalItems : endingNumber
+        };
     }, [
         totalItems,
         pageSize,
         page
     ]);
-    (0, $hgUW1$useEffect)(()=>{
-        if (page !== 1 && (transformedParams.fulltext !== fulltext || transformedParams.selectedFacets !== selectedFacets)) setPage(1);
-    }, [
-        fulltext,
-        selectedFacets
-    ]);
-    (0, $hgUW1$useEffect)(()=>{
-        if (totalItems !== null && totalItems !== undefined && totalItems > 0) {
-            var params = buildSearchParams(true);
-            if (params !== location.search) setSearchParams(params);
-        }
-    }, [
-        page,
-        sort,
-        sortOrder,
-        totalItems
-    ]);
-    (0, $hgUW1$useEffect)(()=>{
-        // No results found
-        if (noResults) setAnnouncementText('No results found.');
-        else if (!isPending && (!data || !data.data.results)) setAnnouncementText('Could not connect to the API.');
-        else setAnnouncementText(`Showing ${currentResultNumbers.startingNumber} to ${currentResultNumbers.endingNumber} of ${currentResultNumbers.total} datasets`);
+    const noResults = totalItems <= 0 && !isPending;
+    const announcementText = (0, $hgUW1$useMemo)(()=>{
+        if (noResults) return 'No results found.';
+        if (!isPending && (!data || !data.data.results)) return 'Could not connect to the API.';
+        return `Showing ${currentResultNumbers.startingNumber} to ${currentResultNumbers.endingNumber} of ${currentResultNumbers.total} datasets`;
     }, [
         data,
         isPending,
@@ -1670,7 +1627,10 @@ const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
                                         if (filterText) {
                                             if ($e873081a6e8f024e$export$1040147c129fdde9(filterText)) {
                                                 setInvalidSearch(false);
-                                                setFullText(filterText);
+                                                setSearchParams(buildNextParams({
+                                                    fulltext: filterText,
+                                                    page: null
+                                                }));
                                             } else setInvalidSearch(true);
                                         }
                                     },
@@ -1764,7 +1724,7 @@ const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
                                                         label: "Sort",
                                                         labelClassName: "ds-u-margin-top--0",
                                                         name: "dataset_search_sort",
-                                                        onChange: (e)=>setSortOptions(e.target.value)
+                                                        onChange: (e)=>setSortOptionsHandler(e.target.value)
                                                     })
                                                 })
                                             ]
@@ -1797,7 +1757,6 @@ const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
                                                     };
                                                     let topicProps = {};
                                                     if (showTopics) {
-                                                        // Generate topic slugs mapping for this item's themes
                                                         let topicSlugs = {};
                                                         if (item.theme && Array.isArray(item.theme)) item.theme.forEach((topic)=>{
                                                             if (topic) topicSlugs[topic] = topicSlugFunction ? topicSlugFunction(topic) : topic.split(' ').join('-').toLowerCase();
@@ -1835,12 +1794,15 @@ const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
                                             onPageChange: (evt, page)=>{
                                                 evt.preventDefault();
                                                 window.scroll(0, 0);
-                                                setPage(page);
+                                                setSearchParams(buildNextParams({
+                                                    page: page > 1 ? String(page) : null
+                                                }));
                                             },
-                                            renderHref: (page)=>{
-                                                const searchParams = buildSearchParams(false);
-                                                const includeAnd = searchParams ? '&' : '';
-                                                return `/datasets?page=${page}${includeAnd}${searchParams}`;
+                                            renderHref: (p)=>{
+                                                const next = buildNextParams({
+                                                    page: p > 1 ? String(p) : null
+                                                });
+                                                return `/datasets?${next.toString()}`;
                                             }
                                         })
                                     ]