@quillsql/react 2.13.7 → 2.13.9

package/dist/cjs/Dashboard.js

@@ -26,6 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = Dashboard;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const Chart_1 = require("./Chart");
@@ -81,7 +82,7 @@ const sortByOrdering = (a, b) => {
     return a.order - b.order;
 };
 const customOperatorOptions = {
-    [Filter_1.FieldTypes.Number]: [
+    [Filter_1.FieldType.Number]: [
         Filter_1.NumberOperator.EqualTo,
         Filter_1.NumberOperator.NotEqualTo,
         Filter_1.NumberOperator.GreaterThan,
@@ -91,7 +92,7 @@ const customOperatorOptions = {
         Filter_1.NullOperator.IsNotNull,
         Filter_1.NullOperator.IsNull,
     ],
-    [Filter_1.FieldTypes.String]: [
+    [Filter_1.FieldType.String]: [
         Filter_1.StringOperator.IsExactly,
         Filter_1.StringOperator.IsNotExactly,
         Filter_1.StringOperator.Contains,
@@ -100,7 +101,7 @@ const customOperatorOptions = {
         Filter_1.NullOperator.IsNotNull,
         Filter_1.NullOperator.IsNull,
     ],
-    [Filter_1.FieldTypes.Boolean]: [
+    [Filter_1.FieldType.Boolean]: [
         Filter_1.BoolOperator.EqualTo,
         Filter_1.BoolOperator.NotEqualTo,
         Filter_1.NullOperator.IsNotNull,
@@ -138,11 +139,22 @@ const customOperatorOptions = {
  * ### API Reference
  * @see https://docs.quillsql.com/components/dashboard
  */
-function Dashboard({ name, hidden = false, SelectComponent = QuillSelectWithCombo_1.QuillSelectComponentWithCombo, MultiSelectComponent = QuillMultiSelectWithCombo_1.QuillMultiSelectComponentWithCombo, ModalComponent = UiComponents_1.QuillModalComponent, ButtonComponent = UiComponents_1.MemoizedButton, SecondaryButtonComponent = UiComponents_1.MemoizedSecondaryButton, FilterTagComponent = ui_1.QuillFilterPopover, PopoverComponent = UiComponents_1.MemoizedPopover, TextInputComponent = UiComponents_1.QuillTextInput, EmptyDashboardComponent = UiComponents_1.QuillEmptyDashboardComponent, DateRangePickerComponent = QuillDateRangePicker_1.QuillDateRangePicker, MetricComponent = MetricComponent_1.default, ChartComponent = ChartComponent_1.default, TableComponent = TableComponent_1.default, TemplateMetricComponent = TemplateMetricComponent_1.default, TemplateChartComponent = TemplateChartComponent_1.default, TemplateTableComponent = TemplateTableComponent_1.default, DashboardSectionComponent = DashboardSection_1.default, DashboardSectionContainerComponent = DashboardSectionContainer_1.default, FilterContainerComponent = UiComponents_1.QuillFilterContainerComponent, DashboardLoadingComponent = UiComponents_1.QuillLoadingDashboardComponent, ErrorComponent = ChartError_1.QuillChartErrorWithAction, onClickReport, hoverActions, onChangeLoading, hideFilters, hideXAxis = false, hideYAxis = false, hideCartesianGrid = false, comparisonLineStyle = 'solid', containerStyle, className, chartContainerStyle = defaultChartContainerStyles, 
-// TODO: do something with these custom filters
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-filters, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors = true, templateDashboardName, pagination = { rowsPerPage: 10, rowsPerRequest: 50 }, }) {
-    const { isLoading, data, isDashboardFilterLoading, dashboardFilters: populatedDashboardFilters, reload, } = (0, useDashboard_1.useDashboard)(name);
+function Dashboard({ name, hidden = false, SelectComponent = QuillSelectWithCombo_1.QuillSelectComponentWithCombo, MultiSelectComponent = QuillMultiSelectWithCombo_1.QuillMultiSelectComponentWithCombo, ModalComponent = UiComponents_1.QuillModalComponent, ButtonComponent = UiComponents_1.MemoizedButton, SecondaryButtonComponent = UiComponents_1.MemoizedSecondaryButton, FilterTagComponent = ui_1.QuillFilterPopover, PopoverComponent = UiComponents_1.MemoizedPopover, TextInputComponent = UiComponents_1.QuillTextInput, EmptyDashboardComponent = UiComponents_1.QuillEmptyDashboardComponent, DateRangePickerComponent = QuillDateRangePicker_1.QuillDateRangePicker, MetricComponent = MetricComponent_1.default, ChartComponent = ChartComponent_1.default, TableComponent = TableComponent_1.default, TemplateMetricComponent = TemplateMetricComponent_1.default, TemplateChartComponent = TemplateChartComponent_1.default, TemplateTableComponent = TemplateTableComponent_1.default, DashboardSectionComponent = DashboardSection_1.default, DashboardSectionContainerComponent = DashboardSectionContainer_1.default, FilterContainerComponent = UiComponents_1.QuillFilterContainerComponent, DashboardLoadingComponent = UiComponents_1.QuillLoadingDashboardComponent, ErrorComponent = ChartError_1.QuillChartErrorWithAction, onClickReport, hoverActions, onChangeLoading, hideFilters, hideXAxis = false, hideYAxis = false, hideCartesianGrid = false, comparisonLineStyle = 'solid', containerStyle, className, chartContainerStyle = defaultChartContainerStyles, filters, onUserFiltersUpdated, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors = true, templateDashboardName, pagination = { rowsPerPage: 10, rowsPerRequest: 50 }, }) {
+    const [userFilters, setUserFilters] = (0, react_1.useState)({});
+    (0, react_1.useEffect)(() => {
+        onUserFiltersUpdated?.(Object.values(userFilters));
+    }, [userFilters]);
+    const { isLoading, data, isDashboardFilterLoading, dashboardFilters: populatedDashboardFilters, reload, } = (0, useDashboard_1.useDashboard)(name, (filters?.map((f) => (0, Filter_1.convertCustomFilter)(f)) ?? []).concat(Object.values(userFilters) ?? []));
+    const mounted = (0, react_1.useRef)(false);
+    (0, react_1.useEffect)(() => {
+        if (!mounted.current) {
+            mounted.current = true;
+            return;
+        }
+        reload(name, false, undefined, {
+            filters: populatedDashboardFilters ?? [],
+        });
+    }, [filters, userFilters]);
     const [client, isClientLoading] = (0, react_1.useContext)(Context_1.ClientContext);
     const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
     const [schemaData] = (0, react_1.useContext)(Context_1.SchemaDataContext);
@@ -159,8 +171,10 @@ filters, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors
                     return {
                         label: elem.label,
                         value: elem.value,
-                        startDate: dateRangePickerUtils_1.PRIMARY_RANGE[elem.value].start,
-                        endDate: dateRangePickerUtils_1.PRIMARY_RANGE[elem.value].end,
+                        startDate: dateRangePickerUtils_1.PRIMARY_RANGE[elem.value]?.startDate ??
+                            dateRangePickerUtils_1.PRIMARY_RANGE['LAST_30_DAYS'].startDate,
+                        endDate: dateRangePickerUtils_1.PRIMARY_RANGE[elem.value]?.endDate ??
+                            dateRangePickerUtils_1.PRIMARY_RANGE['LAST_30_DAYS'].endDate,
                     };
                 }
                 return {
@@ -172,10 +186,11 @@ filters, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors
             }) ?? dateRangePickerUtils_1.defaultOptionsV2)
             : dateRangePickerUtils_1.defaultOptionsV2;
     }, [populatedDashboardFilters]);
-    const [userFilters, setUserFilters] = (0, react_1.useState)({});
     // A filter value can either be a string, an array of strings for a multiselect, or a date range (that could have a comparison range)
     const [filterValues, setFilterValues] = (0, react_1.useState)({});
     const prevClientIdRef = (0, react_1.useRef)(undefined);
+    const addFilterPopoverButtonRef = (0, react_1.useRef)(null);
+    const viewFiltersPopoverButtonRef = (0, react_1.useRef)(null);
     (0, react_1.useEffect)(() => {
         setFilterValues({});
         const clientIdChanged = prevClientIdRef.current !== client?.organizationId;
@@ -219,12 +234,7 @@ filters, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors
             .flatMap((section) => section.map((chart) => chart.referencedTables))
             .flat();
         if (tables && tables.length > 0) {
-            let intersection = new Set(tables[0]);
-            for (let i = 1; i < tables.length; ++i) {
-                const currentSet = new Set(tables[i]);
-                intersection = new Set(Array.from(intersection).filter((value) => currentSet.has(value)));
-            }
-            const tablesList = Array.from(intersection);
+            const tablesList = Array.from(new Set(tables));
             setReferencedTables(tablesList);
             // get all columns from the intersected tables
             const columns = tablesList
@@ -248,7 +258,7 @@ filters, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors
         }
     }, [data?.sections, schemaData.schema]);
     const handleOnClickDashboardItem = (elem) => onClickReport && onClickReport({ ...elem, _id: elem.id });
-    const updateFilter = (filter, value = null, comparison = null) => {
+    const updateFilter = (filter, value, comparison) => {
         if (!populatedDashboardFilters)
             return;
         let filterValue = {};
@@ -281,23 +291,25 @@ filters, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors
                 const key = comparison?.value ||
                     (filter.comparisonRange?.value ?? 'NO_COMPARISON');
                 let primaryRange = {
-                    start: value ? value.startDate : filter.startDate,
-                    end: value ? value.endDate : filter.endDate,
+                    startDate: value ? value.startDate : filter.startDate,
+                    endDate: value ? value.endDate : filter.endDate,
                 };
                 if (value && value.preset) {
                     preset = value.preset;
                     primaryRange = (0, dateRangePickerUtils_1.getRangeFromPresetOptions)(value.preset, presetOptions);
                 }
                 filterValue = {
-                    startDate: primaryRange.start,
-                    endDate: primaryRange.end,
+                    startDate: primaryRange.startDate,
+                    endDate: primaryRange.endDate,
                     preset: {
                         label: presetOptions.find((o) => o.value === preset)?.label ?? preset,
                         value: preset,
                     },
                     comparisonRange: {
-                        startDate: dateRangePickerUtils_1.COMPARISON_RANGE[key](primaryRange)?.start,
-                        endDate: dateRangePickerUtils_1.COMPARISON_RANGE[key](primaryRange)?.end,
+                        startDate: dateRangePickerUtils_1.COMPARISON_RANGE[key](primaryRange)
+                            ?.startDate,
+                        endDate: dateRangePickerUtils_1.COMPARISON_RANGE[key](primaryRange)
+                            ?.endDate,
                         value: key,
                     },
                 };
@@ -310,14 +322,17 @@ filters, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors
                 const primaryRange = value && value.preset
                     ? (0, dateRangePickerUtils_1.getRangeFromPresetOptions)(value.preset, presetOptions)
                     : {
-                        start: value?.startDate || filter.startDate,
-                        end: value?.endDate || filter.endDate,
+                        startDate: value?.startDate || filter.startDate,
+                        endDate: value?.endDate || filter.endDate,
                     };
                 const preset = value?.preset ? value.preset : '';
                 filterValue = {
-                    startDate: primaryRange.start,
-                    endDate: primaryRange.end,
-                    preset: { label: preset, value: preset },
+                    startDate: primaryRange.startDate,
+                    endDate: primaryRange.endDate,
+                    preset: {
+                        label: presetOptions.find((o) => o.value === preset)?.label ?? preset,
+                        value: preset,
+                    },
                 };
                 setFilterValues((filterValues) => ({
                     ...filterValues,
@@ -372,31 +387,25 @@ filters, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors
     if (hidden || isLoading || isClientLoading || !data?.sections) {
         return ((0, jsx_runtime_1.jsx)(DashboardLoadingComponent, { containerStyle: containerStyle, chartContainerStyle: chartContainerStyle }));
     }
-    return ((0, jsx_runtime_1.jsxs)("div", { className: className, ...(0, styles_1.styleToProps)(containerStyle), children: [data &&
-                data.customFiltersEnabled &&
-                !hideAdminErrors &&
-                !hideFilters &&
-                data &&
-                data.customFiltersEnabled &&
-                filterSchema &&
-                filterSchema.columns.length === 0 && ((0, jsx_runtime_1.jsx)("div", { style: { marginBottom: 10 }, children: (0, jsx_runtime_1.jsx)(UiComponents_1.QuillErrorMessageComponent, { errorMessage: "Warning: No custom filter options because there are no common views among the charts in the dashboard" }) })), (0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'row', alignItems: 'center' }, children: [!hideFilters && ((0, jsx_runtime_1.jsxs)(FilterContainerComponent, { children: [(populatedDashboardFilters ?? []).map((filter) => ((0, jsx_runtime_1.jsx)(DashboardFilter_1.DashboardFilter, { filter: {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: className, ...(0, styles_1.styleToProps)(containerStyle), children: [(0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'row', alignItems: 'center' }, children: [!hideFilters && ((0, jsx_runtime_1.jsxs)(FilterContainerComponent, { children: [(populatedDashboardFilters ?? []).map((filter) => ((0, jsx_runtime_1.jsx)(DashboardFilter_1.DashboardFilter, { filter: {
                                     ...filter,
                                     ...(filter.filterType === 'date_range' && {
                                         options: presetOptions,
                                     }),
                                     ...filterValues[filter.label],
-                                }, onChangeFilter: updateFilter, theme: theme, SelectComponent: SelectComponent, MultiSelectComponent: MultiSelectComponent, DateRangePickerComponent: DateRangePickerComponent, isLoading: isDashboardFilterLoading(filter.label) }, filter.label + name))), (0, jsx_runtime_1.jsxs)("div", { style: {
+                                }, onChangeFilter: updateFilter, theme: theme, SelectComponent: SelectComponent, MultiSelectComponent: MultiSelectComponent, DateRangePickerComponent: DateRangePickerComponent, isLoading: isDashboardFilterLoading(filter.label) }, filter.label + name))), data?.customFiltersEnabled &&
+                                Object.values(userFilters).length === 0 && ((0, jsx_runtime_1.jsxs)("div", { style: {
                                     display: 'flex',
                                     flexDirection: 'column',
-                                }, children: [data && data.customFiltersEnabled && ((0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: () => {
+                                }, ref: viewFiltersPopoverButtonRef, children: [(0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: () => {
                                             if (fieldValuesIsLoaded) {
-                                                setAddFilterPopoverIsOpen(true);
+                                                setAddFilterPopoverIsOpen(!addFilterPopoverIsOpen);
                                                 setFilterListIsOpen(false);
                                             }
-                                        }, label: `Add Filter` })), (0, jsx_runtime_1.jsx)(PopoverComponent, { isOpen: addFilterPopoverIsOpen, setIsOpen: setAddFilterPopoverIsOpen, popoverTitle: "Add Filter", popoverChildren: (0, jsx_runtime_1.jsx)(FilterModal_1.default, { schema: filterSchema, fieldValuesMap: fieldValuesMap, onSubmitFilter: (filter) => {
+                                        }, label: `Add Filter` }), (0, jsx_runtime_1.jsx)(PopoverComponent, { isOpen: addFilterPopoverIsOpen, setIsOpen: setAddFilterPopoverIsOpen, popoverTitle: "Add Filter", ignoredRefs: [viewFiltersPopoverButtonRef], popoverChildren: (0, jsx_runtime_1.jsx)(FilterModal_1.default, { schema: filterSchema, fieldValuesMap: fieldValuesMap, onSubmitFilter: (filter) => {
                                                 setAddFilterPopoverIsOpen(false);
                                                 updateUserFilter(filter);
-                                            }, onDeleteFilter: () => { }, ButtonComponent: ButtonComponent, SelectComponent: SelectComponent, MultiSelectComponent: MultiSelectComponent, TextInputComponent: TextInputComponent }), containerStyle: { position: 'relative', top: 10 } })] }), Object.values(userFilters).length > 0 && ((0, jsx_runtime_1.jsx)(ModalComponent, { triggerLabel: `Filters${Object.values(userFilters).length > 0 ? ` (${Object.values(userFilters).length})` : ''}`, isOpen: filterListIsOpen, setIsOpen: setFilterListIsOpen, title: "Filters", children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                                            }, onDeleteFilter: () => { }, ButtonComponent: ButtonComponent, SelectComponent: SelectComponent, MultiSelectComponent: MultiSelectComponent, TextInputComponent: TextInputComponent }), containerStyle: { position: 'relative', top: 10 } })] })), Object.values(userFilters).length > 0 && ((0, jsx_runtime_1.jsx)(ModalComponent, { triggerLabel: `Filters${Object.values(userFilters).length > 0 ? ` (${Object.values(userFilters).length})` : ''}`, isOpen: filterListIsOpen, setIsOpen: setFilterListIsOpen, title: "Filters", children: (0, jsx_runtime_1.jsxs)("div", { style: {
                                         display: 'flex',
                                         flexDirection: 'column',
                                         alignItems: 'start',
@@ -407,14 +416,8 @@ filters, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors
                                                 operator: filter.operator,
                                                 value: filter.value,
                                             }, filterLabel: filter ? (0, filterProcessing_1.filterSentence)(filter) : '', index: index, fieldValuesMap: fieldValuesMap, customOperatorOptions: customOperatorOptions, FilterTagComponent: FilterTagComponent, FilterModal: FilterModal_1.default, ButtonComponent: ButtonComponent, SecondaryButtonComponent: SecondaryButtonComponent, SelectComponent: SelectComponent, TextInputComponent: TextInputComponent, MultiSelectComponent: MultiSelectComponent, handleFilterSave: (newFilter) => {
-                                                // TODO: Implement user filters with new filter structure
-                                                getUserFilter(newFilter, filter._id, filter);
-                                                // console.log('updated filter', updatedFilter);
-                                                // dashboardFiltersDispatch({
-                                                //   type: 'UPDATE_DASHBOARD_FILTER',
-                                                //   id: updatedFilter.id,
-                                                //   data: updatedFilter,
-                                                // });
+                                                const userFilter = getUserFilter(newFilter, filter._id, filter);
+                                                updateUserFilter(userFilter);
                                             }, handleFilterDelete: () => {
                                                 setUserFilters((userFilters) => {
                                                     const updatedFilters = { ...userFilters };
@@ -424,15 +427,23 @@ filters, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors
                                             }, containerStyle: { width: 300, marginBottom: 10 } }, `userFilter_${index}_${filter ? (0, filterProcessing_1.filterSentence)(filter) : ''}`))), (0, jsx_runtime_1.jsxs)("div", { style: {
                                                 display: 'flex',
                                                 flexDirection: 'column',
-                                            }, children: [(0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: () => {
+                                            }, ref: addFilterPopoverButtonRef, children: [(0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: () => {
                                                         if (fieldValuesIsLoaded) {
-                                                            setFilterListAddFilterPopoverIsOpen(true);
+                                                            setFilterListAddFilterPopoverIsOpen(!filterListAddFilterPopoverIsOpen);
                                                         }
-                                                    }, label: `Add Filter` }), (0, jsx_runtime_1.jsx)(PopoverComponent, { isOpen: filterListAddFilterPopoverIsOpen, setIsOpen: setFilterListAddFilterPopoverIsOpen, popoverTitle: "Add Filter", popoverChildren: (0, jsx_runtime_1.jsx)(FilterModal_1.default, { schema: filterSchema, fieldValuesMap: fieldValuesMap, onSubmitFilter: (filter) => {
+                                                    }, label: `Add Filter` }), (0, jsx_runtime_1.jsx)(PopoverComponent, { isOpen: filterListAddFilterPopoverIsOpen, setIsOpen: setFilterListAddFilterPopoverIsOpen, popoverTitle: "Add Filter", ignoredRefs: [addFilterPopoverButtonRef], popoverChildren: (0, jsx_runtime_1.jsx)(FilterModal_1.default, { schema: filterSchema, fieldValuesMap: fieldValuesMap, onSubmitFilter: (filter) => {
                                                             setFilterListAddFilterPopoverIsOpen(false);
                                                             setFilterListIsOpen(false);
                                                             updateUserFilter(filter);
-                                                        }, onDeleteFilter: () => { }, ButtonComponent: ButtonComponent, SelectComponent: SelectComponent, MultiSelectComponent: MultiSelectComponent, TextInputComponent: TextInputComponent }), containerStyle: { position: 'relative', top: 10 } })] })] }) }))] })), templateDashboardName && ((0, jsx_runtime_1.jsx)(DashboardTemplate_1.default, { name: templateDashboardName, originDashboard: name, client: client, appliedFilters: populatedDashboardFilters, ModalComponent: ModalComponent, TemplateChartComponent: TemplateChartComponent, TemplateMetricComponent: TemplateMetricComponent, TemplateTableComponent: TemplateTableComponent, ButtonComponent: SecondaryButtonComponent }))] }), Object.keys(data.sections)
+                                                        }, onDeleteFilter: () => { }, ButtonComponent: ButtonComponent, SelectComponent: SelectComponent, MultiSelectComponent: MultiSelectComponent, TextInputComponent: TextInputComponent }), containerStyle: { position: 'relative', top: 10 } })] })] }) }))] })), templateDashboardName && ((0, jsx_runtime_1.jsx)(DashboardTemplate_1.default, { name: templateDashboardName, originDashboard: name, client: client, appliedFilters: populatedDashboardFilters, ModalComponent: ModalComponent, TemplateChartComponent: TemplateChartComponent, TemplateMetricComponent: TemplateMetricComponent, TemplateTableComponent: TemplateTableComponent, ButtonComponent: SecondaryButtonComponent }))] }), data &&
+                data.customFiltersEnabled &&
+                !hideAdminErrors &&
+                !hideFilters &&
+                filterSchema.columns.length === 0 && ((0, jsx_runtime_1.jsx)(UiComponents_1.QuillErrorMessageComponent, { errorMessage: "No custom filter options because there are no common views among the charts in the dashboard", containerStyle: {
+                    marginBottom: 16,
+                    marginTop: -6,
+                    maxWidth: 'fit-content',
+                } })), Object.keys(data.sections)
                 .sort(function (a, b) {
                 return a.length - b.length;
             })
