@civicactions/cmsds-open-data-components 3.1.3-alpha.dd4 → 3.1.5

package/dist/main.js

@@ -9,9 +9,9 @@ import $hgUW1$swaggeruireact from "swagger-ui-react";
 import "swagger-ui-react/swagger-ui.css";
 import $hgUW1$axios from "axios";
 import {useQuery as $hgUW1$useQuery, QueryClient as $hgUW1$QueryClient, QueryClientProvider as $hgUW1$QueryClientProvider} from "@tanstack/react-query";
-import $hgUW1$dompurify from "dompurify";
-import $hgUW1$reacttexttruncate from "react-text-truncate";
 import {useMediaQuery as $hgUW1$useMediaQuery} from "react-responsive";
+import $hgUW1$dompurify from "dompurify";
+import $hgUW1$lodashtruncate from "lodash.truncate";
 import {createColumnHelper as $hgUW1$createColumnHelper, useReactTable as $hgUW1$useReactTable, getCoreRowModel as $hgUW1$getCoreRowModel, getSortedRowModel as $hgUW1$getSortedRowModel, flexRender as $hgUW1$flexRender, getPaginationRowModel as $hgUW1$getPaginationRowModel} from "@tanstack/react-table";
 import $hgUW1$reactdatepicker from "react-datepicker";
 import "react-datepicker/dist/react-datepicker.css";
@@ -266,8 +266,6 @@ var $61ff88fb3f6ee2c8$export$2e2bcd8739ae039 = $61ff88fb3f6ee2c8$var$withQueryPr
 
 
 
