@quillsql/react 2.12.19 → 2.12.20

package/dist/esm/Chart.js

@@ -8,7 +8,6 @@ import PieChart from './components/Chart/PieChart';
 import { ClientContext, CustomFieldContext, DashboardContext, DashboardFiltersContext, } from './Context';
 import QuillTable from './components/QuillTable';
 import { getData } from './utils/dataFetcher';
-import { generatePivotTable, generatePivotTableYAxis, } from './internals/ReportBuilder/PivotModal';
 import { DATE_FORMAT_TYPES, valueFormatter } from './utils/valueFormatter';
 import LineChart from './components/Chart/LineChart';
 import BarChart from './components/Chart/BarChart';
@@ -20,6 +19,7 @@ import { quillFormat } from './utils/valueFormatter';
 import useTheme from './hooks/useTheme';
 import { processFilterErrorList } from './utils/errorProcessing';
 import { findAndProcessDateFilter } from './utils/filterProcessing';
+import { cleanDashboardItem } from './utils/dashboard';
 const MAX_ROWS_FOR_GENERIC_TABLE = 300;
 // @ts-ignore
 function sumByKey(arr, key) {
@@ -32,23 +32,36 @@ function sumByKey(arr, key) {
 function areDatesNearby(date1, date2) {
     return Math.abs(differenceInHours(date1, date2)) < 24;
 }
-function isEquivalent(filters1, filters2) {
-    if (Object.keys(filters2).length !== Object.keys(filters1).length) {
+export function isEquivalent(filters1, filters2) {
+    if (filters2.length !== filters1.length) {
         return false;
     }
-    const filterKeys = Object.keys(filters2);
-    for (let i = 0; i < filterKeys.length; i++) {
-        const currentKeyWereLookingAt = filterKeys[i];
-        if (!currentKeyWereLookingAt) {
-            return false;
-        }
-        const filter1 = filters1[currentKeyWereLookingAt];
+    // const filterKeys = Object.keys(filters2);
+    for (let i = 0; i < filters1.length; i++) {
+        const filter1 = filters1[i];
         if (!filter1) {
             return false;
         }
-        const filter2 = filters2[currentKeyWereLookingAt];
+        const filter2 = filters2[i];
         const filterType = filter2.filterType;
         if (filterType === 'string') {
+            if (filter1.stringFilterType === 'multiselect') {
+                if (filter1.values &&
+                    filter2.values &&
+                    filter1.values.length !== filter2.values.length) {
+                    return false;
+                }
+                if ((filter1.values && !filter2.values) ||
+                    (filter2.values && !filter1.values)) {
+                    return false;
+                }
+                // make sure that filter1.values is equivalent to filter2.values ignoring order
+                const sortedValues1 = filter1.values?.slice().sort() || [];
+                const sortedValues2 = filter2.values?.slice().sort() || [];
+                if (!sortedValues1.every((value, index) => value === sortedValues2[index])) {
+                    return false;
+                }
+            }
             if (filter1.selectedValue !== filter2.selectedValue) {
                 return false;
             }
@@ -72,9 +85,6 @@ export function didFiltersChange(dashboardItem, filters) {
     if (!dashboardItem?.filtersApplied || !filters) {
         return true;
     }
-    if (dashboardItem?.filtersApplied.comparison !== !filters.comparison) {
-        return true;
-    }
     return !isEquivalent(dashboardItem.filtersApplied, filters);
 }
 function fallbackMapColorsToFields(_report, _theme) {
@@ -116,11 +126,17 @@ const Chart = (props) => {
                 ? theme.chartColors
                 : ['#4E80EE', '#E14F62', '#55B5A6', '#E9A23B', '#6466E9', '#55B685'];
     }, [data.colors]);
-    return (_jsx(ChartUpdater, { reportId: data.reportId, className: data.className, containerStyle: data.containerStyle, colors: chartColors, isAnimationActive: data.isAnimationActive, hideXAxis: data.hideXAxis, hideYAxis: data.hideYAxis, hideCartesianGrid: data.hideCartesianGrid, hideHorizontalCartesianGrid: data.hideHorizontalCartesianGrid, hideVerticalCartesianGrid: data.hideVerticalCartesianGrid, hideSubsequentXAxisTicks: data.hideSubsequentXAxisTicks, hideDateRangeFilter: data.hideDateRangeFilter, cartesianGridLineStyle: data.cartesianGridLineStyle, cartesianGridLineColor: data.cartesianGridLineColor, comparisonLineStyle: data.comparisonLineStyle, mapColorsToFields: data.mapColorsToFields ?? fallbackMapColorsToFields, LoadingComponent: data.LoadingComponent, filters: data.filters }));
+    return (_jsx(ChartUpdater, { reportId: data.reportId, className: data.className, containerStyle: data.containerStyle, colors: chartColors, isAnimationActive: data.isAnimationActive, hideXAxis: data.hideXAxis, hideYAxis: data.hideYAxis, hideCartesianGrid: data.hideCartesianGrid, hideHorizontalCartesianGrid: data.hideHorizontalCartesianGrid, hideVerticalCartesianGrid: data.hideVerticalCartesianGrid, hideSubsequentXAxisTicks: data.hideSubsequentXAxisTicks, hideDateRangeFilter: data.hideDateRangeFilter, cartesianGridLineStyle: data.cartesianGridLineStyle, cartesianGridLineColor: data.cartesianGridLineColor, comparisonLineStyle: data.comparisonLineStyle, mapColorsToFields: data.mapColorsToFields ?? fallbackMapColorsToFields, LoadingComponent: data.LoadingComponent, filters: data.filters, onClickChartElement: props.onClickChartElement }));
 };
 const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimationActive, hideXAxis, hideYAxis, hideCartesianGrid, hideHorizontalCartesianGrid = false, hideVerticalCartesianGrid = true, hideSubsequentXAxisTicks = false, cartesianGridLineStyle = 'solid', cartesianGridLineColor, comparisonLineStyle, hideDateRangeFilter = false, mapColorsToFields, LoadingComponent = QuillLoadingSkeleton, filters, onClickChartElement, }) => {
     const { dispatch, dashboard } = useContext(DashboardContext);
     const { dashboardFilters } = useContext(DashboardFiltersContext);
+    const specificDashboardFilter = useMemo(() => {
+        return dashboardFilters.filter((f) => dashboard &&
+            dashboard[reportId] &&
+            f &&
+            f.dashboardName === dashboard[reportId].dashboardName);
+    }, [dashboardFilters, dashboard]);
     const [initialLoad, setInitialLoad] = useState(true);
     const [loading, setLoading] = useState(true);
     const [paginating, setPaginating] = useState(false);
@@ -132,6 +148,7 @@ const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimation
     const [additionalProcessing, setAdditionProcessing] = useState({
         page: 0,
     });
+    const [report, setReport] = useState(undefined);
     const [previousPage, setPreviousPage] = useState(0);
     const theme = useTheme();
     const onPageChange = (page) => {
@@ -149,7 +166,7 @@ const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimation
     };
     const getChartDataPaginate = async (processing) => {
         setPaginating(true);
-        if (!didFiltersChange(dashboard[reportId], dashboardFilters)) {
+        if (!didFiltersChange(dashboard[reportId], specificDashboardFilter)) {
             setPaginating(false);
             return;
         }
@@ -163,8 +180,8 @@ const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimation
             }
             // Remove extra fields on each filter so we don't confuse the backend.
             const allowDateRange = !hideDateRangeFilter;
-            const minimalFilters = Object.values(dashboardFilters).length
-                ? Object.values(dashboardFilters)
+            const minimalFilters = Object.values(specificDashboardFilter).length
+                ? Object.values(specificDashboardFilter)
                     .filter((f) => allowDateRange || f.filterType !== 'date_range')
                     .map((filter) => {
                     const newFilter = { ...filter };
@@ -208,13 +225,15 @@ const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimation
                     ...resp,
                     filtersApplied: minimalFilters.filter((f) => f.dashboardName === dashboard[reportId].dashboardName),
                 };
+                const cleanedReport = cleanDashboardItem(dashboardItem, filters);
+                setReport(cleanedReport);
                 dispatch({
                     type: 'UPDATE_DASHBOARD_ITEM',
                     id: reportId,
-                    data: dashboardItem,
+                    data: cleanedReport,
                 });
                 if (mapColorsToFields) {
-                    setColorMap(mapColorsToFields(dashboardItem, theme));
+                    setColorMap(mapColorsToFields(cleanedReport, theme));
                 }
             }
             else {
@@ -232,7 +251,7 @@ const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimation
     };
     const getChartData = async (processing) => {
         setLoading(true);
-        if (!didFiltersChange(dashboard[reportId], dashboardFilters)) {
+        if (!didFiltersChange(dashboard[reportId], specificDashboardFilter)) {
             setLoading(false);
             return;
         }
@@ -246,8 +265,8 @@ const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimation
             }
             // Remove extra fields on each filter so we don't confuse the backend.
             const allowDateRange = !hideDateRangeFilter;
-            const minimalFilters = Object.values(dashboardFilters).length
-                ? Object.values(dashboardFilters)
+            const minimalFilters = Object.values(specificDashboardFilter).length
+                ? Object.values(specificDashboardFilter)
                     .filter((f) => allowDateRange || f.filterType !== 'date_range')
                     .map((filter) => {
                     const newFilter = { ...filter };
@@ -291,6 +310,11 @@ const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimation
                     ...resp,
                     filtersApplied: minimalFilters.filter((f) => f.dashboardName === dashboard[reportId].dashboardName),
                 };
+                const cleanedReport = cleanDashboardItem(dashboardItem, filters);
+                if (cleanedReport.chartType === 'table' && cleanedReport.pivot) {
+                    cleanedReport.columns = cleanedReport.yAxisFields;
+                }
+                setReport(cleanedReport);
                 dispatch({
                     type: 'UPDATE_DASHBOARD_ITEM',
                     id: reportId,
@@ -314,11 +338,14 @@ const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimation
     useEffect(() => {
         setInitialLoad(false);
         getChartData();
-    }, [dashboardFilters, client, reportId]);
-    return (_jsx(ChartDisplay, { config: dashboard[reportId], reportId: reportId, colors: colors, className: className, containerStyle: containerStyle, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid, hideHorizontalCartesianGrid: hideHorizontalCartesianGrid, hideVerticalCartesianGrid: hideVerticalCartesianGrid, hideSubsequentXAxisTicks: hideSubsequentXAxisTicks, cartesianGridLineStyle: cartesianGridLineStyle, cartesianGridLineColor: cartesianGridLineColor, hideDateRangeFilter: hideDateRangeFilter, comparisonLineStyle: comparisonLineStyle, isAnimationActive: isAnimationActive, isComparison: isComparison, loading: loading || initialLoad, paginating: paginating, error: error, colorMap: colorMap, LoadingComponent: LoadingComponent, onPageChange: onPageChange, onSortChange: onSortChange, onClickChartElement: onClickChartElement }));
+    }, [specificDashboardFilter, client, reportId]);
+    return (_jsx(ChartDisplay, { config: report, reportId: reportId, colors: colors, className: className, containerStyle: containerStyle, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid, hideHorizontalCartesianGrid: hideHorizontalCartesianGrid, hideVerticalCartesianGrid: hideVerticalCartesianGrid, hideSubsequentXAxisTicks: hideSubsequentXAxisTicks, cartesianGridLineStyle: cartesianGridLineStyle, cartesianGridLineColor: cartesianGridLineColor, hideDateRangeFilter: hideDateRangeFilter, comparisonLineStyle: comparisonLineStyle, isAnimationActive: isAnimationActive, isComparison: isComparison, loading: loading || initialLoad, paginating: paginating, error: error, colorMap: colorMap, LoadingComponent: LoadingComponent, onPageChange: onPageChange, onSortChange: onSortChange, onClickChartElement: onClickChartElement }));
 };
 const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hideXAxis, hideYAxis, hideCartesianGrid, hideDateRangeFilter = false, hideHorizontalCartesianGrid = false, hideVerticalCartesianGrid = true, hideSubsequentXAxisTicks = false, cartesianGridLineStyle = 'solid', cartesianGridLineColor, comparisonLineStyle, isAnimationActive, loading = false, paginating = false, error = undefined, isComparison = false, colorMap, LoadingComponent = QuillLoadingSkeleton, onPageChange, onSortChange, onClickChartElement, dateBucket, }) => {
     const { dashboardFilters } = useContext(DashboardFiltersContext);
+    const specificDashboardFilter = useMemo(() => {
+        return dashboardFilters.filter((f) => f && config && config.dashboardName === f.dashboardName);
+    }, [dashboardFilters]);
     const { downloadCSV } = useExport(reportId);
     const theme = useTheme();
     const chartColors = useMemo(() => {
@@ -328,44 +355,42 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
                 ? theme.chartColors
                 : ['#4E80EE', '#E14F62', '#55B5A6', '#E9A23B', '#6466E9', '#55B685'];
     }, [colors]);
-    const dateFilter = !hideDateRangeFilter &&
-        findAndProcessDateFilter(Object.values(dashboardFilters ?? []));
-    const isPivot = config?.pivot;
-    const pivotTable = useMemo(() => {
-        const pivot = config?.pivot;
-        const data = config;
-        return pivot && data?.rows
-            ? generatePivotTable(pivot, JSON.parse(JSON.stringify(data.rows)), // deep copy
-            dateFilter && dateFilter.startDate && dateFilter.endDate
-                ? { start: dateFilter.startDate, end: dateFilter.endDate }
-                : undefined, Boolean(dateFilter?.comparisonRange?.startDate), -1, dateFilter?.comparisonRange?.startDate &&
-                dateFilter?.comparisonRange.endDate
-                ? {
-                    start: dateFilter.comparisonRange.startDate,
-                    end: dateFilter.comparisonRange.endDate,
-                }
-                : undefined, dateBucket)
-            : null;
-    }, [config?.pivot, dateBucket]);
-    const pivotTableYAxis = useMemo(() => {
-        if (!pivotTable) {
-            return null;
+    const rows = config?.pivotRows ?? config?.rows ?? [];
+    const getYAxisFields = () => {
+        if (config && config.pivot && config.pivot.columnField) {
+            return (config?.pivotColumns
+                .slice(1)
+                .map((column) => {
+                return { ...column, format: config?.yAxisFields[0].format };
+            }) ?? []);
         }
-        const pivot = config?.pivot;
-        const yAxisFields = config.yAxisFields;
-        return yAxisFields
-            ? generatePivotTableYAxis(pivot, pivotTable.columns, yAxisFields?.[0]?.format)
-            : null;
-    }, [pivotTable, config?.yAxisFields]);
+        else if (config && config.pivot) {
+            return (config?.pivotColumns
+                .slice(1)
+                .map((column) => {
+                return {
+                    ...column,
+                    label: config?.yAxisFields[0].label,
+                    format: config?.yAxisFields[0].format,
+                };
+            }) ?? []);
+        }
+        else {
+            return config?.pivotColumns ?? config?.yAxisFields ?? [];
+        }
+    };
+    const yAxisFields = getYAxisFields();
+    const dateFilter = !hideDateRangeFilter &&
+        findAndProcessDateFilter(Object.values(specificDashboardFilter ?? []));
     if (error) {
         return _jsx(ChartError, { className: className, containerStyle: containerStyle });
     }
-    else if (!pivotTable &&
-        config &&
+    else if (config &&
+        !config.pivot &&
         config?.chartType !== 'metric' &&
         config?.chartType !== 'table' &&
-        config.rows &&
-        config.rows.length > MAX_ROWS_FOR_GENERIC_TABLE) {
+        rows &&
+        rows.length > MAX_ROWS_FOR_GENERIC_TABLE) {
         return (_jsx(ChartError, { className: className, containerStyle: containerStyle, label: "Charts can only display 300 rows. Please add a pivot or modify the query." }));
     }
     else if (!config || loading) {
@@ -373,8 +398,6 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
     }
     const chartTypes = [config?.chartType];
     if (chartTypes.includes('pie')) {
-        const rows = pivotTable ? pivotTable.rows : config.rows;
-        const yAxisFields = pivotTableYAxis ? pivotTableYAxis : config.yAxisFields;
         const xAxisField = config.xAxisField;
         return (_jsx(PieChart, { className: className, containerStyle: containerStyle, data: rows.map((row) => {
                 return {
@@ -385,9 +408,7 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
             }), category: yAxisFields[0].field, index: xAxisField, colors: chartColors, theme: theme, colorMap: colorMap, onClickChartElement: onClickChartElement }));
     }
     if (chartTypes.includes('table')) {
-        const data = config;
-        const columns = pivotTable?.columns ?? data.columns ?? data.yAxisFields;
-        const rows = pivotTable?.rows ?? data.rows ?? [];
+        const columns = yAxisFields;
         // FOR PIVOTS - ADD THE RIGHT FIELD TYPE FOR THE VALUE COLUMNS
         const valueFieldType = config?.pivot?.valueFieldType || undefined;
         // Walk through data.columns and pick off the labels from yAxisFields
@@ -398,9 +419,9 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
                 index !== 0) {
                 col.format = valueFieldType || 'two_decimal_places';
             }
-            if (!data.yAxisFields)
+            if (!yAxisFields)
                 return;
-            const matchingCol = data.yAxisFields.find((c) => c.field === col.field);
+            const matchingCol = yAxisFields.find((c) => c.field === col.field);
             if (!col.label && matchingCol) {
                 col.label = matchingCol.label;
                 col.format = matchingCol.format;
@@ -418,15 +439,15 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
             }, {});
         });
         let numberOfRows = undefined;
-        if (data.compareRows && data.compareRows[0]) {
-            if (data.compareRows[0].COUNT) {
-                numberOfRows = parseInt(data.compareRows[0].COUNT);
+        if (config.compareRows && config.compareRows[0]) {
+            if (config.compareRows[0].COUNT) {
+                numberOfRows = parseInt(config.compareRows[0].COUNT);
             }
-            else if (data.compareRows[0].count) {
-                numberOfRows = parseInt(data.compareRows[0].count);
+            else if (config.compareRows[0].count) {
+                numberOfRows = parseInt(config.compareRows[0].count);
             }
         }
-        return (_jsx(QuillTable, { rows: formattedRows ?? [], numberOfRows: numberOfRows, columns: columns ?? data.yAxisFields, currentPage: data.page, sort: data.sort, rowsPerPage: config?.rowsPerPage || 10, containerStyle: {
+        return (_jsx(QuillTable, { rows: formattedRows ?? [], numberOfRows: numberOfRows, columns: columns ?? yAxisFields, currentPage: config.page, sort: config.sort, rowsPerPage: config?.rowsPerPage || 10, containerStyle: {
                 width: containerStyle?.width || '100%',
                 height: containerStyle?.height || '400px',
                 ...containerStyle,
@@ -439,14 +460,11 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
             }, isLoading: paginating }));
     }
     if (chartTypes.includes('bar')) {
-        return (_jsx(BarList, { data: pivotTable ? pivotTable.rows : config.rows, theme: theme, yAxisFields: pivotTableYAxis ? pivotTableYAxis : config.yAxisFields, colors: chartColors, xAxisField: config.xAxisField, xAxisFormat: config.xAxisFormat, containerStyle: containerStyle, className: className, colorMap: colorMap, onClickChartElement: onClickChartElement }));
+        return (_jsx(BarList, { data: rows, theme: theme, yAxisFields: yAxisFields, colors: chartColors, xAxisField: config.xAxisField, xAxisFormat: config.xAxisFormat, containerStyle: containerStyle, className: className, colorMap: colorMap, onClickChartElement: onClickChartElement }));
     }
-    const yAxisFields = pivotTableYAxis
-        ? pivotTableYAxis
-        : config.yAxisFields;
     if (yAxisFields.length === 1) {
-        if (yAxisFields[0].label === '' && config.yAxisFields.length === 1) {
-            yAxisFields[0].label = config.yAxisFields[0].label;
+        if (yAxisFields[0].label === '' && yAxisFields.length === 1) {
+            yAxisFields[0].label = yAxisFields[0].label;
         }
         if (dateFilter?.comparison) {
             const sampleField = yAxisFields[0];
@@ -457,15 +475,10 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
             };
         }
     }
-    const data = (pivotTable ? pivotTable.rows : config.rows)
-        // filter out any rows with a comparison key but no corresponding primary
-        ?.filter((row) => Object.keys(row).every((key) => !key.startsWith('comparison_') ||
-        (key.startsWith('comparison_') &&
-            row[key.replace('comparison_', '')] !== undefined)));
     if (chartTypes.includes('column')) {
         // Autofill the column chart with an empty column if there are no rows
-        let barChartData = data;
-        if (dateFilter && (!data || data.length === 0)) {
+        let barChartData = rows;
+        if (dateFilter && (!barChartData || barChartData.length === 0)) {
             const xAxis = config.xAxisField;
             const yAxis = yAxisFields[0]?.field;
             barChartData = [{ [xAxis]: '', [yAxis]: '0' }];
@@ -487,17 +500,15 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
                     break;
             }
         }
-        return (_jsx(BarChart, { colors: chartColors, theme: theme, isStacked: isPivot && yAxisFields.length > (dateFilter?.comparison ? 2 : 1), yAxisFields: yAxisFields, data: barChartData, xAxisField: config.xAxisField, xAxisLabel: config.xAxisLabel, xAxisFormat: xAxisFormat, containerStyle: containerStyle, className: className, comparison: dateFilter?.comparison, isAnimationActive: isAnimationActive, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid, colorMap: colorMap, onClickChartElement: onClickChartElement }));
+        return (_jsx(BarChart, { colors: chartColors, theme: theme, isStacked: config.pivot && yAxisFields.length > (dateFilter?.comparison ? 2 : 1), yAxisFields: yAxisFields, data: barChartData, xAxisField: config.xAxisField, xAxisLabel: config.xAxisLabel, xAxisFormat: xAxisFormat, containerStyle: containerStyle, className: className, comparison: dateFilter?.comparison, isAnimationActive: isAnimationActive, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid, colorMap: colorMap, onClickChartElement: onClickChartElement, dateFilter: dateFilter }));
     }
     if (chartTypes.includes('metric')) {
-        const data = config;
-        const rows = pivotTable?.rows ?? data.rows ?? [];
         const isComparison = rows?.length > 0 &&
-            Object.keys(rows[0]).includes(`comparison_${data.xAxisField}`);
-        const primaryMetricLabel = data?.filtersApplied?.date_range?.preset?.label;
-        const comparisonKey = data?.filtersApplied?.date_range?.comparisonRange?.value;
+            Object.keys(rows[0]).includes(`comparison_${config.xAxisField}`);
+        const primaryMetricLabel = config?.filtersApplied?.date_range?.preset?.label;
+        const comparisonKey = config?.filtersApplied?.date_range?.comparisonRange?.value;
         const comparisonLabel = COMPARISON_OPTIONS.find((opt) => opt.value === comparisonKey)?.text;
-        if (rows?.length === 0 || rows[0][data.xAxisField] === null) {
+        if (rows?.length === 0 || rows[0][config.xAxisField] === null) {
             return (_jsx("div", { style: {
                     display: 'flex',
                     flex: '1 0 auto',
@@ -536,14 +547,14 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
                         marginRight: 'auto',
                     }, children: [_jsx("span", { children: rows?.length > 0 &&
                                 valueFormatter({
-                                    value: rows[0][data.xAxisField] ?? 0,
-                                    field: data.xAxisField,
+                                    value: rows[0][config.xAxisField] ?? 0,
+                                    field: config.xAxisField,
                                     fields: [
                                         {
-                                            field: data.xAxisField,
-                                            format: data.xAxisFormat,
-                                            label: data.xAxisLabel,
-                                            _id: data._id || 'dummy',
+                                            field: config.xAxisField,
+                                            format: config.xAxisFormat,
+                                            label: config.xAxisLabel,
+                                            _id: config._id || 'dummy',
                                         },
                                     ],
                                 }) }), isComparison && (_jsx("span", { style: {
@@ -567,14 +578,14 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
                                 color: theme?.secondaryTextColor,
                             }, children: rows?.length > 0 &&
                                 valueFormatter({
-                                    value: rows[0][`comparison_${data.xAxisField}`] ?? 0,
-                                    field: data.xAxisField,
+                                    value: rows[0][`comparison_${config.xAxisField}`] ?? 0,
+                                    field: config.xAxisField,
                                     fields: [
                                         {
-                                            field: data.xAxisField,
-                                            format: data.xAxisFormat,
-                                            label: data.xAxisLabel,
-                                            _id: data._id || 'dummy',
+                                            field: config.xAxisField,
+                                            format: config.xAxisFormat,
+                                            label: config.xAxisLabel,
+                                            _id: config._id || 'dummy',
                                         },
                                     ],
                                 }) }), _jsx("span", { style: {
@@ -589,11 +600,11 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
     }
     // Autofill the line chart with two zero values, so they form a line at 0.0
     // when there are no rows on the config.
-    let lineChartData = data;
+    let lineChartData = rows;
     const xAxisFieldFormat = config.columns.find((col) => col.field === config.xAxisField)?.format;
     if (dateFilter &&
         DATE_FORMAT_TYPES.includes(xAxisFieldFormat) &&
-        (!data || data.length === 0)) {
+        (!lineChartData || lineChartData.length === 0)) {
         const xAxis = config.xAxisField;
         const yAxis = yAxisFields[0]?.field;
         const format = config.pivot
@@ -606,7 +617,7 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
             { [xAxis]: endDate, [yAxis]: '0' },
         ];
     }
-    return (_jsx(LineChart, { colors: chartColors, colorMap: colorMap, yAxisFields: yAxisFields.sort(sortComparisonFirst), data: lineChartData, xAxisField: config.xAxisField, xAxisLabel: config.xAxisLabel, xAxisFormat: config.xAxisFormat, containerStyle: containerStyle, className: className, theme: theme, comparison: dateFilter?.comparison, isAnimationActive: isAnimationActive, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid, hideHorizontalCartesianGrid: hideHorizontalCartesianGrid, hideVerticalCartesianGrid: hideVerticalCartesianGrid, hideSubsequentXAxisTicks: hideSubsequentXAxisTicks, cartesianGridLineStyle: cartesianGridLineStyle ?? 'solid', comparisonLineStyle: comparisonLineStyle ?? 'solid', cartesianGridLineColor: cartesianGridLineColor, onClickChartElement: onClickChartElement }));
+    return (_jsx(LineChart, { colors: chartColors, colorMap: colorMap, yAxisFields: yAxisFields.sort(sortComparisonFirst), data: lineChartData, xAxisField: config.xAxisField, xAxisLabel: config.xAxisLabel, xAxisFormat: config.xAxisFormat, containerStyle: containerStyle, className: className, theme: theme, comparison: dateFilter?.comparison, isAnimationActive: isAnimationActive, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid, hideHorizontalCartesianGrid: hideHorizontalCartesianGrid, hideVerticalCartesianGrid: hideVerticalCartesianGrid, hideSubsequentXAxisTicks: hideSubsequentXAxisTicks, cartesianGridLineStyle: cartesianGridLineStyle ?? 'solid', comparisonLineStyle: comparisonLineStyle ?? 'solid', cartesianGridLineColor: cartesianGridLineColor, onClickChartElement: onClickChartElement, dateFilter: dateFilter }));
 };
 // Sort to put comparison first (ie. underneath) primary.
 const sortComparisonFirst = (a, b) => {

package/dist/esm/ChartBuilder.d.ts

@@ -191,8 +191,8 @@ export interface ChartBuilderProps {
     pivotData?: {
         rows: any[];
         columns: {
-            label: string;
             field: string;
+            label: string;
         }[];
     };
     /** The date range applied to this ChartBuilder. */
@@ -262,6 +262,8 @@ export interface ChartBuilderProps {
     isLoading?: boolean;
     /** A callback function triggered when a chart element is clicked */
     onClickChartElement?: (data: any) => void;
+    /** Used to generate a comparison pivot or not */
+    isComparison?: boolean;
 }
 /**
  * ### Quill Chart Builder with Modal
@@ -311,7 +313,7 @@ export declare function ChartBuilderWithModal(props: ChartBuilderProps): import(
  * ### Chart Builder API
  * @see https://docs.quillsql.com/components/chart-builder
  */
-export default function ChartBuilder({ TextInputComponent, SelectComponent, ButtonComponent, SecondaryButtonComponent, HeaderComponent, SubHeaderComponent, LabelComponent, DeleteButtonComponent, TextComponent, PopoverComponent, CardComponent, TableComponent, ModalComponent, LoadingComponent, ErrorMessageComponent, ChartBuilderInputRowContainer, ChartBuilderInputColumnContainer, PivotRowContainer, PivotColumnContainer, FormContainer, isOpen, isHorizontalView, pivot, setIsOpen, rows, columns, query, queryNoDateColumn, dateRange: dr, showTableFormatOptions, showDateFieldOptions, showAccessControlOptions, showDashboardDropdown, onAddToDashboardComplete, onDelete, report, recommendedPivots: rp, createdPivots: cp, destinationDashboard, dateColumn, buttonLabel, organizationName, pivotData, hideDeleteButton, hideSubmitButton, hideDateRangeFilter, initialUniqueValues, pivotRecommendationsEnabled, onSortChange, onPageChange, numberOfRows, isLoading, onClickChartElement }: ChartBuilderProps): import("react/jsx-runtime").JSX.Element | null;
+export default function ChartBuilder({ TextInputComponent, SelectComponent, ButtonComponent, SecondaryButtonComponent, HeaderComponent, SubHeaderComponent, LabelComponent, DeleteButtonComponent, TextComponent, PopoverComponent, CardComponent, TableComponent, ModalComponent, LoadingComponent, ErrorMessageComponent, ChartBuilderInputRowContainer, ChartBuilderInputColumnContainer, PivotRowContainer, PivotColumnContainer, FormContainer, isOpen, isHorizontalView, pivot, setIsOpen, rows, columns, query, queryNoDateColumn, dateRange: dr, showTableFormatOptions, showDateFieldOptions, showAccessControlOptions, showDashboardDropdown, onAddToDashboardComplete, onDelete, report, recommendedPivots: rp, createdPivots: cp, destinationDashboard, dateColumn, buttonLabel, organizationName, pivotData, hideDeleteButton, hideSubmitButton, hideDateRangeFilter, initialUniqueValues, pivotRecommendationsEnabled, onSortChange, onPageChange, numberOfRows, isLoading, isComparison, onClickChartElement, }: ChartBuilderProps): import("react/jsx-runtime").JSX.Element | null;
 export declare function DashboardFilterModal({ isOpen, setIsOpen, issues, ModalComponent, ButtonComponent, }: {
     isOpen: boolean;
     setIsOpen: (e: boolean) => void;

package/dist/esm/ChartBuilder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChartBuilder.d.ts","sourceRoot":"","sources":["../../src/ChartBuilder.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ChartBuilder.d.ts","sourceRoot":"","sources":["../../src/ChartBuilder.tsx"],"names":[],"mappings":"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"}

package/dist/esm/ChartBuilder.js

@@ -8,7 +8,7 @@ import { PivotCard } from './internals/ReportBuilder/PivotList';
 import Chart from './Chart';
 import { MemoizedModal, QuillTextInput, MemoizedButton, MemoizedSecondaryButton, MemoizedHeader, MemoizedLabel, MemoizedDeleteButton, MemoizedText, MemoizedPopover, QuillTableComponent, QuillChartBuilderInputRowContainer, QuillChartBuilderInputColumnContainer, MemoizedSubHeader, QuillErrorMessageComponent, QuillPivotRowContainer, QuillPivotColumnContainer, QuillChartBuilderFormContainer, QuillLoadingComponent, } from './components/UiComponents';
 import { mergeComparisonRange } from './utils/merge';
-import { removeDoubleQuotes, snakeAndCamelCaseToTitleCase } from './utils/textProcessing';
+import { removeDoubleQuotes, snakeAndCamelCaseToTitleCase, } from './utils/textProcessing';
 import { QuillSelectComponent } from './components/QuillSelect';
 import { QuillCard } from './components/QuillCard';
 import { quillFormat } from './utils/valueFormatter';
@@ -235,7 +235,7 @@ export function ChartBuilderWithModal(props) {
  * ### Chart Builder API
  * @see https://docs.quillsql.com/components/chart-builder
  */
-export default function ChartBuilder({ TextInputComponent = QuillTextInput, SelectComponent = QuillSelectComponent, ButtonComponent = MemoizedButton, SecondaryButtonComponent = MemoizedSecondaryButton, HeaderComponent = MemoizedHeader, SubHeaderComponent = MemoizedSubHeader, LabelComponent = MemoizedLabel, DeleteButtonComponent = MemoizedDeleteButton, TextComponent = MemoizedText, PopoverComponent = MemoizedPopover, CardComponent = QuillCard, TableComponent = QuillTableComponent, ModalComponent, LoadingComponent = QuillLoadingComponent, ErrorMessageComponent = QuillErrorMessageComponent, ChartBuilderInputRowContainer = QuillChartBuilderInputRowContainer, ChartBuilderInputColumnContainer = QuillChartBuilderInputColumnContainer, PivotRowContainer = QuillPivotRowContainer, PivotColumnContainer = QuillPivotColumnContainer, FormContainer = QuillChartBuilderFormContainer, isOpen, isHorizontalView = true, pivot, setIsOpen, rows, columns, query, queryNoDateColumn, dateRange: dr, showTableFormatOptions = false, showDateFieldOptions = false, showAccessControlOptions = false, showDashboardDropdown = true, onAddToDashboardComplete, onDelete, report = undefined, recommendedPivots: rp = [], createdPivots: cp = [], destinationDashboard, dateColumn, buttonLabel, organizationName, pivotData, hideDeleteButton = false, hideSubmitButton = false, hideDateRangeFilter = false, initialUniqueValues, pivotRecommendationsEnabled = true, onSortChange, onPageChange, numberOfRows, isLoading, onClickChartElement }) {
+export default function ChartBuilder({ TextInputComponent = QuillTextInput, SelectComponent = QuillSelectComponent, ButtonComponent = MemoizedButton, SecondaryButtonComponent = MemoizedSecondaryButton, HeaderComponent = MemoizedHeader, SubHeaderComponent = MemoizedSubHeader, LabelComponent = MemoizedLabel, DeleteButtonComponent = MemoizedDeleteButton, TextComponent = MemoizedText, PopoverComponent = MemoizedPopover, CardComponent = QuillCard, TableComponent = QuillTableComponent, ModalComponent, LoadingComponent = QuillLoadingComponent, ErrorMessageComponent = QuillErrorMessageComponent, ChartBuilderInputRowContainer = QuillChartBuilderInputRowContainer, ChartBuilderInputColumnContainer = QuillChartBuilderInputColumnContainer, PivotRowContainer = QuillPivotRowContainer, PivotColumnContainer = QuillPivotColumnContainer, FormContainer = QuillChartBuilderFormContainer, isOpen, isHorizontalView = true, pivot, setIsOpen, rows, columns, query, queryNoDateColumn, dateRange: dr, showTableFormatOptions = false, showDateFieldOptions = false, showAccessControlOptions = false, showDashboardDropdown = true, onAddToDashboardComplete, onDelete, report = undefined, recommendedPivots: rp = [], createdPivots: cp = [], destinationDashboard, dateColumn, buttonLabel, organizationName, pivotData, hideDeleteButton = false, hideSubmitButton = false, hideDateRangeFilter = false, initialUniqueValues, pivotRecommendationsEnabled = true, onSortChange, onPageChange, numberOfRows, isLoading, isComparison, onClickChartElement, }) {
     const dateRange = dr;
     const [client] = useContext(ClientContext);
     const [theme] = useContext(ThemeContext);
@@ -336,6 +336,9 @@ export default function ChartBuilder({ TextInputComponent = QuillTextInput, Sele
     const [dashboardOptions, setDashboardOptions] = useState([]);
     const [defaultDashboardName, setDefaultDashboardName] = useState(destinationDashboard || report?.dashboardName || '');
     const { dashboardFilters } = useContext(DashboardFiltersContext);
+    const specificDashboardFilter = useMemo(() => {
+        return dashboardFilters.filter((f) => f && defaultDashboardName === f.dashboardName);
+    }, [dashboardFilters]);
     const [dashboardFilters2, setDashboardFilters] = useState([]);
     const [dashboardHasDateFilter, setDashboardHasDateFilter] = useState(false);
     const [dashboardHasDateComparison, setDashboardHasDateComparison] = useState(false);
@@ -361,7 +364,6 @@ export default function ChartBuilder({ TextInputComponent = QuillTextInput, Sele
     const [allTables, setAllTables] = useState([]);
     const [customFieldTableRef, setCustomFieldTableRef] = useState(false);
     const [referencedColumns, setReferencedColumns] = useState({});
-    const [uniqueValues, setUniqueValues] = useState(undefined);
     const [defaultDateField, setDefaultDateField] = useState({
         table: dateFieldOptions[0]?.name || '',
         field: dateFieldOptions[0]?.columns[0]?.name || '',
@@ -409,9 +411,11 @@ export default function ChartBuilder({ TextInputComponent = QuillTextInput, Sele
                 credentials: 'omit', // If withCredentials is true, set to 'include'. Otherwise, set to 'omit'.
             });
             const responseData = (await response.json()).data;
-            setDashboardFilters(responseData.filters);
-            setDashboardHasDateFilter(!!responseData.dateFilter);
-            setDashboardHasDateComparison(responseData.dateFilter?.comparison || false);
+            if (responseData) {
+                setDashboardFilters(responseData.filters);
+                setDashboardHasDateFilter(!!responseData.dateFilter);
+                setDashboardHasDateComparison(responseData.dateFilter?.comparison || false);
+            }
         }
     };
     const pivotFormData = (pivot) => {
@@ -420,7 +424,6 @@ export default function ChartBuilder({ TextInputComponent = QuillTextInput, Sele
             ? report.yAxisFields[0].label
             : pivot.valueField;
         // date labels for pivots should be treated like strings since they are
-        // formatted in generatePivotTable
         const yAxisIsDate = pivot.columnField
             ? isDateField(pivot.columnFieldType || '')
             : false;
@@ -494,6 +497,7 @@ export default function ChartBuilder({ TextInputComponent = QuillTextInput, Sele
                 setSchema(curSchemaData);
             }
             if (!query) {
+                setLoadingFormData(false);
                 return;
             }
             const result = await getReferencedTables(client, query, curSchemaData);
@@ -546,13 +550,16 @@ export default function ChartBuilder({ TextInputComponent = QuillTextInput, Sele
     }, []);
     const selectedPivotTable = useMemo(() => {
         if (formData.pivot && rows) {
-            if (intialLoad && pivotData) {
+            if (intialLoad &&
+                pivotData &&
+                pivotData.rows &&
+                pivotData.rows.length > 0) {
                 setInitialLoad(false);
                 return pivotData;
             }
             else {
                 setInitialLoad(false);
-                return generatePivotTable(formData.pivot, rows, dateRange, false);
+                return generatePivotTable(formData.pivot, rows, dateRange, isComparison ?? false);
             }
         }
         else {
@@ -871,7 +878,10 @@ export default function ChartBuilder({ TextInputComponent = QuillTextInput, Sele
                     ...resp,
                     rows,
                     columns,
-                    filtersApplied: dashboardFilters,
+                    pivotRows: selectedPivotTable?.rows || undefined,
+                    pivotColumns: selectedPivotTable?.columns || undefined,
+                    filtersApplied: specificDashboardFilter,
+                    triggerReload: true,
                 },
             });
         }
@@ -883,7 +893,7 @@ export default function ChartBuilder({ TextInputComponent = QuillTextInput, Sele
                 ...resp,
                 rows,
                 columns,
-                filtersApplied: dashboardFilters,
+                filtersApplied: specificDashboardFilter,
             });
         }
     };
@@ -918,7 +928,12 @@ export default function ChartBuilder({ TextInputComponent = QuillTextInput, Sele
                             }),
                             ...(!isHorizontalView && isOpen && { width: formWidth }),
                         }, children: [((!isHorizontalView && windowWidth >= 1200) ||
-                                formData.chartType !== 'table') && (_jsx(Chart, { colors: theme.chartColors, config: { ...formData, rows }, hideDateRangeFilter: hideDateRangeFilter, containerStyle: {
+                                formData.chartType !== 'table') && (_jsx(Chart, { colors: theme.chartColors, config: {
+                                    ...formData,
+                                    rows: rows,
+                                    pivotRows: selectedPivotTable?.rows || undefined,
+                                    pivotColumns: selectedPivotTable?.columns || undefined,
+                                }, hideDateRangeFilter: hideDateRangeFilter, containerStyle: {
                                     width: '100%',
                                     height: formData.chartType === 'metric'
                                         ? 100