@quillsql/react 2.13.18 → 2.13.20

package/dist/esm/components/Dashboard/DataLoader.d.ts

@@ -14,11 +14,12 @@ export type DataLoaderChildProps = {
     rowCount?: number;
     rowCountIsLoading?: boolean;
 };
-export default function DataLoader({ item, children, filters, userFilters, additionalProcessing: defaultAdditionalProcessing, }: {
+export default function DataLoader({ item, children, filters, userFilters, additionalProcessing: defaultAdditionalProcessing, reportMode, }: {
     item: QuillReport;
     filters: DashboardFilter[];
     userFilters?: InternalFilter[];
     additionalProcessing: AdditionalProcessing;
+    reportMode?: boolean;
     children: ({ isLoading, error, onPageChange, onSortChange, data, }: DataLoaderChildProps) => JSX.Element;
 }): JSX.Element;
 type ColorMapType = {
@@ -39,13 +40,14 @@ export type ChartDataLoaderChildProps = {
     rowCount?: number;
     rowCountIsLoading?: boolean;
 };
-export declare const ChartDataLoader: ({ item, children, dateBucket, additionalProcessing, filters, userFilters, }: {
+export declare const ChartDataLoader: ({ item, children, dateBucket, additionalProcessing, filters, userFilters, reportMode, }: {
     item: QuillReport;
     dateBucket?: string;
     mapColorsToFields?: (_report: QuillReport, _theme: QuillTheme) => ColorMapType;
     additionalProcessing: AdditionalProcessing;
     filters: DashboardFilter[];
     userFilters?: InternalFilter[];
+    reportMode?: boolean;
     children: ({ isLoading, error, data, dateBucket, rowCount, rowCountIsLoading, }: ChartDataLoaderChildProps) => JSX.Element;
 }) => JSX.Element;
 export {};

package/dist/esm/components/Dashboard/DataLoader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataLoader.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DataLoader.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,WAAW,EAAuB,MAAM,qBAAqB,CAAC;AACvE,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAajD,OAAO,EACL,oBAAoB,EAErB,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AA2BtE,MAAM,MAAM,oBAAoB,GAAG;IACjC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,YAAY,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACnE,IAAI,EAAE,WAAW,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B,CAAC;AAuFF,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,WAAW,EACX,oBAAoB,EAAE,2BAA2B,GAClD,EAAE;IACD,IAAI,EAAE,WAAW,CAAC;IAClB,OAAO,EAAE,eAAe,EAAE,CAAC;IAC3B,WAAW,CAAC,EAAE,cAAc,EAAE,CAAC;IAC/B,oBAAoB,EAAE,oBAAoB,CAAC;IAC3C,QAAQ,EAAE,CAAC,EACT,SAAS,EACT,KAAK,EACL,YAAY,EACZ,YAAY,EACZ,IAAI,GACL,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;CACzC,GAAG,GAAG,CAAC,OAAO,CA8Pd;AAED,KAAK,YAAY,GAAG;IAClB,CAAC,GAAG,EAAE,MAAM,GAAG;QACb,OAAO,EAAE,MAAM,CAAC;QAChB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,uBAAuB,CAAC,EAAE,MAAM,CAAC;QACjC,sBAAsB,CAAC,EAAE,MAAM,CAAC;KACjC,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG;IACtC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,WAAW,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B,CAAC;AAIF,eAAO,MAAM,eAAe,gFAOzB;IACD,IAAI,EAAE,WAAW,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB,CAAC,EAAE,CAClB,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,UAAU,KACf,YAAY,CAAC;IAClB,oBAAoB,EAAE,oBAAoB,CAAC;IAC3C,OAAO,EAAE,eAAe,EAAE,CAAC;IAC3B,WAAW,CAAC,EAAE,cAAc,EAAE,CAAC;IAC/B,QAAQ,EAAE,CAAC,EACT,SAAS,EACT,KAAK,EACL,IAAI,EACJ,UAAU,EACV,QAAQ,EACR,iBAAiB,GAClB,EAAE,yBAAyB,KAAK,GAAG,CAAC,OAAO,CAAC;CAC9C,KAAG,GAAG,CAAC,OA+GP,CAAC"}
+{"version":3,"file":"DataLoader.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DataLoader.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,WAAW,EAAuB,MAAM,qBAAqB,CAAC;AACvE,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAajD,OAAO,EACL,oBAAoB,EAErB,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AA2BtE,MAAM,MAAM,oBAAoB,GAAG;IACjC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,YAAY,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACnE,IAAI,EAAE,WAAW,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B,CAAC;AAuFF,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,WAAW,EACX,oBAAoB,EAAE,2BAA2B,EACjD,UAAkB,GACnB,EAAE;IACD,IAAI,EAAE,WAAW,CAAC;IAClB,OAAO,EAAE,eAAe,EAAE,CAAC;IAC3B,WAAW,CAAC,EAAE,cAAc,EAAE,CAAC;IAC/B,oBAAoB,EAAE,oBAAoB,CAAC;IAC3C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,CAAC,EACT,SAAS,EACT,KAAK,EACL,YAAY,EACZ,YAAY,EACZ,IAAI,GACL,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;CACzC,GAAG,GAAG,CAAC,OAAO,CAuTd;AAED,KAAK,YAAY,GAAG;IAClB,CAAC,GAAG,EAAE,MAAM,GAAG;QACb,OAAO,EAAE,MAAM,CAAC;QAChB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,uBAAuB,CAAC,EAAE,MAAM,CAAC;QACjC,sBAAsB,CAAC,EAAE,MAAM,CAAC;KACjC,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG;IACtC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,WAAW,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B,CAAC;AAIF,eAAO,MAAM,eAAe,4FAQzB;IACD,IAAI,EAAE,WAAW,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB,CAAC,EAAE,CAClB,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,UAAU,KACf,YAAY,CAAC;IAClB,oBAAoB,EAAE,oBAAoB,CAAC;IAC3C,OAAO,EAAE,eAAe,EAAE,CAAC;IAC3B,WAAW,CAAC,EAAE,cAAc,EAAE,CAAC;IAC/B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,CAAC,EACT,SAAS,EACT,KAAK,EACL,IAAI,EACJ,UAAU,EACV,QAAQ,EACR,iBAAiB,GAClB,EAAE,yBAAyB,KAAK,GAAG,CAAC,OAAO,CAAC;CAC9C,KAAG,GAAG,CAAC,OA2JP,CAAC"}

package/dist/esm/components/Dashboard/DataLoader.js

@@ -1,6 +1,6 @@
 import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
 import { useContext, useEffect, useMemo, useRef, useState } from 'react';
-import { ClientContext, DashboardContext, DashboardFiltersContext, SchemaDataContext, } from '../../Context';
+import { ClientContext, DashboardContext, DashboardFiltersContext, ReportFiltersContext, ReportsContext, SchemaDataContext, } from '../../Context';
 import { convertInternalReportToReport, EMPTY_INTERNAL_REPORT, fetchReport, fetchReportRowCount, } from '../../utils/report';
 import { shouldFetchMore, DEFAULT_PAGINATION, shouldSortInMemory, } from '../../utils/paginationProcessing';
 import { fetchResultsByReport, } from '../../utils/tableProcessing';
@@ -50,8 +50,8 @@ function filterValuesEquivalent(filters1, filters2) {
             mappedFilters1[key].label !== mappedFilters2[key]?.label ||
             mappedFilters1[key].table !== mappedFilters2[key]?.table ||
             mappedFilters1[key].filterType !== mappedFilters2[key]?.filterType ||
-            mappedFilters1[key].startDate !== mappedFilters2[key]?.startDate ||
-            mappedFilters1[key].endDate !== mappedFilters2[key]?.endDate ||
+            !equal(mappedFilters1[key].startDate, mappedFilters2[key]?.startDate) ||
+            !equal(mappedFilters1[key].endDate, mappedFilters2[key]?.endDate) ||
             !equal(mappedFilters1[key].comparisonRange, mappedFilters2[key]?.comparisonRange)) {
             return false;
         }
@@ -79,7 +79,7 @@ function userFilterValuesEquivalent(filters1, filters2) {
         return acc;
     }, {});
     for (const key in mappedFilters1) {
-        if (mappedFilters1[key]?.value !== mappedFilters2[key]?.value ||
+        if (!equal(mappedFilters1[key]?.value, mappedFilters2[key]?.value) ||
             mappedFilters1[key]?.operator !== mappedFilters2[key]?.operator ||
             mappedFilters1[key]?.fieldType !== mappedFilters2[key]?.fieldType ||
             mappedFilters1[key]?.filterType !== mappedFilters2[key]?.filterType) {
@@ -88,19 +88,35 @@ function userFilterValuesEquivalent(filters1, filters2) {
     }
     return true;
 }
-export default function DataLoader({ item, children, filters, userFilters, additionalProcessing: defaultAdditionalProcessing, }) {
+export default function DataLoader({ item, children, filters, userFilters, additionalProcessing: defaultAdditionalProcessing, reportMode = false, }) {
     const [client] = useContext(ClientContext);
     const [dashboard, dispatch] = useContext(DashboardContext);
     const { dashboardFilters } = useContext(DashboardFiltersContext);
+    const { reports, reportsDispatch, fetchIndividualReport } = useContext(ReportsContext);
+    const { reportFilters } = useContext(ReportFiltersContext);
+    const contextFilters = () => {
+        return reportMode
+            ? Object.values(reportFilters[item.id] ?? {}).map((f) => f.filter)
+            : Object.values(dashboardFilters[item.dashboardName] ?? {}).map((f) => f.filter);
+    };
     const [schemaData] = useContext(SchemaDataContext);
     const [loading, setLoading] = useState(!dashboard[item.id]);
     const [error, setError] = useState(undefined);
     const [previousPage, setPreviousPage] = useState(0);
     const [additionalProcessing, setAdditionalProcessing] = useState(defaultAdditionalProcessing);
     const chartReport = useMemo(() => {
-        const report = dashboard[item.id] ?? constructReportFromItem(item);
-        return convertInternalReportToReport(mergeComparisonRange(report));
-    }, [dashboard[item.id]]);
+        const report = (reportMode ? reports : dashboard)[item.id];
+        if (report) {
+            return convertInternalReportToReport(mergeComparisonRange(report), contextFilters());
+        }
+        else {
+            return constructReportFromItem(item);
+        }
+    }, [
+        (reportMode ? reports : dashboard)[item.id],
+        reportFilters,
+        dashboardFilters,
+    ]);
     const previousFilters = useRef(null);
     const previousUserFilters = useRef(null);
     const [rowCountIsLoading, setRowCountIsLoading] = useState(false);
@@ -123,11 +139,20 @@ export default function DataLoader({ item, children, filters, userFilters, addit
             const rowCount = await fetchReportRowCount(item.id, client, true, mergeCustomFilters(filters, userFilters ?? []), processing, schemaData.customFields, rowCountAbortController.current.signal);
             rowCountAbortController.current = null;
             if (rowCount) {
-                dispatch({
-                    type: 'UPDATE_DASHBOARD_ITEM',
-                    id: item.id,
-                    data: { rowCount },
-                });
+                if (reportMode) {
+                    reportsDispatch({
+                        type: 'UPDATE_REPORT',
+                        id: item.id,
+                        data: { rowCount },
+                    });
+                }
+                else {
+                    dispatch({
+                        type: 'UPDATE_DASHBOARD_ITEM',
+                        id: item.id,
+                        data: { rowCount },
+                    });
+                }
             }
         }
         catch (e) {
@@ -158,7 +183,7 @@ export default function DataLoader({ item, children, filters, userFilters, addit
         }
     };
     const onSortChange = (sort) => {
-        const report = dashboard[item.id];
+        const report = (reportMode ? reports : dashboard)[item.id];
         if (shouldSortInMemory(additionalProcessing.page ?? DEFAULT_PAGINATION, report?.rowCount, !!report?.pivot)) {
             return;
         }
@@ -185,17 +210,26 @@ export default function DataLoader({ item, children, filters, userFilters, addit
                     throw new Error('Error fetching chart');
                 }
                 let tempRows = [
-                    ...(dashboard[item.id]?.rows ?? []),
+                    ...((reportMode ? reports : dashboard)[item.id]?.rows ?? []),
                     ...paginatedRows.rows,
                 ];
                 if (resetRows) {
                     tempRows = paginatedRows.rows;
                 }
-                dispatch({
-                    type: 'UPDATE_DASHBOARD_ITEM',
-                    id: item.id,
-                    data: { rows: tempRows },
-                });
+                if (reportMode) {
+                    reportsDispatch({
+                        type: 'UPDATE_REPORT',
+                        id: item.id,
+                        data: { rows: tempRows, filtersApplied: userFilters },
+                    });
+                }
+                else {
+                    dispatch({
+                        type: 'UPDATE_DASHBOARD_ITEM',
+                        id: item.id,
+                        data: { rows: tempRows },
+                    });
+                }
                 setAdditionalProcessing(updatedProcessing);
             }
             catch (e) {
@@ -214,7 +248,7 @@ export default function DataLoader({ item, children, filters, userFilters, addit
         }
         const fetchRowsRequestId = rowsRequestId.current + 1;
         rowsRequestId.current = fetchRowsRequestId;
-        const tempReport = dashboard[item.id];
+        const tempReport = (reportMode ? reports : dashboard)[item.id];
         if (tempReport &&
             !didFiltersChange(tempReport, filters) &&
             userFilterValuesEquivalent(userFilters ?? [], previousUserFilters.current ?? []) &&
@@ -227,16 +261,30 @@ export default function DataLoader({ item, children, filters, userFilters, addit
         rowsAbortController.current?.abort();
         rowsAbortController.current = new AbortController();
         try {
-            const { report: fetchedReport, error } = await fetchReport(item.id, client, true, mergeCustomFilters(filters, userFilters ?? []), processing, undefined, schemaData.customFields, true, false, rowsAbortController.current.signal);
-            rowsAbortController.current = null;
+            if (reportMode) {
+                try {
+                    await fetchIndividualReport(item.id, 'Chart', true, filters, userFilters, processing, undefined, rowsAbortController.current || undefined);
+                    setError(undefined);
+                }
+                catch (e) {
+                    setError(e.message ?? 'Error fetching report');
+                }
+                rowsAbortController.current = null;
+            }
+            else {
+                const { report: fetchedReport, error } = await fetchReport(item.id, client, true, mergeCustomFilters(filters, userFilters ?? []), processing, undefined, schemaData.customFields, true, false, rowsAbortController.current.signal);
+                rowsAbortController.current = null;
+                dispatch({
+                    type: 'ADD_DASHBOARD_ITEM',
+                    id: item.id,
+                    data: { ...fetchedReport, triggerReload: false, rowCount: 0 }, // rowCount 0 indicates it's still loading if row length is nonzero
+                    appliedFilters: userFilters,
+                    loading: false,
+                });
+                setError(error);
+            }
             fetchRowCount(processing);
-            dispatch({
-                type: 'ADD_DASHBOARD_ITEM',
-                id: item.id,
-                data: { ...fetchedReport, triggerReload: false, rowCount: 0 }, // rowCount 0 indicates it's still loading if row length is nonzero
-            });
             setAdditionalProcessing(processing);
-            setError(error);
         }
         catch (e) {
             if (e instanceof Error && e.name === 'AbortError') {
@@ -254,9 +302,9 @@ export default function DataLoader({ item, children, filters, userFilters, addit
         if (!filters) {
             return;
         }
-        if ((previousFilters.current || dashboard[item.id]?.rows?.length) &&
-            filterValuesEquivalent(previousFilters.current ??
-                Object.values(dashboardFilters[item.dashboardName] ?? {}).map((f) => f.filter), filters) &&
+        if ((previousFilters.current ||
+            (reportMode ? reports : dashboard)[item.id]?.rows?.length) &&
+            filterValuesEquivalent(previousFilters.current ?? contextFilters(), filters) &&
             userFilterValuesEquivalent(previousUserFilters.current ?? [], userFilters ?? [])) {
             previousFilters.current = filters;
             return;
@@ -266,26 +314,33 @@ export default function DataLoader({ item, children, filters, userFilters, addit
         fetchReportHelper(additionalProcessing);
     }, [filters, userFilters, item.id]);
     useEffect(() => {
-        if (dashboard[item.id]?.triggerReload) {
+        if ((reportMode ? reports : dashboard)[item.id]?.triggerReload) {
             fetchReportHelper(additionalProcessing);
         }
-    }, [dashboard[item.id]]);
+    }, [(reportMode ? reports : dashboard)[item.id]]);
     return (_jsx(_Fragment, { children: children({
             isLoading: loading,
             error,
             onPageChange,
             onSortChange,
             data: chartReport,
-            rowCount: chartReport.rowCount,
+            rowCount: chartReport?.rowCount,
             rowCountIsLoading,
         }) }));
 }
 // The same data-loader pattern as above, but with special logic for charts
 // At some point these may be able to get merged into one function.
-export const ChartDataLoader = ({ item, children, dateBucket, additionalProcessing, filters, userFilters, }) => {
+export const ChartDataLoader = ({ item, children, dateBucket, additionalProcessing, filters, userFilters, reportMode = false, }) => {
     const [dashboard, dispatch] = useContext(DashboardContext);
     const { dashboardFilters } = useContext(DashboardFiltersContext);
-    const [loading, setLoading] = useState(!dashboard[item.id]);
+    const { reports, fetchIndividualReport } = useContext(ReportsContext);
+    const { reportFilters } = useContext(ReportFiltersContext);
+    const contextFilters = () => {
+        return reportMode
+            ? Object.values(reportFilters[item.id] ?? {}).map((f) => f.filter)
+            : Object.values(dashboardFilters[item.dashboardName] ?? {}).map((f) => f.filter);
+    };
+    const [loading, setLoading] = useState(!(reportMode ? reports : dashboard)[item.id]);
     const [error, setError] = useState(undefined);
     const [client] = useContext(ClientContext);
     const [schemaData] = useContext(SchemaDataContext);
@@ -294,14 +349,21 @@ export const ChartDataLoader = ({ item, children, dateBucket, additionalProcessi
     const previousDateBucket = useRef(undefined);
     const fetchReportAbortController = useRef(null);
     const chartReport = useMemo(() => {
-        const report = dashboard[item.id] ?? constructReportFromItem(item);
-        return convertInternalReportToReport(mergeComparisonRange(report));
-    }, [dashboard[item.id]]);
+        const report = reportMode ? reports[item.id] : dashboard[item.id];
+        if (!report) {
+            return constructReportFromItem(item);
+        }
+        return convertInternalReportToReport(mergeComparisonRange(report), contextFilters());
+    }, [
+        (reportMode ? reports : dashboard)[item.id],
+        reportFilters,
+        dashboardFilters,
+    ]);
     const fetchReportHelper = async (useReportTask = true) => {
         if (!client || !filters) {
             return;
         }
-        const tempReport = dashboard[item.id];
+        const tempReport = (reportMode ? reports : dashboard)[item.id];
         if (tempReport &&
             !didFiltersChange(tempReport, filters) &&
             userFilterValuesEquivalent(userFilters ?? [], previousUserFilters.current ?? []) &&
@@ -316,17 +378,34 @@ export const ChartDataLoader = ({ item, children, dateBucket, additionalProcessi
         fetchReportAbortController.current?.abort();
         fetchReportAbortController.current = new AbortController();
         try {
-            const { report, error } = await fetchReport(item.id, client, useReportTask, mergeCustomFilters(filters, userFilters ?? []), {
-                ...additionalProcessing,
-                ...(item.pivot ? {} : { page: DEFAULT_PAGINATION }),
-            }, dateBucket, schemaData.customFields, undefined, undefined, fetchReportAbortController.current.signal);
-            fetchReportAbortController.current = null;
-            dispatch({
-                type: 'ADD_DASHBOARD_ITEM',
-                id: item.id,
-                data: { ...report, triggerReload: false },
-            });
-            setError(error);
+            if (reportMode) {
+                try {
+                    await fetchIndividualReport(item.id, 'Chart', true, filters, userFilters, {
+                        ...additionalProcessing,
+                        ...(item.pivot ? {} : { page: DEFAULT_PAGINATION }),
+                    }, dateBucket, fetchReportAbortController.current);
+                    setError(undefined);
+                }
+                catch (e) {
+                    setError(e.message ?? 'Error fetching report');
+                }
+                fetchReportAbortController.current = null;
+            }
+            else {
+                const { report, error } = await fetchReport(item.id, client, useReportTask, mergeCustomFilters(filters, userFilters ?? []), {
+                    ...additionalProcessing,
+                    ...(item.pivot ? {} : { page: DEFAULT_PAGINATION }),
+                }, dateBucket, schemaData.customFields, undefined, undefined, fetchReportAbortController.current.signal);
+                fetchReportAbortController.current = null;
+                dispatch({
+                    type: 'ADD_DASHBOARD_ITEM',
+                    id: item.id,
+                    data: { ...report, triggerReload: false },
+                    appliedFilters: userFilters,
+                    loading: false,
+                });
+                setError(error);
+            }
         }
         catch (e) {
             if (e instanceof Error && e.name === 'AbortError') {
@@ -342,9 +421,9 @@ export const ChartDataLoader = ({ item, children, dateBucket, additionalProcessi
         if (!filters) {
             return;
         }
-        if ((previousFilters.current || dashboard[item.id]?.rows?.length) &&
-            filterValuesEquivalent(previousFilters.current ??
-                Object.values(dashboardFilters[item.dashboardName] ?? {}).map((f) => f.filter), filters) &&
+        if ((previousFilters.current ||
+            (reportMode ? reports : dashboard)[item.id]?.rows?.length) &&
+            filterValuesEquivalent(previousFilters.current ?? contextFilters(), filters) &&
             userFilterValuesEquivalent(previousUserFilters.current ?? [], userFilters ?? []) &&
             previousDateBucket.current === dateBucket) {
             previousFilters.current = filters;
@@ -354,13 +433,13 @@ export const ChartDataLoader = ({ item, children, dateBucket, additionalProcessi
         fetchReportHelper();
     }, [filters, userFilters, item.id, dateBucket]);
     useEffect(() => {
-        const tempReport = dashboard[item.id];
+        const tempReport = (reportMode ? reports : dashboard)[item.id];
         if (tempReport && tempReport.triggerReload) {
             fetchReportHelper();
         }
-    }, [dashboard[item.id]]);
+    }, [(reportMode ? reports : dashboard)[item.id]]);
     return children({
-        isLoading: loading,
+        isLoading: !chartReport || loading,
         data: chartReport,
         error,
         dateBucket,

package/dist/esm/hooks/useDashboard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useDashboard.d.ts","sourceRoot":"","sources":["../../../src/hooks/useDashboard.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAMpE,OAAO,EACL,eAAe,EAEf,cAAc,EACf,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAEtD,eAAO,MAAM,UAAU;uCAYR,CAAC,MAAM,EAAE,mBAAmB,KAAK,OAAO;CAYtD,CAAC;AAEF,eAAO,MAAM,YAAY,kBACR,MAAM,GAAG,IAAI,kBACZ,cAAc,EAAE;;;;2CAwLc,MAAM;qCA9J1B,MAAM,4CAEf;QACb,MAAM,EAAE,WAAW,GAAG;YAAE,EAAE,EAAE,MAAM,CAAA;SAAE,CAAC;QACrC,MAAM,EAAE,QAAQ,GAAG,QAAQ,CAAC;KAC7B,oBACiB;QAChB,OAAO,EAAE,eAAe,EAAE,CAAC;QAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAC;KAC5B;CAwKJ,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;;sDAuBrB;QACD,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,EAAE,eAAe,EAAE,CAAC;QAC3B,UAAU,CAAC,EAAE,eAAe,CAAC;KAC9B;4BA+CO,MAAM,oDAMT;QACD,OAAO,EAAE,MAAM,CAAC;QAChB,OAAO,EAAE,eAAe,EAAE,CAAC;QAC3B,UAAU,CAAC,EAAE,eAAe,CAAC;QAC7B,aAAa,CAAC,EAAE,cAAc,EAAE,CAAC;KAClC;4BA2FkC,MAAM;CA8B5C,CAAC"}
+{"version":3,"file":"useDashboard.d.ts","sourceRoot":"","sources":["../../../src/hooks/useDashboard.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAEpE,OAAO,EACL,eAAe,EAEf,cAAc,EACf,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAGtD,eAAO,MAAM,UAAU;uCAYR,CAAC,MAAM,EAAE,mBAAmB,KAAK,OAAO;CAYtD,CAAC;AAEF,eAAO,MAAM,YAAY,kBACR,MAAM,GAAG,IAAI,kBACZ,cAAc,EAAE;;;;2CA8Gc,MAAM;qCApF1B,MAAM,4CAEf;QACb,MAAM,EAAE,WAAW,GAAG;YAAE,EAAE,EAAE,MAAM,CAAA;SAAE,CAAC;QACrC,MAAM,EAAE,QAAQ,GAAG,QAAQ,CAAC;KAC7B,oBACiB;QAChB,OAAO,EAAE,eAAe,EAAE,CAAC;QAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAC;KAC5B;CA8FJ,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;;sDAuBrB;QACD,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,EAAE,eAAe,EAAE,CAAC;QAC3B,UAAU,CAAC,EAAE,eAAe,CAAC;KAC9B;4BA+CO,MAAM,oDAMT;QACD,OAAO,EAAE,MAAM,CAAC;QAChB,OAAO,EAAE,eAAe,EAAE,CAAC;QAC3B,UAAU,CAAC,EAAE,eAAe,CAAC;QAC7B,aAAa,CAAC,EAAE,cAAc,EAAE,CAAC;KAClC;4BA2FkC,MAAM;CA8B5C,CAAC"}

package/dist/esm/hooks/useDashboard.js

@@ -1,7 +1,8 @@
 import { useContext, useMemo } from 'react';
 import { ClientContext, DashboardConfigContext, DashboardContext, DashboardFiltersContext, } from '../Context';
-import { COMPARISON_RANGE, PRIMARY_RANGE, } from '../DateRangePicker/dateRangePickerUtils';
+import { PRIMARY_RANGE } from '../DateRangePicker/dateRangePickerUtils';
 import { DashboardFilterType, } from '../models/Filter';
+import { createDefaultDateFilter } from '../utils/filterProcessing';
 export const useReports = () => {
     const [dashboard, dispatch] = useContext(DashboardContext);
     const reloadReport = (id) => {
@@ -69,56 +70,8 @@ export const useDashboard = (dashboardName, customFilters) => {
                 filter.filter.options)) {
             return;
         }
-        const getComparisonRange = (dateFilter, rangeType) => {
-            const range = dateFilter?.presetRanges?.find((range) => range.value === dateFilter?.primaryRange?.value) ?? PRIMARY_RANGE[dateFilter?.primaryRange?.value ?? 'LAST_30_DAYS'];
-            return (dateFilter?.comparisonRange?.[rangeType] ??
-                COMPARISON_RANGE[dateFilter?.defaultComparisonRange ??
-                    'NO_COMPARISON']({
-                    startDate: !range.startDate || range.startDate instanceof Date
-                        ? range.startDate
-                        : new Date(range.startDate), // when range.startDate is a string
-                    endDate: !range.endDate || range.endDate instanceof Date
-                        ? range.endDate
-                        : new Date(range.endDate), // when range.endDate is a string
-                })?.[rangeType]);
-        };
-        const comparisonRangeStart = getComparisonRange(dashboard?.dateFilter, 'startDate');
-        const comparisonRangeEnd = getComparisonRange(dashboard?.dateFilter, 'endDate');
-        const range = dashboard?.dateFilter?.presetRanges?.find((range) => range.value === dashboard?.dateFilter?.primaryRange?.value) ??
-            PRIMARY_RANGE[dashboard?.dateFilter?.primaryRange?.value ?? 'LAST_30_DAYS'] ??
-            PRIMARY_RANGE['LAST_30_DAYS'];
         const dateFilter = dashboard?.dateFilter
-            ? {
-                ...dashboard?.dateFilter,
-                startDate: !range.startDate || range.startDate instanceof Date
-                    ? range.startDate
-                    : new Date(range.startDate), // when range.startDate is a string
-                endDate: !range.endDate || range.endDate instanceof Date
-                    ? range.endDate
-                    : new Date(range.endDate), // when range.endDate is a string
-                filterType: DashboardFilterType.Date,
-                dateField: [
-                    ...new Map(Object.values(dashboard?.sections ?? {})
-                        .flat()
-                        .map((report) => {
-                        const key = JSON.stringify(report.dateField);
-                        return [key, report.dateField];
-                    })).values(),
-                ],
-                preset: dashboard?.dateFilter.primaryRange,
-                dashboardName: overrideDashboardName ?? dashboardName,
-                comparisonRange: dashboard?.dateFilter.comparison &&
-                    comparisonRangeStart &&
-                    comparisonRangeEnd
-                    ? {
-                        startDate: comparisonRangeStart,
-                        endDate: comparisonRangeEnd,
-                        value: dashboard?.dateFilter.comparisonRange?.value ??
-                            dashboard.dateFilter?.defaultComparisonRange ??
-                            'NO_COMPARISON',
-                    }
-                    : undefined,
-            }
+            ? createDefaultDateFilter(dashboard?.dateFilter, Object.values(dashboard?.sections ?? {}).flat(), dashboardName)
             : undefined;
         // Append dateFilter to the filters unless it's undefined
         loadFiltersForDashboard(dashboardName, [...(dateFilter ? [dateFilter] : []), ...(dashboard?.filters ?? [])], undefined, customFilters);

package/dist/esm/hooks/useQuill.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useQuill.d.ts","sourceRoot":"","sources":["../../../src/hooks/useQuill.ts"],"names":[],"mappings":"AAcA,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EACL,WAAW,EAIZ,MAAM,yBAAyB,CAAC;AAIjC,MAAM,WAAW,KAAK;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,gBAAgB,EAAE,MAAM,CAAC;IACzB,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,QAAQ,cACR,MAAM,eACJ;IAAE,WAAW,EAAE,MAAM,CAAC;IAAC,cAAc,EAAE,MAAM,CAAA;CAAE,KAC3D;IACD,IAAI,EAAE,WAAW,GAAG,IAAI,CAAC;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,SAAS,EACL,CAAC,CAAC,QAAQ,EAAE,WAAW,KAAK,MAAM,GAAG,SAAS,CAAC,GAC/C,CAAC,MAAM,SAAS,CAAC,CAAC;CAkMvB,CAAC"}
+{"version":3,"file":"useQuill.d.ts","sourceRoot":"","sources":["../../../src/hooks/useQuill.ts"],"names":[],"mappings":"AAgBA,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EACL,WAAW,EAIZ,MAAM,yBAAyB,CAAC;AAIjC,MAAM,WAAW,KAAK;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,gBAAgB,EAAE,MAAM,CAAC;IACzB,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,QAAQ,cACR,MAAM,eACJ;IAAE,WAAW,EAAE,MAAM,CAAC;IAAC,cAAc,EAAE,MAAM,CAAA;CAAE,KAC3D;IACD,IAAI,EAAE,WAAW,GAAG,IAAI,CAAC;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,SAAS,EACL,CAAC,CAAC,QAAQ,EAAE,WAAW,KAAK,MAAM,GAAG,SAAS,CAAC,GAC/C,CAAC,MAAM,SAAS,CAAC,CAAC;CA4MvB,CAAC"}

package/dist/esm/hooks/useQuill.js

@@ -1,54 +1,60 @@
 import { useContext, useEffect, useMemo, useState } from 'react';
-import { ClientContext, DashboardContext, DashboardFiltersContext, SchemaDataContext, } from '../Context';
-import { convertInternalReportToReport, fetchReport } from '../utils/report';
+import { ClientContext, DashboardContext, DashboardFiltersContext, ReportFiltersContext, ReportsContext, SchemaDataContext, } from '../Context';
+import { convertInternalReportToReport } from '../utils/report';
 import { shouldFetchMore } from '../utils/paginationProcessing';
 import { fetchResultsByReport, } from '../utils/tableProcessing';
 import { getPointToPointPercentageChange, getSimplePercentageChange, getSumOfFields, } from '../utils/dataProcessing';
 import { mergeComparisonRange } from '../utils/merge';
 export const useQuill = (reportId, pagination) => {
-    const [dashboard, dispatch] = useContext(DashboardContext);
+    const { reports, reportsDispatch, fetchIndividualReport } = useContext(ReportsContext);
+    const [dashboard] = useContext(DashboardContext);
     const { dashboardFilters } = useContext(DashboardFiltersContext);
+    const { reportFilters, reportFiltersDispatch } = useContext(ReportFiltersContext);
     const specificDashboardFilters = useMemo(() => {
         if (!reportId)
             return [];
-        const dashboardName = dashboard[reportId]?.dashboardName;
+        const dashboardName = reports[reportId]?.dashboardName;
         if (!dashboardName)
             return [];
         return Object.values(dashboardFilters[dashboardName] ?? {}).map((f) => f.filter);
     }, [dashboardFilters, reportId, dashboard]);
+    const specificReportFilters = useMemo(() => {
+        if (!reportId)
+            return [];
+        return Object.values(reportFilters[reportId] ?? []).map((f) => f.filter);
+    }, [reportFilters, reportId]);
     const [schemaData] = useContext(SchemaDataContext);
     const [client] = useContext(ClientContext);
-    const [data, setData] = useState(null);
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState(undefined);
     const [previousPage, setPreviousPage] = useState(0);
     const processedReport = useMemo(() => {
-        return reportId && dashboard[reportId]
-            ? convertInternalReportToReport(mergeComparisonRange(dashboard[reportId]))
+        return reportId && (reports[reportId] || dashboard[reportId])
+            ? convertInternalReportToReport(mergeComparisonRange(reports[reportId] || dashboard[reportId]), specificReportFilters)
             : undefined;
-    }, [reportId, reportId && dashboard[reportId]]);
-    const [calculate, setCalculate] = useState(() => emptyCalculate);
-    function emptyCalculate() {
-        return undefined;
-    }
+    }, [
+        reportId,
+        reportId && (reports[reportId] || dashboard[reportId]),
+        specificReportFilters,
+    ]);
     const [additionalProcessing, setAdditionProcessing] = useState(pagination
         ? {
             page: pagination,
         }
         : undefined);
     function calculateFunction(calcType, options) {
-        if (!data) {
+        if (!processedReport || !processedReport.rows) {
             return undefined;
         }
         switch (calcType) {
             case 'SIMPLE_PERCENTAGE_CHANGE':
-                return getSimplePercentageChange(data);
+                return getSimplePercentageChange(processedReport);
             case 'POINT_TO_POINT_PERCENTAGE_CHANGE':
-                return getPointToPointPercentageChange(data);
+                return getPointToPointPercentageChange(processedReport);
             case 'SUM':
-                return getSumOfFields(data, options?.comparison ? true : false);
+                return getSumOfFields(processedReport, options?.comparison ? true : false);
             default:
-                return getSimplePercentageChange(data);
+                return getSimplePercentageChange(processedReport);
         }
     }
     const fetchMore = (page) => {
@@ -83,19 +89,26 @@ export const useQuill = (reportId, pagination) => {
         if (!client) {
             return;
         }
-        if (!loading && reportId && data) {
+        if (!loading && reportId && processedReport) {
             setLoading(true);
             try {
                 const updatedProcessing = { ...additionalProcessing, ...processing };
-                const paginatedRows = await fetchResultsByReport(reportId, client, updatedProcessing, specificDashboardFilters, schemaData.customFields);
+                const paginatedRows = await fetchResultsByReport(reportId, client, updatedProcessing, reportFilters[reportId], schemaData.customFields);
                 if (paginatedRows.error) {
                     throw new Error('Error fetching chart');
                 }
-                let tempRows = [...data.rows, ...paginatedRows.rows];
+                let tempRows = [...processedReport.rows, ...paginatedRows.rows];
                 if (resetRows) {
                     tempRows = paginatedRows.rows;
                 }
-                setData({ ...data, rows: tempRows });
+                reportsDispatch({
+                    type: 'UPDATE_REPORT',
+                    id: reportId,
+                    data: {
+                        ...reports[reportId],
+                        rows: tempRows,
+                    },
+                });
                 setTimeout(() => {
                     setLoading(false);
                 }, 200);
@@ -106,46 +119,55 @@ export const useQuill = (reportId, pagination) => {
             }
         }
     };
-    const fetchReportHelper = async (curReportId, useReportTask = true, additionalProcessing) => {
+    const fetchReportHelper = async (curReportId, additionalProcessing) => {
         if (!client) {
             return;
         }
-        if (dashboard && dashboard[curReportId]) {
-            setData(convertInternalReportToReport(mergeComparisonRange(dashboard[curReportId])));
+        //FIXME: these two early returns don't check if the pagination lines up
+        if (reports[curReportId]) {
+            setLoading(false);
+            return;
+        }
+        if (dashboard[curReportId]) {
+            reportsDispatch({
+                type: 'ADD_REPORT',
+                id: curReportId,
+                data: reports[curReportId],
+            });
             setLoading(false);
             return;
         }
+        if (specificDashboardFilters.length && !specificReportFilters.length) {
+            reportFiltersDispatch({
+                type: 'ADD_REPORT_FILTERS',
+                id: curReportId,
+                data: Object.values(dashboardFilters[curReportId] ?? []),
+            });
+        }
         setLoading(true);
-        const { report, error } = await fetchReport(curReportId, client, useReportTask, specificDashboardFilters, additionalProcessing, undefined, schemaData.customFields, undefined, undefined, undefined, !specificDashboardFilters?.length);
-        dispatch({
-            type: 'ADD_DASHBOARD_ITEM',
-            id: reportId,
-            data: {
-                ...report,
-                filtersApplied: specificDashboardFilters,
-                triggerReload: false,
-            },
-        });
-        setData(convertInternalReportToReport(mergeComparisonRange(report)));
-        setError(error);
-        setLoading(false);
+        try {
+            await fetchIndividualReport(curReportId, 'useQuill', true, specificReportFilters, [], additionalProcessing);
+        }
+        catch (error) {
+            setError(error.message ?? 'Error fetching report');
+        }
+        finally {
+            setLoading(false);
+        }
     };
     useEffect(() => {
         if (reportId) {
-            fetchReportHelper(reportId, pagination ? true : false, {
+            fetchReportHelper(reportId, {
                 page: pagination,
             });
         }
-    }, [reportId, dashboard]);
-    useEffect(() => {
-        setCalculate(() => calculateFunction);
-    }, [data]);
+    }, [reportId]);
     return {
-        data: processedReport ?? data,
+        data: processedReport ?? null,
         loading,
         error,
         fetchMore,
         setSort,
-        calculate,
+        calculate: calculateFunction,
     };
 };