-
-
 const $b61856b23f5f58a2$var$LargeFileDialog = (props)=>{
     const [modalOpen, setModalOpen] = (0, $hgUW1$useState)(false);
     const { downloadUrl: downloadUrl } = props;
@@ -519,24 +517,23 @@ var $bd76a91923d7e8a7$export$2e2bcd8739ae039 = $bd76a91923d7e8a7$var$Transformed
 
 
 
-function $52c6454cae137465$var$prepDescription(description) {
-    if (!description) return;
-    if (description.length > 1 && description.substring(0, 1) === "<") {
-        const elementTagStart = description.indexOf("<");
-        const elementTagEnd = description.indexOf(">");
-        const elementTagInner = description.substring(elementTagStart + 1, elementTagEnd);
-        const elementTagLength = elementTagInner.length;
-        const isolatedDescriptionStart = description.indexOf(`<${elementTagInner}>`) + (elementTagLength + 2);
-        const isolatedDescriptionEnd = description.indexOf(`</${elementTagInner}>`);
-        const isolatedDescription = description.substring(isolatedDescriptionStart, isolatedDescriptionEnd);
-        return (0, $hgUW1$dompurify).sanitize(isolatedDescription, {
-            ALLOWED_TAGS: []
-        });
-    }
-    return (0, $hgUW1$dompurify).sanitize(description, {
+
+
+function $1a2bf34e2a8f6b80$export$59a943b34a82e690(textString, textLength = 240) {
+    if (!textString) return "";
+    let cleanedText = textString;
+    if (cleanedText.split("</p>").length > 1) cleanedText = cleanedText.split("</p>")[0];
+    if (cleanedText.split("<br/>").length > 1) cleanedText = cleanedText.split("<br/>")[0];
+    cleanedText = (0, $hgUW1$lodashtruncate)(cleanedText, {
+        "length": textLength,
+        "separator": " "
+    });
+    return (0, $hgUW1$dompurify).sanitize(cleanedText, {
         ALLOWED_TAGS: []
     });
 }
+
+
 const $52c6454cae137465$var$DatasetSearchListItem = (props)=>{
     const desktop = (0, $hgUW1$useMediaQuery)({
         minWidth: 1024
@@ -548,12 +545,6 @@ const $52c6454cae137465$var$DatasetSearchListItem = (props)=>{
         linkContainerClasses = "ds-l-col--auto";
         linkClasses = "ds-u-display--block ds-u-text-align--left";
     }
-    const truncatedDescription = /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$reacttexttruncate), {
-        line: 3,
-        element: "p",
-        truncateText: "\u2026",
-        text: $52c6454cae137465$var$prepDescription(description)
-    });
     return /*#__PURE__*/ (0, $hgUW1$jsx)("li", {
         className: "dc-c-search-list-item ds-u-padding-top--3",
         children: /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
@@ -586,7 +577,7 @@ const $52c6454cae137465$var$DatasetSearchListItem = (props)=>{
                     className: "ds-l-row",
                     children: /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
                         className: "ds-l-col--12 ds-l-md-col--12",
-                        children: truncatedDescription
+                        children: (0, $1a2bf34e2a8f6b80$export$59a943b34a82e690)(description)
                     })
                 }),
                 /*#__PURE__*/ (0, $hgUW1$jsxs)("ul", {
@@ -971,15 +962,19 @@ const $e873081a6e8f024e$var$DatasetSearch = (props)=>{
         pageSize,
         page
     ]);
+    (0, $hgUW1$useEffect)(()=>{
+        setPage(1);
+    }, [
+        fulltext,
+        selectedFacets
+    ]);
     (0, $hgUW1$useEffect)(()=>{
         var params = buildSearchParams(true);
         if (params !== location.search) setSearchParams(params);
     }, [
         page,
         sort,
-        sortOrder,
-        fulltext,
-        selectedFacets
+        sortOrder
     ]);
     function resetFilters() {
         setFullText(defaultFulltext);
@@ -1010,7 +1005,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 +1105,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"
@@ -1259,6 +1254,7 @@ var $e873081a6e8f024e$export$2e2bcd8739ae039 = (0, $61ff88fb3f6ee2c8$export$2e2b
 
 
 
+
 const $b4aa9c66f2e86959$var$useMetastoreDataset = (datasetId, rootAPIUrl, additionalParams = {})=>{
     const [dataset, setDataset] = (0, $hgUW1$useState)({
         title: "",
@@ -1271,24 +1267,31 @@ 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({
+    const { data: data, isPending: isPending } = (0, $hgUW1$useQuery)({
+        queryKey: [
+            "metastore" + id + additionalParamsString
+        ],
+        queryFn: ()=>{
+            return (0, $hgUW1$axios).get(`${rootUrl}/metastore/schemas/dataset/items/${id}?show-reference-ids${additionalParamsString}`).then((res)=>res.data).catch((error)=>{
+                return {
                     title: dataset.title,
                     distribution: dataset.distribution,
                     error: error,
                     description: dataset.description,
                     identifier: dataset.identifier,
                     modified: dataset.modified
-                }));
+                };
+            });
         }
-        fetchData();
+    });
+    (0, $hgUW1$useEffect)(()=>{
+        if (!isPending && data && data != dataset) setDataset(data);
     }, [
-        id,
-        rootUrl
+        data
     ]);
     return {
         dataset: dataset,
+        isPending: isPending,
         setId: setId,
         setRootUrl: setRootUrl
     };
@@ -1301,47 +1304,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 +1314,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 +1366,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;
@@ -2121,7 +2063,7 @@ const $6380a4a580b24362$var$DataTableHeader = ({ resource: resource, downloadURL
             children: [
                 /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
                     className: "ds-l-col--12 ds-l-lg-col--4",
-                    children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $2ed0091f7e32d1e6$export$2e2bcd8739ae039), {
+                    children: !resource.loading && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $2ed0091f7e32d1e6$export$2e2bcd8739ae039), {
                         totalRows: intCount,
                         limit: limit,
                         offset: offset
@@ -2206,8 +2148,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) {
@@ -2219,42 +2168,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;
@@ -2617,7 +2572,7 @@ const $a35cf16d1488f54e$var$DatasetTable = ({ id: id, distribution: distribution
                     loading: resource.loading
                 })
             }),
-            /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+            !resource.loading && /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
                 className: "ds-u-display--flex ds-u-flex-wrap--wrap ds-u-justify-content--end ds-u-md-justify-content--between ds-u-margin-top--2 ds-u-align-items--center",
                 children: [
                     /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Pagination), {
@@ -2653,7 +2608,11 @@ const $a35cf16d1488f54e$var$DatasetTable = ({ id: id, distribution: distribution
             })
         ]
     });
-    else return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Fragment), {});
+    else return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Spinner), {
+        "aria-valuetext": "Dataset loading",
+        role: "status",
+        className: "ds-u-margin--3"
+    });
 };
 var $a35cf16d1488f54e$export$2e2bcd8739ae039 = $a35cf16d1488f54e$var$DatasetTable;
 
@@ -2725,6 +2684,7 @@ var $5644ebd2c3dbfd7b$export$2e2bcd8739ae039 = $5644ebd2c3dbfd7b$var$DatasetAddi
 
 
 
+
 const $0958733ee130fc44$var$ResourceInformation = ({ resource: resource })=>{
     const { count: count, columns: columns } = resource;
     return /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
@@ -2773,22 +2733,26 @@ const $0958733ee130fc44$var$ResourceInformation = ({ resource: resource })=>{
 var $0958733ee130fc44$export$2e2bcd8739ae039 = $0958733ee130fc44$var$ResourceInformation;
 
 
-
-const $7357cc0f79f9c514$var$Resource = ({ distributions: distributions, resource: resource, title: title })=>{
-    function getFormatType(dist) {
+function $f764661366bd9e1b$export$ee48b7e0e4eb536e(dist) {
+    if (dist && dist.data) {
         if (dist.data.format) return dist.data.format.toLowerCase();
         if (dist.data.mediaType) {
             const mediaType = dist.data.mediaType.split("/");
             if (mediaType.length && mediaType[1]) return mediaType[1].toLowerCase();
         }
-        if (dist.data["%Ref:downloadURL"] && dist.data["%Ref:downloadURL"].length && dist.data["%Ref:downloadURL"][0].data) {
+        if (dist.data["%Ref:downloadURL"].length && dist.data["%Ref:downloadURL"][0].data) {
             if (dist.data["%Ref:downloadURL"][0].data.mimeType) {
                 const mimeType = dist.data["%Ref:downloadURL"][0].data.mimeType.split("/");
                 if (mimeType.length && mimeType[1]) return mimeType[1].toLowerCase();
             }
         }
-        return "";
     }
+    return "";
+}
+
+
+
+const $7357cc0f79f9c514$var$Resource = ({ distributions: distributions, resource: resource, title: title })=>{
     const sm = (0, $hgUW1$useMediaQuery)({
         minWidth: 0,
         maxWidth: 767
@@ -2800,20 +2764,26 @@ 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);
+                    const fileFormat = (0, $f764661366bd9e1b$export$ee48b7e0e4eb536e)(dist);
                     return /*#__PURE__*/ (0, $hgUW1$jsxs)("li", {
                         className: `ds-u-display--flex ds-u-flex-wrap--wrap ${fileFormat !== "csv" && "ds-u-margin-bottom--2"}`,
                         children: [
                             /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                                className: "ds-u-font-weight--bold ds-u-font-size--lg ds-l-col--12 ds-l-md-col--6 ds-u-padding-left--0",
+                                className: "ds-u-font-weight--bold ds-u-font-size--lg ds-l-col--12 ds-l-md-col--6 ds-u-padding-left--0 ds-u-align-items--center ds-u-display--flex",
                                 children: [
                                     /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
-                                        className: "fa ds-u-color--primary ds-u-padding-right--1 fa-file-" + (fileFormat == "xlsx" ? "excel" : fileFormat)
+                                        className: "fa ds-u-color--primary ds-u-padding-right--1 ds-u-font-size--3xl fa-file-" + (fileFormat == "xlsx" ? "excel" : fileFormat)
                                     }),
-                                    dist.data.title ? dist.data.title : title + " (" + fileFormat.toUpperCase() + ")"
+                                    /*#__PURE__*/ (0, $hgUW1$jsxs)("p", {
+                                        className: "ds-u-margin-top--0",
+                                        children: [
+                                            dist.data.title ? dist.data.title : title,
+                                            " (" + fileFormat.toUpperCase() + ")"
+                                        ]
+                                    })
                                 ]
                             }),
                             /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
@@ -2834,8 +2804,14 @@ const $7357cc0f79f9c514$var$Resource = ({ distributions: distributions, resource
                                     ]
                                 })
                             }),
-                            dist.data.description && /*#__PURE__*/ (0, $hgUW1$jsx)("p", {
-                                children: dist.data.description
+                            dist.data.description && /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                                className: "ds-u-measure--wide ds-u-margin-bottom--7",
+                                children: /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                                    className: "dc-c-metadata-description ds-u-margin--0",
+                                    dangerouslySetInnerHTML: {
+                                        __html: (0, $hgUW1$dompurify).sanitize(dist.data.description)
+                                    }
+                                })
                             }),
                             fileFormat === "csv" && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $0958733ee130fc44$export$2e2bcd8739ae039), {
                                 resource: resource
@@ -2843,6 +2819,9 @@ const $7357cc0f79f9c514$var$Resource = ({ distributions: distributions, resource
                         ]
                     }, dist.identifier);
                 })
+            }) : /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                className: "ds-u-margin-bottom--2",
+                children: "No resources have been added to this dataset."
             })
         ]
     });
