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

package/dist/main.js

@@ -2,7 +2,7 @@ import "./main.css";
 import {jsx as $hgUW1$jsx, jsxs as $hgUW1$jsxs, Fragment as $hgUW1$Fragment} from "react/jsx-runtime";
 import {Accordion as $hgUW1$Accordion, AccordionItem as $hgUW1$AccordionItem, Button as $hgUW1$Button, CloseIconThin as $hgUW1$CloseIconThin, ArrowIcon as $hgUW1$ArrowIcon, Spinner as $hgUW1$Spinner, Alert as $hgUW1$Alert, Dialog as $hgUW1$Dialog, TextField as $hgUW1$TextField, Dropdown as $hgUW1$Dropdown, Pagination as $hgUW1$Pagination, Tooltip as $hgUW1$Tooltip, TooltipIcon as $hgUW1$TooltipIcon, Choice as $hgUW1$Choice, Table as $hgUW1$Table, TableHead as $hgUW1$TableHead, TableRow as $hgUW1$TableRow, TableCell as $hgUW1$TableCell, TableBody as $hgUW1$TableBody, Tabs as $hgUW1$Tabs, TabPanel as $hgUW1$TabPanel, ExternalLinkIcon as $hgUW1$ExternalLinkIcon, Badge as $hgUW1$Badge} from "@cmsgov/design-system";
 import $hgUW1$react, {createContext as $hgUW1$createContext, useState as $hgUW1$useState, useRef as $hgUW1$useRef, useEffect as $hgUW1$useEffect, useContext as $hgUW1$useContext, useMemo as $hgUW1$useMemo, useCallback as $hgUW1$useCallback} from "react";
-import {NavLink as $hgUW1$NavLink, Link as $hgUW1$Link, useNavigate as $hgUW1$useNavigate, useLocation as $hgUW1$useLocation, useSearchParams as $hgUW1$useSearchParams} from "react-router-dom";
+import {NavLink as $hgUW1$NavLink, Link as $hgUW1$Link, useNavigate as $hgUW1$useNavigate, useSearchParams as $hgUW1$useSearchParams, useLocation as $hgUW1$useLocation} from "react-router-dom";
 import $hgUW1$qs from "qs";
 import $hgUW1$axios from "axios";
 import {useQuery as $hgUW1$useQuery, QueryClient as $hgUW1$QueryClient, QueryClientProvider as $hgUW1$QueryClientProvider} from "@tanstack/react-query";
@@ -1426,136 +1426,113 @@ 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$sortOptions = [
+    {
+        label: 'Newest',
+        value: 'newest'
+    },
+    {
+        label: 'Oldest',
+        value: 'oldest'
+    },
+    {
+        label: 'Title A-Z',
+        value: 'titleAZ'
+    },
+    {
+        label: 'Title Z-A',
+        value: 'titleZA'
+    }
+];
 const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
     const { rootUrl: rootUrl, enableSort: enableSort = true, enablePagination: enablePagination = true, defaultPageSize: defaultPageSize = 10, defaultSort: defaultSort = {
         defaultSort: 'modified',
         defaultOrder: 'desc'
     }, pageTitle: pageTitle = 'Dataset Explorer', categoriesTitle: categoriesTitle = 'Categories', filterTitle: filterTitle = 'Tags', showLargeFileWarning: showLargeFileWarning = false, largeFileThemes: largeFileThemes, introText: introText = '', showDownloadIcon: showDownloadIcon = false, altMobileSearchButton: altMobileSearchButton, dataDictionaryLinks: dataDictionaryLinks = false, showDateDetails: showDateDetails = false, showTopics: showTopics = false, topicSlugFunction: topicSlugFunction, children: children } = props;
     const { ACA: ACA } = (0, $hgUW1$useContext)((0, $844981eac9b63865$export$eccc29c8d0ff408));