@@ -446,7 +457,7 @@ filters, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors
                                         textAlign: 'left',
                                         marginTop: 12,
                                     }, children: section })] })), metrics(data.sections, section, sortByOrdering).length > 0 && ((0, jsx_runtime_1.jsx)(DashboardSectionComponent, { section: "metrics", children: metrics(data.sections, section, sortByOrdering).map((item) => {
-                                return ((0, jsx_runtime_1.jsx)(DataLoader_1.default, { item: item, filters: populatedDashboardFilters, additionalProcessing: {
+                                return ((0, jsx_runtime_1.jsx)(DataLoader_1.default, { item: item, filters: populatedDashboardFilters ?? [], userFilters: (filters?.map((f) => (0, Filter_1.convertCustomFilter)(f)) ?? []).concat(Object.values(userFilters)), additionalProcessing: {
                                         page: paginationProcessing_1.DEFAULT_PAGINATION,
                                         last: additionalProcessing?.last,
                                     }, children: ({ isLoading, error, data, }) => ((0, jsx_runtime_1.jsx)(MetricComponent, { error: error, isLoading: isLoading, report: data, onClick: !isLoading && onClickReport
@@ -458,7 +469,7 @@ filters, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors
                             }) })), charts(data.sections, section, sortByOrdering).length > 0 && ((0, jsx_runtime_1.jsx)(DashboardSectionComponent, { section: "charts", children: charts(data.sections, section, sortByOrdering).map((item) => ((0, jsx_runtime_1.jsx)(DataLoader_1.ChartDataLoader, { item: item, dateBucket: dateBucket, additionalProcessing: {
                                     page: pagination,
                                     last: additionalProcessing?.last,
-                                }, filters: populatedDashboardFilters, children: ({ isLoading, data, error, dateBucket, }) => ((0, jsx_runtime_1.jsx)(ChartComponent, { report: data, error: error, onClick: () => {
+                                }, filters: populatedDashboardFilters ?? [], userFilters: (filters?.map((f) => (0, Filter_1.convertCustomFilter)(f)) ?? []).concat(Object.values(userFilters)), children: ({ isLoading, data, error, dateBucket, }) => ((0, jsx_runtime_1.jsx)(ChartComponent, { report: data, error: error, onClick: () => {
                                         if (!isLoading && onClickReport) {
                                             handleOnClickDashboardItem({
                                                 ...item,
@@ -470,7 +481,7 @@ filters, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors
                                             height: 300,
                                         } })) : ((0, jsx_runtime_1.jsx)(Chart_1.ChartDisplay, { reportId: data.id, config: data, loading: isLoading, containerStyle: chartContainerStyle, colors: theme.chartColors?.length
                                             ? theme.chartColors
-                                            : undefined, scrollable: false, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid, comparisonLineStyle: comparisonLineStyle, onClickChartElement: onClickChartElement })) }, 'chart' + item.name + '' + item.id)) }, `chart${item.id}`))) })), tables(data.sections, section, sortByOrdering).length > 0 && ((0, jsx_runtime_1.jsx)(DashboardSectionComponent, { section: "tables", children: tables(data.sections, section, sortByOrdering).map((item) => ((0, jsx_runtime_1.jsx)(DataLoader_1.default, { item: item, filters: populatedDashboardFilters, additionalProcessing: {
+                                            : undefined, scrollable: false, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid, comparisonLineStyle: comparisonLineStyle, onClickChartElement: onClickChartElement })) }, 'chart' + item.name + '' + item.id)) }, `chart${item.id}`))) })), tables(data.sections, section, sortByOrdering).length > 0 && ((0, jsx_runtime_1.jsx)(DashboardSectionComponent, { section: "tables", children: tables(data.sections, section, sortByOrdering).map((item) => ((0, jsx_runtime_1.jsx)(DataLoader_1.default, { item: item, filters: populatedDashboardFilters ?? [], userFilters: (filters?.map((f) => (0, Filter_1.convertCustomFilter)(f)) ?? []).concat(Object.values(userFilters)), additionalProcessing: {
                                     page: pagination,
                                     last: additionalProcessing?.last,
                                 }, children: ({ isLoading, error, onPageChange, onSortChange, data, rowCount, rowCountIsLoading, }) => ((0, jsx_runtime_1.jsx)(TableComponent, { report: data, isLoading: isLoading, error: error, onClick: !isLoading && onClickReport
@@ -484,4 +495,3 @@ filters, onClickChartElement, dateBucket, additionalProcessing, hideAdminErrors
                                         0, rowCountIsLoading: rowCountIsLoading, onPageChange: (page) => onPageChange(page), onSortChange: (sort) => onSortChange(sort) })) }, `${name}${item.id}`))) }))] }, section + '' + sectionIndex));
             })] }));
 }