@@ -3205,6 +3184,7 @@ var $6012b86ffcaf3f71$export$2e2bcd8739ae039 = (0, $61ff88fb3f6ee2c8$export$2e2b
 
 
 
+
 const $a0f13962e513caa1$var$getDataDictionary = (dataDictionaryUrl, additionalParams)=>{
     const { data: data, isPending: isPending, error: error } = (0, $hgUW1$useQuery)({
         queryKey: [
@@ -3230,7 +3210,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),
@@ -3251,18 +3231,8 @@ const $a0f13962e513caa1$var$Dataset = ({ id: id, rootUrl: rootUrl, additionalPar
         return Object.keys(resource.schema[distribution.identifier].fields).indexOf(field.name) !== -1;
     }) : null;
     (0, $hgUW1$useEffect)(()=>{
-        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);
-            }
-        }
+        const localFileFormat = (0, $f764661366bd9e1b$export$ee48b7e0e4eb536e)(distribution);
+        if (localFileFormat === "csv") resource.setResource(distribution.identifier);
     }, [
         distribution
     ]);
@@ -3304,6 +3274,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 (0, $f764661366bd9e1b$export$ee48b7e0e4eb536e)(distribution) === "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,
@@ -3317,7 +3298,7 @@ const $a0f13962e513caa1$var$Dataset = ({ id: id, rootUrl: rootUrl, additionalPar
                         /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
                             className: "ds-l-md-col--9",
                             children: /*#__PURE__*/ (0, $hgUW1$jsx)("h1", {
-                                className: "ds-h1 title-underline",
+                                className: "ds-text-heading--3xl",
                                 children: title
                             })
                         }),
@@ -3337,7 +3318,7 @@ const $a0f13962e513caa1$var$Dataset = ({ id: id, rootUrl: rootUrl, additionalPar
                             className: "ds-l-md-col--9",
                             children: /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
                                 className: "ds-u-measure--wide ds-u-margin-bottom--7",
-                                children: /*#__PURE__*/ (0, $hgUW1$jsx)("p", {
+                                children: /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
                                     className: "dc-c-metadata-description ds-u-margin--0",
                                     dangerouslySetInnerHTML: {
                                         __html: (0, $hgUW1$dompurify).sanitize(dataset.description)
@@ -3351,11 +3332,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), {
+                                (0, $f764661366bd9e1b$export$ee48b7e0e4eb536e)(distribution) === "csv" && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$TabPanel), {
                                     id: "data-table",
                                     tab: /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
                                         className: "ds-u-color--primary",
@@ -3413,7 +3396,7 @@ const $a0f13962e513caa1$var$Dataset = ({ id: id, rootUrl: rootUrl, additionalPar
                                         additionalParams: additionalParams
                                     })
                                 }) : 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",
@@ -5278,7 +5261,6 @@ var $ec3e23baa005dc03$export$2e2bcd8739ae039 = $ec3e23baa005dc03$var$Breadcrumb;
 
 
 
-
 
 
 function $374c4669b044ddf8$var$getStartDate(condition, schema, id) {
@@ -5544,7 +5526,28 @@ var $3b6ca952e79f0695$export$2e2bcd8739ae039 = $3b6ca952e79f0695$var$QueryBuilde
 
 
 
-const $dd6eb2b30d7ad75d$var$FilteredResourceBody = ({ id: id, dataset: dataset, distIndex: distIndex, location: location, apiDocPage: apiDocPage, additionalParams: additionalParams, customColumns: customColumns, columnSettings: columnSettings, columnWidths: columnWidths, customTitle: customTitle, rootUrl: rootUrl })=>{
+
+
+const $de780c924c98fa31$var$FilteredResourceDescription = ({ distribution: distribution, dataset: dataset })=>{
+    if (!distribution && !dataset) return null;
+    let description = "";
+    if (distribution.data && distribution.data.description) description = distribution.data.description;
+    else if (dataset.description) description = dataset.description;
+    return /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+        className: "ds-u-measure--wide ds-u-margin-bottom--7",
+        children: /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+            className: "ds-u-margin-top--0 dc-c-metadata-description",
+            dangerouslySetInnerHTML: {
+                __html: (0, $hgUW1$dompurify).sanitize(description)
+            }
+        })
+    });
+};
+var $de780c924c98fa31$export$2e2bcd8739ae039 = $de780c924c98fa31$var$FilteredResourceDescription;
+
+
+
+const $dd6eb2b30d7ad75d$var$FilteredResourceBody = ({ id: id, dataset: dataset, distIndex: distIndex, location: location, additionalParams: additionalParams, customColumns: customColumns, columnSettings: columnSettings, columnWidths: columnWidths, customTitle: customTitle, rootUrl: rootUrl })=>{
     const navigate = (0, $hgUW1$useNavigate)();
     const [tablePadding, setTablePadding] = (0, $hgUW1$react).useState("ds-u-padding-y--1");
     let apiDocs = (0, $hgUW1$useRef)();
@@ -5567,10 +5570,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
     ]);
@@ -5592,14 +5592,17 @@ const $dd6eb2b30d7ad75d$var$FilteredResourceBody = ({ id: id, dataset: dataset,
                         dataset.title
                     ]
                 }),
