@civicactions/cmsds-open-data-components 3.1.2 → 3.1.3-alpha.2

package/dist/main.js

@@ -1010,7 +1010,7 @@ const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
         ["page-size"]: pageSize !== 10 ? pageSize : undefined,
         ...additionalParams
     };
-    const { data: data, isLoading: isLoading, error: error } = (0, $hgUW1$useQuery)({
+    const { data: data, isPending: isPending, error: error } = (0, $hgUW1$useQuery)({
         queryKey: [
             "datasets",
             params
@@ -1110,7 +1110,7 @@ const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
                             }),
                             /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
                                 className: "ds-l-col--12 ds-l-sm-col--8",
-                                children: isLoading ? /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Spinner), {
+                                children: isPending ? /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Spinner), {
                                     className: "ds-u-valign--middle",
                                     "aria-valuetext": "Dataset Search loading",
                                     role: "status"
@@ -1271,24 +1271,24 @@ const $b4aa9c66f2e86959$var$useMetastoreDataset = (datasetId, rootAPIUrl, additi
     const [id, setId] = (0, $hgUW1$useState)(datasetId);
     const [rootUrl, setRootUrl] = (0, $hgUW1$useState)(rootAPIUrl);
     const additionalParamsString = Object.keys(additionalParams).length ? `&${(0, $hgUW1$qs).stringify(additionalParams)}` : "";
-    (0, $hgUW1$useEffect)(()=>{
-        async function fetchData() {
-            return (0, $hgUW1$axios).get(`${rootUrl}/metastore/schemas/dataset/items/${id}?show-reference-ids${additionalParamsString}`).then((res)=>setDataset(res.data)).catch((error)=>setDataset({
-                    title: dataset.title,
-                    distribution: dataset.distribution,
-                    error: error,
-                    description: dataset.description,
-                    identifier: dataset.identifier,
-                    modified: dataset.modified
-                }));
+    const { data: data, isPending: isPending, error: error } = (0, $hgUW1$useQuery)({
+        queryKey: [
+            "metastore" + id
+        ],
+        queryFn: ()=>{
+            return fetch(`${rootUrl}/metastore/schemas/dataset/items/${id}?show-reference-ids${additionalParamsString}`).then((res)=>res.json()).then((res)=>{
+                return res;
+            });
         }
-        fetchData();
+    });
+    (0, $hgUW1$useEffect)(()=>{
+        if (data && data != dataset) setDataset(data);
     }, [
-        id,
-        rootUrl
+        data
     ]);
     return {
         dataset: dataset,
+        isPending: isPending,
         setId: setId,
         setRootUrl: setRootUrl
     };
@@ -1301,47 +1301,9 @@ var $b4aa9c66f2e86959$export$2e2bcd8739ae039 = $b4aa9c66f2e86959$var$useMetastor
 
 
 
-async function $0e7628cf73c71646$export$55f990b5477765d6(id, rootUrl, options, additionalParams) {
-    const { keys: keys, limit: limit, offset: offset, conditions: conditions, sort: sort, groupings: groupings, prepareColumns: prepareColumns, properties: properties, setValues: setValues, setCount: setCount, setColumns: setColumns, setLoading: setLoading, setSchema: setSchema } = options;
-    if (!id) // TODO: Throw error
-    return false;
-    if (typeof setLoading === "function") setLoading(true);
-    return await (0, $hgUW1$axios)({
-        method: "GET",
-        url: `${rootUrl}/datastore/query/${id}`,
-        params: {
-            keys: keys,
-            limit: limit,
-            offset: offset,
-            conditions: conditions,
-            sorts: sort,
-            properties: properties,
-            groupings: groupings,
-            ...additionalParams
-        },
-        //paramsSerializer: {
-        //  serialize: qs.stringify
-        //},
-        paramsSerializer: (params)=>{
-            return (0, $hgUW1$qs).stringify(params);
-        }
-    }).then((res)=>{
-        const { data: data } = res;
-        const propertyKeys = data.schema[id] && data.schema[id].fields ? Object.keys(data.schema[id].fields) : [];
-        setValues(data.results), setCount(data.count);
-        if (propertyKeys.length) setColumns(prepareColumns ? prepareColumns(propertyKeys) : propertyKeys);
-        setSchema(data.schema);
-        if (typeof setLoading === "function") setLoading(false);
-        return data;
-    });
-}
-
-
 const $1d3d480a9cfaabe0$var$useDatastore = (resourceId, rootAPIUrl, options, additionalParams = {})=>{
     const keys = options.keys ? options.keys : true;
     const { prepareColumns: prepareColumns } = options;
-    const [manual, setManual] = (0, $hgUW1$useState)(options.manual ? options.manual : false);
-    const [requireConditions, setRequireConditions] = (0, $hgUW1$useState)(options.requireConditions ? options.requireConditions : false);
     const [values, setValues] = (0, $hgUW1$useState)([]);
     const [id, setResource] = (0, $hgUW1$useState)(resourceId);
     const [rootUrl, setRootUrl] = (0, $hgUW1$useState)(rootAPIUrl);
@@ -1349,63 +1311,43 @@ const $1d3d480a9cfaabe0$var$useDatastore = (resourceId, rootAPIUrl, options, add
     const [count, setCount] = (0, $hgUW1$useState)(null);
     const [columns, setColumns] = (0, $hgUW1$useState)([]);
     const [offset, setOffset] = (0, $hgUW1$useState)(options.offset ? options.offset : 0);
-    const [loading, setLoading] = (0, $hgUW1$useState)(false);
     const [conditions, setConditions] = (0, $hgUW1$useState)(options.conditions ? options.conditions : undefined);
     const [sort, setSort] = (0, $hgUW1$useState)(options.sort ? options.sort : undefined);
     const [groupings, setGroupings] = (0, $hgUW1$useState)(options.groupings ? options.groupings : undefined);
     const [schema, setSchema] = (0, $hgUW1$useState)({});
     // const [joins, setJoins] = useState()
     const [properties, setProperties] = (0, $hgUW1$useState)(options.properties ? options.properties : undefined);
-    const prevLimitRef = (0, $hgUW1$useRef)();
-    const prevOffsetRef = (0, $hgUW1$useRef)();
-    (0, $hgUW1$useEffect)(()=>{
-        prevLimitRef.current = limit;
-        prevOffsetRef.current = offset;
+    let params = {
+        keys: keys,
+        limit: limit,
+        offset: offset,
+        conditions: conditions,
+        sorts: sort,
+        properties: properties,
+        groupings: groupings,
+        ...additionalParams
+    };
+    const additionalParamsString = Object.keys(params).length ? `&${(0, $hgUW1$qs).stringify(params)}` : "";
+    const { data: data, isPending: isPending, error: error } = (0, $hgUW1$useQuery)({
+        queryKey: [
+            "datastore" + id + additionalParamsString
+        ],
+        queryFn: ()=>{
+            return fetch(`${rootUrl}/datastore/query/${id}?${additionalParamsString}`).then((res)=>res.json());
+        }
     });
-    const prevLimit = prevLimitRef.current;
-    const prevOffset = prevOffsetRef.current;
-    function fetchData() {
-        let newOffset = prevLimit === limit ? prevOffset !== offset ? offset : 0 : 0;
-        setOffset(newOffset);
-        (0, $0e7628cf73c71646$export$55f990b5477765d6)(id, rootUrl, {
-            keys: keys,
-            limit: limit,
-            offset: newOffset,
-            conditions: conditions,
-            sort: sort,
-            groupings: groupings,
-            prepareColumns: prepareColumns,
-            properties: properties,
-            setValues: setValues,
-            setCount: setCount,
-            setColumns: setColumns,
-            setLoading: setLoading,
-            setSchema: setSchema,
-            setProperties: setProperties
-        }, additionalParams);
-    }
     (0, $hgUW1$useEffect)(()=>{
-        if (!loading && !manual) {
-            if (!requireConditions) fetchData();
-            else if (requireConditions) {
-                if (conditions && conditions.length) fetchData();
-                else {
-                    setCount(null);
-                    setValues([]);
-                }
-            }
+        if (data) {
+            const propertyKeys = data.schema[id] && data.schema[id].fields ? Object.keys(data.schema[id].fields) : [];
+            setValues(data.results), setCount(data.count);
+            if (propertyKeys.length) setColumns(prepareColumns ? prepareColumns(propertyKeys) : propertyKeys);
+            setSchema(data.schema);
         }
     }, [
-        id,
-        rootUrl,
-        offset,
-        conditions,
-        sort,
-        limit,
-        requireConditions
+        data
     ]);
     return {
-        loading: loading,
+        loading: isPending,
         values: values,
         count: count,
         columns: columns,
@@ -1421,10 +1363,7 @@ const $1d3d480a9cfaabe0$var$useDatastore = (resourceId, rootAPIUrl, options, add
         setLimit: setLimit,
         setOffset: setOffset,
         setConditions: setConditions,
-        setSort: setSort,
-        setManual: setManual,
-        setRequireConditions: setRequireConditions,
-        fetchData: fetchData
+        setSort: setSort
     };
 };
 var $1d3d480a9cfaabe0$export$2e2bcd8739ae039 = $1d3d480a9cfaabe0$var$useDatastore;
@@ -2194,8 +2133,15 @@ var $6380a4a580b24362$export$2e2bcd8739ae039 = $6380a4a580b24362$var$DataTableHe
 
 const $bef7bff2823feea2$var$QueryTitle = ({ conditions: conditions, schema: schema, customColumns: customColumns })=>{
     const { fields: fields } = schema;
-    if (!conditions || !conditions.length) return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Fragment), {
-        children: "Add a filter"
+    const prependedMessage = /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Fragment), {
+        children: "Data filters: "
+    });
+    if (!conditions || !conditions.length) return /*#__PURE__*/ (0, $hgUW1$jsxs)("p", {
+        className: "ds-u-margin-y--0",
+        children: [
+            prependedMessage,
+            " none"
+        ]
     });
     function formatValue(text, property) {
         if (customColumns && customColumns.length > 0) {
@@ -2207,42 +2153,48 @@ const $bef7bff2823feea2$var$QueryTitle = ({ conditions: conditions, schema: sche
             return text;
         } else return text;
     }
-    return /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+    return /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
         className: "dc-querybuilder-title",
-        children: conditions.map((c)=>{
-            const field = fields[c.property];
-            const description = field && field.description ? field.description : c.property;
-            const operator = (0, $7264a673914aa746$export$5f89a5ae87bc48e1).find((op)=>op.value === c.operator);
-            const cleanedText = (0, $7264a673914aa746$export$6b5e57d20078142b)(c.value);
-            const formattedText = formatValue(cleanedText, c.property);
-            return /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
-                className: "ds-u-fill--background ds-u-padding--1 ds-u-margin-y--1 ds-u-display--inline-block ds-u-font-weight--semibold",
-                children: [
-                    /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
-                        className: "ds-u-font-weight--bold",
-                        children: description
-                    }),
-                    " ",
-                    /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
-                        className: "ds-u-font-weight--normal",
-                        children: operator.label.toUpperCase()
+        children: [
+            /*#__PURE__*/ (0, $hgUW1$jsx)("p", {
+                className: "ds-u-margin-y--0",
+                children: prependedMessage
+            }),
+            conditions.map((c)=>{
+                const field = fields[c.property];
+                const description = field && field.description ? field.description : c.property;
+                const operator = (0, $7264a673914aa746$export$5f89a5ae87bc48e1).find((op)=>op.value === c.operator);
+                const cleanedText = (0, $7264a673914aa746$export$6b5e57d20078142b)(c.value);
+                const formattedText = formatValue(cleanedText, c.property);
+                return /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
+                    className: "ds-u-fill--background ds-u-padding--1 ds-u-margin-y--1 ds-u-display--inline-block ds-u-font-weight--semibold",
+                    children: [
+                        /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                            className: "ds-u-font-weight--bold",
+                            children: description
+                        }),
+                        " ",
+                        /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                            className: "ds-u-font-weight--normal",
+                            children: operator.label.toUpperCase()
+                        }),
+                        " ",
+                        /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                            className: "ds-u-color--success",
+                            children: formattedText
+                        })
+                    ]
+                });
+            }).reduce((prev, curr)=>[
+                    prev,
+                    /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Badge), {
+                        className: "ds-u-margin-x--1",
+                        variation: "info",
+                        children: "AND"
                     }),
-                    " ",
-                    /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
-                        className: "ds-u-color--success",
-                        children: formattedText
-                    })
-                ]
-            });
-        }).reduce((prev, curr)=>[
-                prev,
-                /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Badge), {
-                    className: "ds-u-margin-x--1",
-                    variation: "info",
-                    children: "AND"
-                }),
-                curr
-            ])
+                    curr
+                ])
+        ]
     });
 };
 var $bef7bff2823feea2$export$2e2bcd8739ae039 = $bef7bff2823feea2$var$QueryTitle;