-exports.default = Dashboard;

package/dist/cjs/DateRangePicker/QuillDateRangePicker.d.ts

@@ -4,8 +4,8 @@ export interface DateRangePickerComponentProps {
     label?: string;
     selectWidth?: number;
     dateRange: {
-        startDate: Date;
-        endDate: Date;
+        startDate?: Date;
+        endDate?: Date;
     };
     presetOptions: {
         label: string;

package/dist/cjs/DateRangePicker/QuillDateRangePicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QuillDateRangePicker.d.ts","sourceRoot":"","sources":["../../../src/DateRangePicker/QuillDateRangePicker.tsx"],"names":[],"mappings":"AAAA,OAAc,EACZ,WAAW,EAKZ,MAAM,OAAO,CAAC;AAmBf,MAAM,WAAW,6BAA6B;IAC5C,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE;QAAE,SAAS,EAAE,IAAI,CAAC;QAAC,OAAO,EAAE,IAAI,CAAA;KAAE,CAAC;IAC9C,aAAa,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAClD,iBAAiB,EAAE,CAAC,EAClB,SAAS,EACT,OAAO,GACR,EAAE;QACD,SAAS,EAAE,IAAI,CAAC;QAChB,OAAO,EAAE,IAAI,CAAC;KACf,KAAK,IAAI,CAAC;IACX,cAAc,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAChE,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,SAAS,GAAG;IACtB,SAAS,EAAE,IAAI,CAAC;IAChB,OAAO,EAAE,IAAI,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,IAAI,CAAC;IACjB,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,SAAS,EACT,iBAAiB,EACjB,aAAa,EACb,cAAc,EACd,MAAM,EACN,KAAK,EACL,WAAW,EACX,UAAU,GACX,EAAE,6BAA6B,2CAoJ/B"}
+{"version":3,"file":"QuillDateRangePicker.d.ts","sourceRoot":"","sources":["../../../src/DateRangePicker/QuillDateRangePicker.tsx"],"names":[],"mappings":"AAAA,OAAc,EACZ,WAAW,EAKZ,MAAM,OAAO,CAAC;AAmBf,MAAM,WAAW,6BAA6B;IAC5C,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE;QAAE,SAAS,CAAC,EAAE,IAAI,CAAC;QAAC,OAAO,CAAC,EAAE,IAAI,CAAA;KAAE,CAAC;IAChD,aAAa,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAClD,iBAAiB,EAAE,CAAC,EAClB,SAAS,EACT,OAAO,GACR,EAAE;QACD,SAAS,EAAE,IAAI,CAAC;QAChB,OAAO,EAAE,IAAI,CAAC;KACf,KAAK,IAAI,CAAC;IACX,cAAc,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAChE,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,SAAS,GAAG;IACtB,SAAS,EAAE,IAAI,CAAC;IAChB,OAAO,EAAE,IAAI,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,IAAI,CAAC;IACjB,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,SAAS,EACT,iBAAiB,EACjB,aAAa,EACb,cAAc,EACd,MAAM,EACN,KAAK,EACL,WAAW,EACX,UAAU,GACX,EAAE,6BAA6B,2CAoJ/B"}

package/dist/cjs/DateRangePicker/QuillDateRangePicker.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.QuillDateRangePicker = void 0;
+exports.QuillDateRangePicker = QuillDateRangePicker;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const date_fns_1 = require("date-fns");
@@ -74,7 +74,6 @@ function QuillDateRangePicker({ dateRange, onChangeDateRange, presetOptions, onC
                     setLocalPreset(e.target.value);
                 }, width: selectWidth ?? 200, hideEmptyOption: true }))] }));
 }