-    const sortOptions = [
-        {
-            label: 'Newest',
-            value: 'newest'
-        },
-        {
-            label: 'Oldest',
-            value: 'oldest'
-        },
-        {
-            label: 'Title A-Z',
-            value: 'titleAZ'
-        },
-        {
-            label: 'Title Z-A',
-            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 = {
-            ...selectedFacets
+        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);
-        }
-        const urlString = (0, $hgUW1$qs).stringify({
-            theme: newFacets.theme,
-            keyword: newFacets.keyword
-        }, {
-            encodeValuesOnly: true,
-            addQueryPrefix: true
-        });
-        setSelectedFacets(newFacets);
-        const url = new URL(window.location.href);
-        window.history.pushState({}, '', `${url.origin}${url.pathname}${urlString}`);
-    }
-    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({});
     }
-    let params = {
+    const pageSize = defaultPageSize;
+    const params = {
         fulltext: fulltext ? fulltext : undefined,
         ...selectedFacets,
         sort: sort ? sort : undefined,
@@ -1563,7 +1540,7 @@ const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
         page: page !== 1 ? page : undefined,
         ['page-size']: pageSize !== 10 ? pageSize : undefined
     };
-    const { data: data, isPending: isPending, error: error } = (0, $hgUW1$useQuery)({
+    const { data: data, isPending: isPending } = (0, $hgUW1$useQuery)({
         queryKey: [
             "datasets",
             params
@@ -1575,55 +1552,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 facets = data && data.data.facets ? (0, $eff7d34c30f5a0fc$export$959638e8dca60ce6)(data ? data.data.facets : []) : {
+    const totalItems = data?.data?.total ? Number(data.data.total) : 0;
+    const facets = data && data.data.facets ? (0, $eff7d34c30f5a0fc$export$959638e8dca60ce6)(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 && data?.data?.results !== undefined;
+    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,
@@ -1674,8 +1626,17 @@ 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);
+                                        } else {
+                                            setInvalidSearch(false);
+                                            setSearchParams(buildNextParams({
+                                                fulltext: null,
+                                                page: null
+                                            }));
                                         }
                                     },
                                     className: "dkan-dataset-search ds-l-form-row ds-u-padding-bottom--4 ds-u-border-bottom--1",
@@ -1763,12 +1724,12 @@ const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
                                                 enableSort && /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
                                                     className: "ds-l-col--12 ds-l-sm-col--6 ds-l-md-col--4 ds-u-sm-padding-right--0",
                                                     children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Dropdown), {
-                                                        options: sortOptions,
+                                                        options: $e873081a6e8f024e$var$sortOptions,
                                                         value: sortDisplay,
                                                         label: "Sort",
                                                         labelClassName: "ds-u-margin-top--0",
                                                         name: "dataset_search_sort",
-                                                        onChange: (e)=>setSortOptions(e.target.value)
+                                                        onChange: (e)=>setSortOptionsHandler(e.target.value)
                                                     })
                                                 })
                                             ]
@@ -1782,47 +1743,42 @@ const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
                                                     role: "region",
                                                     heading: "No results found."
                                                 }),