-                /*#__PURE__*/ (0, $hgUW1$jsx)("h1", {
-                    className: "ds-title",
-                    children: customTitle ? customTitle : pageTitle
+                /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                    className: "ds-l-md-col--9",
+                    children: /*#__PURE__*/ (0, $hgUW1$jsx)("h1", {
+                        className: "ds-text-heading--3xl",
+                        children: customTitle ? customTitle : pageTitle
+                    })
                 }),
                 /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                    className: "ds-l-row",
-                    children: /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
-                        className: "ds-l-col--12 ds-u-color--gray ds-u-margin-y--1 ds-u-text-align--right",
+                    className: "ds-l-md-col--12 ds-u-color--gray ds-u-margin-y--1 ds-u-text-align--right",
+                    children: /*#__PURE__*/ (0, $hgUW1$jsxs)("p", {
+                        className: "ds-u-margin--0",
                         children: [
                             "Updated ",
                             /*#__PURE__*/ (0, $hgUW1$jsx)((0, $bd76a91923d7e8a7$export$2e2bcd8739ae039), {
@@ -5608,11 +5611,12 @@ const $dd6eb2b30d7ad75d$var$FilteredResourceBody = ({ id: id, dataset: dataset,
                         ]
                     })
                 }),
-                /*#__PURE__*/ (0, $hgUW1$jsx)("p", {
-                    className: "ds-u-margin-top--0 dc-c-metadata-description",
-                    dangerouslySetInnerHTML: {
-                        __html: (0, $hgUW1$dompurify).sanitize(distribution.data.description)
-                    }
+                /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                    className: "ds-l-md-col--9",
+                    children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $de780c924c98fa31$export$2e2bcd8739ae039), {
+                        distribution: distribution,
+                        dataset: dataset
+                    })
                 }),
                 resource.columns && Object.keys(resource.schema).length && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $3b6ca952e79f0695$export$2e2bcd8739ae039), {
                     resource: resource,
@@ -5677,6 +5681,7 @@ var $dd6eb2b30d7ad75d$export$2e2bcd8739ae039 = $dd6eb2b30d7ad75d$var$FilteredRes
 
 
 
+
 const $f61ecf9f84951a61$var$FilteredResource = ({ id: id, dist_id: dist_id, location: location, apiDocPage: apiDocPage, additionalParams: additionalParams, customColumns: customColumns, setDatasetTitle: setDatasetTitle, columnSettings: columnSettings, columnWidths: columnWidths, customTitle: customTitle, rootUrl: rootUrl })=>{
     const [ready, setReady] = (0, $hgUW1$useState)(false);
     const [error, setError] = (0, $hgUW1$useState)(false);
@@ -5745,7 +5750,7 @@ const $f61ecf9f84951a61$var$FilteredResource = ({ id: id, dist_id: dist_id, loca
         })
     });
 };