-exports.QuillDateRangePicker = QuillDateRangePicker;
 function CalendarRow({ theme, anchorStartDate, anchorEndDate, setAnchorStartDate, setAnchorEndDate, localStartDate, localEndDate, setLocalStartDate, setLocalEndDate, updateDateFilter, setLocalPreset, }) {
     const firstMonthDisplayedDates = (0, date_fns_1.eachDayOfInterval)({
         start: (0, date_fns_1.startOfWeek)(anchorStartDate),

package/dist/cjs/DateRangePicker/dateRangePickerUtils.d.ts

@@ -9,8 +9,8 @@ export declare const parseEndDate: (endDate: Date | null | undefined, maxDate: D
  * A simple date range that spans from start to end.
  */
 type QuillDateRange = {
-    start: Date;
-    end: Date;
+    startDate: Date;
+    endDate: Date;
 };
 /**
  * A simple map between the primary range key and the QuillDateRange for that
@@ -18,8 +18,8 @@ type QuillDateRange = {
  */
 export declare const PRIMARY_RANGE: {
     [key: string]: QuillDateRange | {
-        start: undefined;
-        end: undefined;
+        startDate: undefined;
+        endDate: undefined;
     };
 };
 /**
@@ -38,21 +38,21 @@ export declare const COMPARISON_OPTIONS: {
  * comparison range) and returns a QuillDateRange based on that key and date.
  */
 export declare const COMPARISON_RANGE: {
-    readonly PREV_PERIOD: ({ start, end }: QuillDateRange) => {
-        start: Date;
-        end: Date;
+    readonly PREV_PERIOD: ({ startDate, endDate }: QuillDateRange) => {
+        startDate: Date;
+        endDate: Date;
     };
-    readonly PREV_7_DAYS: ({ start }: QuillDateRange) => {
-        start: Date;
-        end: Date;
+    readonly PREV_7_DAYS: ({ startDate }: QuillDateRange) => {
+        startDate: Date;
+        endDate: Date;
     };
-    readonly PREV_30_DAYS: ({ start }: QuillDateRange) => {
-        start: Date;
-        end: Date;
+    readonly PREV_30_DAYS: ({ startDate }: QuillDateRange) => {
+        startDate: Date;
+        endDate: Date;
     };
-    readonly PREV_90_DAYS: ({ start }: QuillDateRange) => {
-        start: Date;
-        end: Date;
+    readonly PREV_90_DAYS: ({ startDate }: QuillDateRange) => {
+        startDate: Date;
+        endDate: Date;
     };
     readonly NO_COMPARISON: () => null;
 };
@@ -67,11 +67,11 @@ export declare const getRangeFromPresetOptions: (preset: string, presetOptions:
     startDate: Date;
     endDate: Date;
 }[]) => {
-    start: Date;
-    end: Date;
+    startDate: Date;
+    endDate: Date;
 } | {
-    start: null;
-    end: null;
+    startDate: null;
+    endDate: null;
 };
 export declare const getDateStyles: (theme: any, date: Date, finalStartDate: Date | null, finalEndDate: Date | null, hoveredDate: Date | undefined, isDateDisabled: boolean) => any;
 export declare const displaySelected: (selectedStartDay: Date | null, selectedEndDay: Date | null) => string | undefined;

package/dist/cjs/DateRangePicker/dateRangePickerUtils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dateRangePickerUtils.d.ts","sourceRoot":"","sources":["../../../src/DateRangePicker/dateRangePickerUtils.ts"],"names":[],"mappings":"AAgBA,OAAO,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAG/D,eAAO,MAAM,WAAW,WAAY,MAAM,aAKzC,CAAC;AAEF,eAAO,MAAM,UAAU,MAAO,MAAM,UAAU,MAAM,WAEnD,CAAC;AAEF,eAAO,MAAM,2BAA2B,kBACvB,MAAM,GAAG,IAAI,GAAG,SAAS,oBACtB,qBAAqB,EAAE,gBAU1C,CAAC;AAEF,eAAO,MAAM,yBAAyB,kBACrB,MAAM,GAAG,IAAI,GAAG,SAAS,oBACtB,qBAAqB,EAAE,SAU1C,CAAC;AAEF,eAAO,MAAM,cAAc,cACd,IAAI,GAAG,IAAI,GAAG,SAAS,WACzB,IAAI,GAAG,IAAI,GAAG,SAAS,yBACT,MAAM,GAAG,IAAI,GAAG,SAAS,mBAC/B,qBAAqB,EAAE,gBAWzC,CAAC;AAEF,eAAO,MAAM,YAAY,YACd,IAAI,GAAG,IAAI,GAAG,SAAS,WACvB,IAAI,GAAG,IAAI,GAAG,SAAS,yBACT,MAAM,GAAG,IAAI,GAAG,SAAS,mBAC/B,qBAAqB,EAAE,gBASzC,CAAC;AAEF;;GAEG;AACH,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,IAAI,CAAC;IACZ,GAAG,EAAE,IAAI,CAAC;CACX,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,aAAa,EAAE;IAC1B,CAAC,GAAG,EAAE,MAAM,GAAG,cAAc,GAAG;QAAE,KAAK,EAAE,SAAS,CAAC;QAAC,GAAG,EAAE,SAAS,CAAA;KAAE,CAAC;CAatE,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,aAAa,EAAE;IAAE,CAAC,GAAG,EAAE,MAAM,OAAO,aAAa,GAAG,MAAM,CAAA;CAStE,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd,EAqBA,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,gBAAgB;2CACG,cAAc;;;;sCAInB,cAAc;;;;uCAIb,cAAc;;;;uCAId,cAAc;;;;;CAKhC,CAAC;AACX,MAAM,MAAM,kBAAkB,GAAG,MAAM,OAAO,gBAAgB,CAAC;AAE/D,eAAO,MAAM,gBAAgB,EAAE,GAAG,EAiDjC,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,qBAAqB,EAyCjD,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,qBAAqB,EA+BvD,CAAC;AAEF,eAAO,MAAM,kBAAkB,WAAY,MAAM,6BAOhD,CAAC;AAEF,eAAO,MAAM,yBAAyB,WAC5B,MAAM,iBACC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,IAAI,CAAC;IAChB,OAAO,EAAE,IAAI,CAAC;CACf,EAAE;;;;;;CAQJ,CAAC;AAEF,eAAO,MAAM,aAAa,UACjB,GAAG,QACJ,IAAI,kBACM,IAAI,GAAG,IAAI,gBACb,IAAI,GAAG,IAAI,eACZ,IAAI,GAAG,SAAS,kBACb,OAAO,QAgCxB,CAAC;AAkGF,eAAO,MAAM,eAAe,qBACR,IAAI,GAAG,IAAI,kBACb,IAAI,GAAG,IAAI,uBA0C5B,CAAC;AAmGF,eAAO,MAAM,mBAAmB,cACnB,IAAI,GAAG,IAAI,WACb,IAAI,GAAG,IAAI,WACX,MAAM,WAyChB,CAAC"}
+{"version":3,"file":"dateRangePickerUtils.d.ts","sourceRoot":"","sources":["../../../src/DateRangePicker/dateRangePickerUtils.ts"],"names":[],"mappings":"AAgBA,OAAO,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAG/D,eAAO,MAAM,WAAW,WAAY,MAAM,aAKzC,CAAC;AAEF,eAAO,MAAM,UAAU,MAAO,MAAM,UAAU,MAAM,WAEnD,CAAC;AAEF,eAAO,MAAM,2BAA2B,kBACvB,MAAM,GAAG,IAAI,GAAG,SAAS,oBACtB,qBAAqB,EAAE,gBAU1C,CAAC;AAEF,eAAO,MAAM,yBAAyB,kBACrB,MAAM,GAAG,IAAI,GAAG,SAAS,oBACtB,qBAAqB,EAAE,SAU1C,CAAC;AAEF,eAAO,MAAM,cAAc,cACd,IAAI,GAAG,IAAI,GAAG,SAAS,WACzB,IAAI,GAAG,IAAI,GAAG,SAAS,yBACT,MAAM,GAAG,IAAI,GAAG,SAAS,mBAC/B,qBAAqB,EAAE,gBAWzC,CAAC;AAEF,eAAO,MAAM,YAAY,YACd,IAAI,GAAG,IAAI,GAAG,SAAS,WACvB,IAAI,GAAG,IAAI,GAAG,SAAS,yBACT,MAAM,GAAG,IAAI,GAAG,SAAS,mBAC/B,qBAAqB,EAAE,gBASzC,CAAC;AAEF;;GAEG;AACH,KAAK,cAAc,GAAG;IACpB,SAAS,EAAE,IAAI,CAAC;IAChB,OAAO,EAAE,IAAI,CAAC;CACf,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,aAAa,EAAE;IAC1B,CAAC,GAAG,EAAE,MAAM,GAAG,cAAc,GAAG;QAAE,SAAS,EAAE,SAAS,CAAC;QAAC,OAAO,EAAE,SAAS,CAAA;KAAE,CAAC;CAyB9E,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,aAAa,EAAE;IAAE,CAAC,GAAG,EAAE,MAAM,OAAO,aAAa,GAAG,MAAM,CAAA;CAStE,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd,EAqBA,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,gBAAgB;mDACW,cAAc;;;;0CAIvB,cAAc;;;;2CAIb,cAAc;;;;2CAId,cAAc;;;;;CAKpC,CAAC;AACX,MAAM,MAAM,kBAAkB,GAAG,MAAM,OAAO,gBAAgB,CAAC;AAE/D,eAAO,MAAM,gBAAgB,EAAE,GAAG,EAiDjC,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,qBAAqB,EAyCjD,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,qBAAqB,EA+BvD,CAAC;AAEF,eAAO,MAAM,kBAAkB,WAAY,MAAM,6BAOhD,CAAC;AAEF,eAAO,MAAM,yBAAyB,WAC5B,MAAM,iBACC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,IAAI,CAAC;IAChB,OAAO,EAAE,IAAI,CAAC;CACf,EAAE;;;;;;CAQJ,CAAC;AAEF,eAAO,MAAM,aAAa,UACjB,GAAG,QACJ,IAAI,kBACM,IAAI,GAAG,IAAI,gBACb,IAAI,GAAG,IAAI,eACZ,IAAI,GAAG,SAAS,kBACb,OAAO,QAgCxB,CAAC;AAkGF,eAAO,MAAM,eAAe,qBACR,IAAI,GAAG,IAAI,kBACb,IAAI,GAAG,IAAI,uBA0C5B,CAAC;AAmGF,eAAO,MAAM,mBAAmB,cACnB,IAAI,GAAG,IAAI,WACb,IAAI,GAAG,IAAI,WACX,MAAM,WAyChB,CAAC"}