@@ -2788,7 +2740,7 @@ const $7357cc0f79f9c514$var$Resource = ({ distributions: distributions, resource
                 className: "ds-l-col--12 ds-u-padding-left--0 ds-text-heading--2xl",
                 children: "Resources"
             }),
-            distributions.length && /*#__PURE__*/ (0, $hgUW1$jsx)("ul", {
+            distributions.length ? /*#__PURE__*/ (0, $hgUW1$jsx)("ul", {
                 className: "ds-c-list ds-c-list--bare dc-c-resource-full-width",
                 children: distributions.map((dist)=>{
                     const fileFormat = getFormatType(dist);
@@ -2831,6 +2783,8 @@ const $7357cc0f79f9c514$var$Resource = ({ distributions: distributions, resource
                         ]
                     }, dist.identifier);
                 })
+            }) : /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                className: "ds-u-margin-top--2"
             })
         ]
     });
@@ -3049,7 +3003,7 @@ var $6012b86ffcaf3f71$export$2e2bcd8739ae039 = (0, $61ff88fb3f6ee2c8$export$2e2b
 
 
 const $a0f13962e513caa1$var$getSiteWideDataDictionary = (rootUrl, dataDictionaryUrl)=>{
-    const { data: data, isLoading: isLoading, error: error } = (0, $hgUW1$useQuery)({
+    const { data: data, isPending: isPending, error: error } = (0, $hgUW1$useQuery)({
         queryKey: [
             "dictionary"
         ],
@@ -3059,7 +3013,7 @@ const $a0f13962e513caa1$var$getSiteWideDataDictionary = (rootUrl, dataDictionary
     });
     return {
         siteWideDataDictionary: data,
-        dataDictionaryLoading: isLoading
+        dataDictionaryLoading: isPending
     };
 };
 const $a0f13962e513caa1$var$Dataset = ({ id: id, rootUrl: rootUrl, additionalParams: additionalParams, customColumns: customColumns, setDatasetTitle: setDatasetTitle, customMetadataMapping: customMetadataMapping, apiPageUrl: apiPageUrl = "/api", dataDictionaryUrl: dataDictionaryUrl, borderlessTabs: borderlessTabs = false, defaultPageSize: defaultPageSize = 25 })=>{
@@ -3070,7 +3024,7 @@ const $a0f13962e513caa1$var$Dataset = ({ id: id, rootUrl: rootUrl, additionalPar
     } : {
         conditions: []
     };
-    const { dataset: dataset } = (0, $b4aa9c66f2e86959$export$2e2bcd8739ae039)(id, rootUrl, additionalParams);
+    const { dataset: dataset, isPending: isPending } = (0, $b4aa9c66f2e86959$export$2e2bcd8739ae039)(id, rootUrl, additionalParams);
     const title = dataset.title ? dataset.title : "";
     const metadataMapping = {
         ...(0, $6da0396069e23175$export$bc27cf7ecf44639d),
@@ -3092,19 +3046,20 @@ const $a0f13962e513caa1$var$Dataset = ({ id: id, rootUrl: rootUrl, additionalPar
     const datasetDictionary = siteWideDataDictionary && resource && resource.schema[distribution.identifier] ? siteWideDataDictionary.data.fields.filter((field)=>{
         return Object.keys(resource.schema[distribution.identifier].fields).indexOf(field.name) !== -1;
     }) : null;
-    (0, $hgUW1$useEffect)(()=>{
+    const getlocalFileFormat = ()=>{
+        let localFileFormat = "";
         if (distribution.identifier) {
-            let localFileFormat = "";
             if (distribution.data.format) localFileFormat = distribution.data.format.toUpperCase();
             else if (distribution.data.mediaType) {
                 const mediaType = distribution.data.mediaType.split("/");
                 if (mediaType.length && mediaType[1]) localFileFormat = mediaType[1].toUpperCase();
             }
-            if (localFileFormat === "CSV") {
-                resource.setResource(distribution.identifier);
-                resource.setManual(false);
-            }
         }
+        return localFileFormat;
+    };
+    (0, $hgUW1$useEffect)(()=>{
+        const localFileFormat = getlocalFileFormat();
+        if (localFileFormat === "CSV") resource.setResource(distribution.identifier);
     }, [
         distribution
     ]);
@@ -3146,6 +3101,17 @@ const $a0f13962e513caa1$var$Dataset = ({ id: id, rootUrl: rootUrl, additionalPar
             })
         ]
     });
+    // The below code manages the selected tab in the Design System tab group manually to ensure we can still use the
+    // Data Table tab as the default since it no longer exists on initial render (By default, Overview will appear as default)
+    const getDefaultTab = ()=>{
+        return distribution && distribution.data && getlocalFileFormat() === "CSV" ? "data-table" : "overview";
+    };
+    const [selectedTab, setSelectedTab] = (0, $hgUW1$useState)(window.location.hash.substring(1) ? window.location.hash.substring(1) : getDefaultTab());
+    (0, $hgUW1$useEffect)(()=>{
+        setSelectedTab(getDefaultTab());
+    }, [
+        distribution
+    ]);
     return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Fragment), {
         children: dataset.error ? /*#__PURE__*/ (0, $hgUW1$jsx)((0, $026cb986f9fea2b1$export$2e2bcd8739ae039), {
             content: notFoundContent,
@@ -3193,11 +3159,13 @@ const $a0f13962e513caa1$var$Dataset = ({ id: id, rootUrl: rootUrl, additionalPar
                     className: "ds-l-row",
                     children: /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
                         className: "ds-l-md-col--12 dc-dataset",
-                        children: distribution && distribution.data && /*#__PURE__*/ (0, $hgUW1$jsxs)((0, $hgUW1$Tabs), {
-                            onChange: function noRefCheck() {},
-                            defaultSelectedId: window.location.hash.substring(1),
+                        children: !isPending && /*#__PURE__*/ (0, $hgUW1$jsxs)((0, $hgUW1$Tabs), {
+                            onChange: (selectedId, prevSelectedId)=>{
+                                setSelectedTab(selectedId);
+                            },
+                            selectedId: selectedTab,
                             children: [
-                                distribution.data.format === "csv" && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$TabPanel), {
+                                distribution && distribution.data && getlocalFileFormat() === "CSV" && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$TabPanel), {
                                     id: "data-table",
                                     tab: /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
                                         className: "ds-u-color--primary",
@@ -3236,7 +3204,7 @@ const $a0f13962e513caa1$var$Dataset = ({ id: id, rootUrl: rootUrl, additionalPar
                                         metadataMapping: metadataMapping
                                     })
                                 }),
-                                datasetDictionary && datasetDictionary.length ? /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$TabPanel), {
+                                distribution && distribution.data && datasetDictionary && datasetDictionary.length ? /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$TabPanel), {
                                     id: "data-dictionary",
                                     tab: /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
                                         className: "ds-u-color--primary",
@@ -3253,7 +3221,7 @@ const $a0f13962e513caa1$var$Dataset = ({ id: id, rootUrl: rootUrl, additionalPar
                                         title: "Data Dictionary"
                                     })
                                 }) : null,
-                                /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$TabPanel), {
+                                distribution && distribution.data && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$TabPanel), {
                                     id: "api",
                                     tab: /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
                                         className: "ds-u-color--primary",
@@ -5407,10 +5375,7 @@ const $dd6eb2b30d7ad75d$var$FilteredResourceBody = ({ id: id, dataset: dataset,
         manual: true
     }, additionalParams);
     (0, $hgUW1$useEffect)(()=>{
-        if (distribution.identifier) {
-            resource.setResource(distribution.identifier);
-            resource.setManual(false);
-        }
+        if (distribution.identifier) resource.setResource(distribution.identifier);
     }, [
         distribution
     ]);