-                                                data && data.data.results ? Object.keys(data.data.results).map((key)=>{
-                                                    return data.data.results[key];
-                                                }).map((item)=>{
-                                                    function getDownloadUrl(item) {
-                                                        let distribution_array = item.distribution ? item.distribution : [];
-                                                        return distribution_array.length ? item.distribution[0].downloadURL : null;
-                                                    }
-                                                    let showLargeFile = false;
-                                                    if (largeFileThemes && item.theme) largeFileThemes.forEach((theme)=>{
-                                                        if (item.theme.includes(theme)) showLargeFile = true;
-                                                    });
-                                                    let dateDetailProps = {};
-                                                    if (showDateDetails) dateDetailProps = {
+                                                data && data.data.results ? Object.values(data.data.results).map((item)=>{
+                                                    const downloadUrl = (()=>{
+                                                        const distribution_array = item.distribution ?? [];
+                                                        return distribution_array.length ? distribution_array[0].downloadURL : null;
+                                                    })();
+                                                    const showLargeFile = largeFileThemes && item.theme ? largeFileThemes.some((theme)=>item.theme.includes(theme)) : false;
+                                                    const dateDetailProps = showDateDetails ? {
                                                         showDateDetails: showDateDetails,
                                                         released: item.released,
                                                         refresh: item.nextUpdateDate
-                                                    };
-                                                    let topicProps = {};
-                                                    if (showTopics) {
-                                                        // Generate topic slugs mapping for this item's themes
-                                                        let topicSlugs = {};
+                                                    } : {};
+                                                    const topicProps = (()=>{
+                                                        if (!showTopics) return {};
+                                                        const topicSlugs = {};
                                                         if (item.theme && Array.isArray(item.theme)) item.theme.forEach((topic)=>{
-                                                            if (topic) topicSlugs[topic] = topicSlugFunction ? topicSlugFunction(topic) : topic.split(' ').join('-').toLowerCase();
+                                                            if (topic) {
+                                                                const slug = topicSlugFunction ? topicSlugFunction(topic) : topic.split(' ').join('-').toLowerCase();
+                                                                if (slug) topicSlugs[topic] = slug;
+                                                            }
                                                         });
-                                                        topicProps = {
+                                                        return {
                                                             showTopics: showTopics,
                                                             theme: item.theme,
                                                             topicSlugs: topicSlugs
                                                         };
-                                                    }
+                                                    })();
                                                     return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $52c6454cae137465$export$2e2bcd8739ae039), {
-                                                        location: location,
                                                         title: item.title,
                                                         modified: item.modified,
                                                         description: item.description,
                                                         identifier: item.identifier,
-                                                        downloadUrl: showDownloadIcon ? getDownloadUrl(item) : null,
+                                                        downloadUrl: showDownloadIcon ? downloadUrl : null,
                                                         largeFile: showLargeFile,
                                                         paginationEnabled: enablePagination,
                                                         dataDictionaryLinks: dataDictionaryLinks,
-                                                        distribution: "%Ref:distribution" in item ? item["%Ref:distribution"][0] : {},
+                                                        distribution: "%Ref:distribution" in item && item["%Ref:distribution"] ? item["%Ref:distribution"][0] : {},
                                                         ...dateDetailProps,
                                                         ...topicProps
                                                     }, item.identifier);
@@ -1833,18 +1789,21 @@ const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
                                                 })
                                             ]
                                         }),
-                                        enablePagination && data && data.data.total && data.data.total != 0 && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Pagination), {
+                                        enablePagination && data && data.data.total && Number(data.data.total) !== 0 && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Pagination), {
                                             currentPage: Number(page),
                                             totalPages: Math.ceil(Number(data.data.total) / pageSize),
                                             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()}`;
                                             }
                                         })
                                     ]
@@ -3774,10 +3733,11 @@ const $6f4318b1e14124e5$var$FilterDataset = ()=>{
     const { distribution: distribution, resource: resource, customColumns: customColumns = [], enableEmptyFilters: enableEmptyFilters } = (0, $hgUW1$useContext)((0, $43a30d745a7bbc86$export$2e2bcd8739ae039));
     const { setPage: setPage } = (0, $hgUW1$useContext)((0, $ee0d4d4f34048447$export$f814ea079e65d8fe));
     if (!resource) return null;
-    const customColumnHeaders = (0, $7264a673914aa746$export$8049e8f40a9bdfb8)(customColumns, resource.columns, resource.schema[distribution.identifier]);
     const id = distribution.identifier;
-    const columns = customColumnHeaders ? customColumnHeaders : (0, $a35cf16d1488f54e$export$1147582dfae658c6)(resource.columns, resource.schema[id]);
     const { conditions: conditions, schema: schema, setConditions: setConditions, setOffset: setOffset } = resource;
+    if (!schema[id]?.fields) return null;
+    const customColumnHeaders = (0, $7264a673914aa746$export$8049e8f40a9bdfb8)(customColumns, resource.columns, resource.schema[distribution.identifier]);
+    const columns = customColumnHeaders ? customColumnHeaders : (0, $a35cf16d1488f54e$export$1147582dfae658c6)(resource.columns, resource.schema[id]);
     const fields = Object.keys(schema[id].fields);
     const [queryConditions, setQueryConditions] = (0, $hgUW1$useState)([]);
     const [titleConditions, setTitleConditions] = (0, $hgUW1$useState)([]);