-var $f61ecf9f84951a61$export$2e2bcd8739ae039 = $f61ecf9f84951a61$var$FilteredResource;
+var $f61ecf9f84951a61$export$2e2bcd8739ae039 = (0, $61ff88fb3f6ee2c8$export$2e2bcd8739ae039)($f61ecf9f84951a61$var$FilteredResource);
 
 
 
@@ -5791,5 +5796,7 @@ var $90fb213ab8eeb2e7$export$2e2bcd8739ae039 = $90fb213ab8eeb2e7$var$useScrollTo
 
 
 
-export {$f57121650539d8c5$export$2e2bcd8739ae039 as NavBar, $c96c4b9ef7203c1f$export$2e2bcd8739ae039 as APIPage, $026cb986f9fea2b1$export$2e2bcd8739ae039 as PageNotFound, $e873081a6e8f024e$export$2e2bcd8739ae039 as DatasetSearch, $a0f13962e513caa1$export$2e2bcd8739ae039 as Dataset, $a35cf16d1488f54e$export$2e2bcd8739ae039 as DatasetTable, $a5a6a06d249c33b8$export$2e2bcd8739ae039 as Header, $a6df0aa147323304$export$2e2bcd8739ae039 as Footer, $669d2782ec2e2250$export$2e2bcd8739ae039 as SpecsAndLimits, $efc410f5f7ac5ef3$export$2e2bcd8739ae039 as useSearchAPI, $1d3d480a9cfaabe0$export$2e2bcd8739ae039 as useDatastore, $aa4450dcbeef3ac0$export$385a5aba38cc3325 as transformTableSortToQuerySort, $59a079354baa335c$export$2e2bcd8739ae039 as Hero, $52c6454cae137465$export$2e2bcd8739ae039 as DatasetSearchListItem, $789279954d8eff7f$export$2e2bcd8739ae039 as ApiDocumentation, $af099c546cb226c7$export$2e2bcd8739ae039 as ResourceHeader, $626282d9a03c51d5$export$2e2bcd8739ae039 as ResourcePreview, $072291d44ce1834a$export$2e2bcd8739ae039 as ResourceFooter, $ec3e23baa005dc03$export$2e2bcd8739ae039 as Breadcrumb, $bd76a91923d7e8a7$export$2e2bcd8739ae039 as TransformedDate, $d98f94c79ddf4e0e$export$2e2bcd8739ae039 as DataTable, $5644ebd2c3dbfd7b$export$eea3a12df15499ca as buildRows, $f61ecf9f84951a61$export$2e2bcd8739ae039 as FilteredResource, $bef7bff2823feea2$export$2e2bcd8739ae039 as QueryTitle, $7264a673914aa746$export$2b9377795161999 as buildOperatorOptions, $7264a673914aa746$export$e284ae5d89467c8f as convertUTCToLocalDate, $7264a673914aa746$export$6b5e57d20078142b as cleanText, $7264a673914aa746$export$8049e8f40a9bdfb8 as buildCustomColHeaders, $eb7821d186b1a389$export$2e2bcd8739ae039 as useAddLoginLink, $90fb213ab8eeb2e7$export$2e2bcd8739ae039 as useScrollToTop, $b4aa9c66f2e86959$export$2e2bcd8739ae039 as useMetastoreDataset, $6da0396069e23175$export$bc27cf7ecf44639d as defaultMetadataMapping, $2ed0091f7e32d1e6$export$2e2bcd8739ae039 as DataTablePageResults};
+
+
+export {$f57121650539d8c5$export$2e2bcd8739ae039 as NavBar, $c96c4b9ef7203c1f$export$2e2bcd8739ae039 as APIPage, $026cb986f9fea2b1$export$2e2bcd8739ae039 as PageNotFound, $e873081a6e8f024e$export$2e2bcd8739ae039 as DatasetSearch, $a0f13962e513caa1$export$2e2bcd8739ae039 as Dataset, $a35cf16d1488f54e$export$2e2bcd8739ae039 as DatasetTable, $a5a6a06d249c33b8$export$2e2bcd8739ae039 as Header, $a6df0aa147323304$export$2e2bcd8739ae039 as Footer, $669d2782ec2e2250$export$2e2bcd8739ae039 as SpecsAndLimits, $efc410f5f7ac5ef3$export$2e2bcd8739ae039 as useSearchAPI, $1d3d480a9cfaabe0$export$2e2bcd8739ae039 as useDatastore, $aa4450dcbeef3ac0$export$385a5aba38cc3325 as transformTableSortToQuerySort, $59a079354baa335c$export$2e2bcd8739ae039 as Hero, $52c6454cae137465$export$2e2bcd8739ae039 as DatasetSearchListItem, $789279954d8eff7f$export$2e2bcd8739ae039 as ApiDocumentation, $af099c546cb226c7$export$2e2bcd8739ae039 as ResourceHeader, $626282d9a03c51d5$export$2e2bcd8739ae039 as ResourcePreview, $072291d44ce1834a$export$2e2bcd8739ae039 as ResourceFooter, $ec3e23baa005dc03$export$2e2bcd8739ae039 as Breadcrumb, $bd76a91923d7e8a7$export$2e2bcd8739ae039 as TransformedDate, $d98f94c79ddf4e0e$export$2e2bcd8739ae039 as DataTable, $5644ebd2c3dbfd7b$export$eea3a12df15499ca as buildRows, $f61ecf9f84951a61$export$2e2bcd8739ae039 as FilteredResource, $bef7bff2823feea2$export$2e2bcd8739ae039 as QueryTitle, $7264a673914aa746$export$2b9377795161999 as buildOperatorOptions, $7264a673914aa746$export$e284ae5d89467c8f as convertUTCToLocalDate, $7264a673914aa746$export$6b5e57d20078142b as cleanText, $7264a673914aa746$export$8049e8f40a9bdfb8 as buildCustomColHeaders, $eb7821d186b1a389$export$2e2bcd8739ae039 as useAddLoginLink, $90fb213ab8eeb2e7$export$2e2bcd8739ae039 as useScrollToTop, $b4aa9c66f2e86959$export$2e2bcd8739ae039 as useMetastoreDataset, $61ff88fb3f6ee2c8$export$2e2bcd8739ae039 as withQueryProvider, $6da0396069e23175$export$bc27cf7ecf44639d as defaultMetadataMapping, $2ed0091f7e32d1e6$export$2e2bcd8739ae039 as DataTablePageResults, $1a2bf34e2a8f6b80$export$59a943b34a82e690 as truncateText};
 //# sourceMappingURL=main.js.map