@quillsql/react 2.13.44 → 2.13.46

package/dist/esm/ReportBuilder.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useContext, useEffect, useMemo, useRef, useState, } from 'react';
 import { MemoizedButton, MemoizedDeleteButton, MemoizedHeader, MemoizedLabel, MemoizedSecondaryButton, MemoizedText, MemoizedPopover, QuillTabs, MemoizedModal, QuillChartBuilderInputRowContainer, QuillChartBuilderInputColumnContainer, MemoizedSubHeader, QuillErrorMessageComponent, QuillPivotRowContainer, QuillPivotColumnContainer, QuillColumnSearchEmptyState, QuillChartBuilderFormContainer, QuillLoadingComponent, QuillTableReportBuilderComponent, QuillChartBuilderCheckboxComponent, QuillToolTip, } from './components/UiComponents';
-import { ClientContext, DashboardContext, SchemaDataContext, TenantContext, ThemeContext, } from './Context';
+import { ClientContext, SchemaDataContext, TenantContext, ThemeContext, } from './Context';
 import { ChartBuilderWithModal } from './ChartBuilder';
 import { QuillTextInput } from './components/UiComponents';
 import { QuillSidebar, CustomContainer, QuillSelectColumn, QuillDraggableColumn, QuillSidebarHeading, QuillFilterPopover, QuillSortPopover, QuillLimitPopover, } from './components/ReportBuilder/ui';
@@ -12,7 +12,7 @@ import { AddLimitPopover, LimitSentence, } from './components/ReportBuilder/AddL
 import { updateFirstChildWidth } from './utils/width';
 import { QuillSelectComponent } from './components/QuillSelect';
 import { QuillCard } from './components/QuillCard';
-import { isValidPivot, pivotFormData, } from './utils/pivotProcessing';
+import { isValidPivot, pivotFormData } from './utils/pivotProcessing';
 import { fetchResultsByQuery, fetchTableByAST, getUniqueStringValuesByTable, } from './utils/tableProcessing';
 import { createSelectStarFromAst, fetchAndProcessASTFromPrompt, fetchASTFromQuillReport, } from './utils/astProcessing';
 import PivotForm from './internals/ReportBuilder/PivotForm';
@@ -28,9 +28,12 @@ import { cleanDashboardItem } from './utils/dashboard';
 import { useDashboards } from './hooks/useDashboard';
 import { EMPTY_REPORT_BUILDER_STATE, } from './models/ReportBuilder';
 import DraggableColumns from './components/ReportBuilder/DraggableColumns';
-import NewAddColumnModal from './components/ReportBuilder/AddColumnModal';
-import { astToReportBuilderState, formatRows, isValidPivotForReport, reportBuilderStateToAst, setTypesOnPivot, } from './utils/reportBuilder';
+import AddColumnModal from './components/ReportBuilder/AddColumnModal';
+import { astToReportBuilderState, formatRows, isValidPivotForReport, reportBuilderStateToAst, setTypesOnPivot, validatedReportBuilderState, } from './utils/reportBuilder';
 import { fetchSqlQuery } from './utils/dataFetcher';
+import { useDashboardReports } from './hooks/useDashboard';
+import { getSchemaForeignKeyMapping } from './utils/schema';
+import { filterSentence } from './utils/filterProcessing';
 /**
  * Quill Report Builder
  *
@@ -102,7 +105,7 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
     // isChartBuilderHorizontalView: whether the chart builder is in horizontal view mode
     // onClickChartElement: a callback function triggered when a chart element is clicked
     // Contexts
-    const [dashboard] = useContext(DashboardContext);
+    const { dashboardReports: dashboard } = useDashboardReports(destinationDashboard);
     const [schemaData] = useContext(SchemaDataContext);
     const { dashboards } = useDashboards();
     const destinationDashboardConfig = useMemo(() => {
@@ -114,7 +117,10 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
                 table.ownerTenantFields?.length === 0 ||
                 table.ownerTenantFields?.includes(destinationDashboardConfig?.tenantKeys?.[0] ?? ''));
         });
-    }, [schemaData.schemaWithCustomFields, destinationDashboardConfig?.tenantKeys]);
+    }, [
+        schemaData.schemaWithCustomFields,
+        destinationDashboardConfig?.tenantKeys,
+    ]);
     const { tenants } = useContext(TenantContext);
     const [theme] = useContext(ThemeContext);
     const [client] = useContext(ClientContext);
@@ -137,6 +143,7 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
     const [errorMessage, setErrorMessage] = useState('');
     const [unresolvedReportMessage, setUnresolvedReportMessage] = useState('');
     // Core Report states
+    // Table order matters for joins. For now, assumed to have one 'primary' table (the first one)
     const [tables, setTables] = useState([]);
     const [columns, setColumns] = useState([]);
     const [filterStack, setFilterStack] = useState([]);
@@ -153,10 +160,12 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
             limit,
         };
     }, [columns, filterStack, limit, pivot, sort, tables]);
-    const undoButtonEnabled = false; // TODO: enable
+    // For undo/redo
     const [stateStack, setStateStack] = useState([]);
+    const [poppedStateStack, setPoppedStateStack] = useState([]);
     // Other Report states
     const [activeQuery, setActiveQuery] = useState('');
+    const [queryOutOfSync, setQueryOutOfSync] = useState(false);
     const [unfilteredUniqueValues, setUnfilteredUniqueValues] = useState({}); // unique values before filtering
     const [unfilteredUniqueValuesIsLoading, setUnfilteredUniqueValuesIsLoading] = useState(false);
     const [filteredUniqueValues, setFilteredUniqueValues] = useState(null); // unique values after filtering
@@ -219,8 +228,8 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
         if (tables.length === 1) {
             // Check if all columns are selected
             const totalColumnLength = tables.reduce((acc, table) => {
-                const tableColumns = filteredSchema.find((t) => t.name === table.name)
-                    ?.columns.length ?? 0;
+                const tableColumns = filteredSchema.find((t) => t.name === table.name)?.columns.length ??
+                    0;
                 return acc + tableColumns;
             }, 0);
             return totalColumnLength === columns.length;
@@ -239,11 +248,22 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
             return 'Please add a limit.';
         }
     }, [client, limit, pivot]);
+    const foreignKeyMap = useMemo(() => {
+        return getSchemaForeignKeyMapping(filteredSchema);
+    }, [filteredSchema]);
     // State changing functions
-    const clearAllState = () => {
+    const clearAllState = (resetStateStack = true) => {
         setActiveQuery('');
-        handleMultiStateChange(EMPTY_REPORT_BUILDER_STATE);
-        setStateStack([]);
+        setQueryOutOfSync(false);
+        handleMultiStateChange({
+            state: EMPTY_REPORT_BUILDER_STATE,
+            fetchData: false,
+            updateStateStack: true,
+        });
+        if (resetStateStack) {
+            setStateStack([]);
+            setPoppedStateStack([]);
+        }
         setFilteredUniqueValues(null);
         setUnfilteredUniqueValues({});
         setColumnUniqueValues({});
@@ -286,54 +306,99 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
                 ...prevStack,
                 { ...reportBuilderState, tables: newTables },
             ]);
+            setPoppedStateStack([]);
         }
     };
-    const handleColumnsChange = (newColumns, fetchData, updateStateStack = true) => {
-        // If pivot is using removed columns, remove pivot
-        let removePivot = false;
-        if (pivot) {
-            const referencedColumns = [];
-            if (pivot.rowField) {
-                referencedColumns.push(pivot.rowField);
-            }
-            if (pivot.columnField) {
-                referencedColumns.push(pivot.columnField);
+    const handleColumnsChange = (newColumns, fetchData, updateStateStack = true, bypassConfirmation = false) => {
+        const validReportBuilderState = bypassConfirmation
+            ? { ...reportBuilderState, columns: newColumns }
+            : validatedReportBuilderState({
+                ...reportBuilderState,
+                columns: newColumns,
+            }, foreignKeyMap);
+        if (validReportBuilderState.tables.length === 0 && !bypassConfirmation) {
+            if (!confirm('Removing all columns will clear all state. Are you sure you want to continue?')) {
+                return;
             }
-            if (pivot.aggregations) {
-                pivot.aggregations.forEach((agg) => {
-                    if (agg.valueField) {
-                        referencedColumns.push(agg.valueField);
-                    }
-                    if (agg.valueField2) {
-                        referencedColumns.push(agg.valueField2);
-                    }
+            else {
+                handleMultiStateChange({
+                    state: EMPTY_REPORT_BUILDER_STATE,
+                    fetchData: false,
+                    updateStateStack: true,
                 });
+                return;
             }
-            const columnMapping = referencedColumns
-                .map((col) => {
-                const column = columns.find((c) => (c.alias || c.field) === col);
-                return column;
-            })
-                .filter((c) => c !== undefined);
-            removePivot = !columnMapping.every((col) => newColumns.some((c) => (c.alias || c.field) === (col.alias || col.field) &&
-                c.table === col.table));
-            if (removePivot) {
-                handlePivotChange(null);
+        }
+        const tablesAffected = tables.length - validReportBuilderState.tables.length >= 2;
+        const filtersAffected = validReportBuilderState.filterStack.length !== filterStack.length;
+        const deletedTables = tables
+            .filter((table) => {
+            return !validReportBuilderState.tables.some((t) => t.name === table.name);
+        })
+            .map((table) => table.name);
+        const deletedFilters = filterStack
+            .filter((filter) => filter.value)
+            .filter((filter) => {
+            return deletedTables.some((table) => table === filter.value.table);
+        })
+            .map((filter) => filterSentence(filter.value));
+        if (tablesAffected && filtersAffected) {
+            if (!confirm(`Removing this column will remove the following table${deletedTables.length > 1 ? 's' : ''}:
+          ${deletedTables.join(', ')}.
+          It will also remove the following filter${deletedFilters.length > 1 ? 's' : ''}:
+          ${deletedFilters.join(', ')}.
+          Are you sure you want to continue?
+          `
+                .replace(/\s+/g, ' ')
+                .trim())) {
+                return;
+            }
+        }
+        else if (tablesAffected) {
+            if (!confirm(`Removing this column will remove the following table${deletedTables.length > 1 ? 's' : ''}:
+          ${deletedTables.join(', ')}.
+          Are you sure you want to continue?
+          `
+                .replace(/\s+/g, ' ')
+                .trim())) {
+                return;
+            }
+        }
+        else if (filtersAffected) {
+            if (!confirm(`Removing this column will remove the following filter${deletedFilters.length > 1 ? 's' : ''}:
+          ${deletedFilters.join(', ')}.
+          Are you sure you want to continue?
+          `
+                .replace(/\s+/g, ' ')
+                .trim())) {
+                return;
             }
         }
-        setColumns(newColumns);
+        if (validReportBuilderState.tables.length !== tables.length) {
+            handleTablesChange(validReportBuilderState.tables, false);
+            fetchData = true;
+        }
+        if (validReportBuilderState.filterStack.length !== filterStack.length) {
+            handleFilterStackChange(validReportBuilderState.filterStack, false, false);
+            fetchData = true;
+        }
+        if (validReportBuilderState.sort.length !== sort.length) {
+            handleSortChange(validReportBuilderState.sort, false, false);
+            fetchData = true;
+        }
+        if (pivot && !validReportBuilderState.pivot) {
+            handlePivotChange(validReportBuilderState.pivot, false, false);
+        }
+        setColumns(validReportBuilderState.columns);
         if (updateStateStack) {
-            setStateStack((prevStack) => [
-                ...prevStack,
-                { ...reportBuilderState, columns: newColumns },
-            ]);
+            setStateStack((prevStack) => [...prevStack, validReportBuilderState]);
+            setPoppedStateStack([]);
         }
         if (fetchData) {
-            fetchDataFromReportBuilderState({
-                ...reportBuilderState,
-                columns: newColumns,
-                pivot: removePivot ? null : pivot,
-            });
+            fetchDataFromReportBuilderState(validReportBuilderState);
+        }
+        else {
+            setQueryOutOfSync(true);
         }
     };
     const handleFilterInsertion = (newFilter) => {
@@ -367,6 +432,7 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
                 ...prevStack,
                 { ...reportBuilderState, filterStack: newFilterStack },
             ]);
+            setPoppedStateStack([]);
         }
         if (fetchData) {
             fetchDataFromReportBuilderState({
@@ -403,6 +469,7 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
                     limit: resetSortAndLimit ? null : limit,
                 },
             ]);
+            setPoppedStateStack([]);
         }
         if (fetchData) {
             fetchDataFromReportBuilderState({
@@ -458,6 +525,7 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
                 ...prevStack,
                 { ...reportBuilderState, sort: newSort },
             ]);
+            setPoppedStateStack([]);
         }
         if (fetchData) {
             fetchDataFromReportBuilderState({
@@ -473,6 +541,7 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
                 ...prevStack,
                 { ...reportBuilderState, limit: newLimit },
             ]);
+            setPoppedStateStack([]);
         }
         if (fetchData) {
             fetchDataFromReportBuilderState({
@@ -481,12 +550,12 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
             });
         }
     };
-    const handleMultiStateChange = (state, fetchData, updateStateStack = true) => {
+    const handleMultiStateChange = ({ state, fetchData, updateStateStack = true, report, }) => {
         if (state.tables !== undefined) {
             handleTablesChange(state.tables, false);
         }
         if (state.columns !== undefined) {
-            handleColumnsChange(state.columns, false, false);
+            handleColumnsChange(state.columns, false, false, true);
         }
         if (state.filterStack !== undefined) {
             handleFilterStackChange(state.filterStack, false, false);
@@ -505,9 +574,10 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
                 ...prevStack,
                 { ...reportBuilderState, ...state },
             ]);
+            setPoppedStateStack([]);
         }
         if (fetchData) {
-            fetchDataFromReportBuilderState({ ...reportBuilderState, ...state }, !!state.filterStack, !!state.tables);
+            fetchDataFromReportBuilderState({ ...reportBuilderState, ...state }, !!state.filterStack, !!state.tables, report);
         }
     };
     const handleUndo = () => {
@@ -515,10 +585,33 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
             return;
         }
         const previousState = stateStack[stateStack.length - 2];
+        setPoppedStateStack((prevStack) => [
+            ...prevStack,
+            stateStack[stateStack.length - 1],
+        ]);
         setStateStack((prevStack) => prevStack.slice(0, -1));
-        handleMultiStateChange(previousState, true, false);
+        // Only fetch data if the previous state has columns
+        handleMultiStateChange({
+            state: previousState,
+            fetchData: previousState.columns.length > 0,
+            updateStateStack: false,
+        });
+    };
+    const handleRedo = () => {
+        if (poppedStateStack.length === 0) {
+            return;
+        }
+        const lastState = poppedStateStack[poppedStateStack.length - 1];
+        setStateStack((prevStack) => [...prevStack, lastState]);
+        setPoppedStateStack((prevStack) => prevStack.slice(0, -1));
+        // Only fetch data if the last state has columns
+        handleMultiStateChange({
+            state: lastState,
+            fetchData: lastState.columns.length > 0,
+            updateStateStack: false,
+        });
     };
-    const fetchDataFromReportBuilderState = (state, filtersChanged, tablesChanged) => {
+    const fetchDataFromReportBuilderState = (state, filtersChanged, tablesChanged, report) => {
         if (!client) {
             return;
         }
@@ -526,11 +619,12 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
         fetchReportFromASTHelper({
             ast,
             pivot: state.pivot,
+            previousReport: report,
             requiresNewFilteredUniqueValues: filtersChanged,
             requiresNewUnfilteredUniqueValues: tablesChanged,
         });
     };
-    const fetchReportFromASTHelper = async ({ ast, pivot, previousReport, requiresNewFilteredUniqueValues = false, requiresNewUnfilteredUniqueValues = false, }) => {
+    const fetchReportFromASTHelper = async ({ ast, pivot, previousReport = tempReport, requiresNewFilteredUniqueValues = false, requiresNewUnfilteredUniqueValues = false, }) => {
         let reportBuilderInfo = undefined;
         setErrorMessage('');
         const schema = filteredSchema;
@@ -592,6 +686,7 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
             pagination: REPORT_BUILDER_PAGINATION,
         });
         setActiveQuery(reportBuilderInfo.query);
+        setQueryOutOfSync(false);
         // table data
         fetchRowCountFromAST(ast, ast.where);
         setReportRows(reportBuilderInfo.rows);
@@ -734,7 +829,10 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
         }
         setAskAILoading(false);
         const newState = astToReportBuilderState(astInfo.ast, client.databaseType || 'postgresql', filteredSchema);
-        handleMultiStateChange({ ...newState, pivot: astInfo.pivot }, true);
+        handleMultiStateChange({
+            state: { ...newState, pivot: astInfo.pivot },
+            fetchData: true,
+        });
     };
     const fetchGlobalUniqueValues = async (columns, tables) => {
         if (!client) {
@@ -753,6 +851,15 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
         setUnfilteredUniqueValues(uniqueStrings);
         setUnfilteredUniqueValuesIsLoading(false);
     };
+    const fetchQueryFromReportBuilderState = async (state) => {
+        if (!client) {
+            return '';
+        }
+        const ast = reportBuilderStateToAst(state, client.databaseType?.toLowerCase() || 'postgresql');
+        const query = await fetchSqlQuery(ast, client);
+        setActiveQuery(query.query);
+        return query.query;
+    };
     const resetProcessing = () => {
         setCurrentProcessing({ page: REPORT_BUILDER_PAGINATION });
         setPreviousPage(0);
@@ -943,9 +1050,13 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
                 const initialState = astToReportBuilderState(newAst, client.databaseType || 'postgresql', filteredSchema);
                 setTempReport(report);
                 handleMultiStateChange({
-                    ...initialState,
-                    pivot: newPivot ?? null,
-                }, true);
+                    state: {
+                        ...initialState,
+                        pivot: newPivot ?? null,
+                    },
+                    fetchData: true,
+                    report,
+                });
             }
             catch (err) {
                 console.error(err);
@@ -963,13 +1074,16 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
             })?.columns ?? [];
             if (tableColumns.length > 0) {
                 handleMultiStateChange({
-                    ...EMPTY_REPORT_BUILDER_STATE,
-                    tables: [{ name: initialTableName }],
-                    columns: tableColumns.map((col) => ({
-                        field: col.field,
-                        table: initialTableName,
-                    })),
-                }, true);
+                    state: {
+                        ...EMPTY_REPORT_BUILDER_STATE,
+                        tables: [{ name: initialTableName }],
+                        columns: tableColumns.map((col) => ({
+                            field: col.field,
+                            table: initialTableName,
+                        })),
+                    },
+                    fetchData: true,
+                });
             }
         }
     }, [filteredSchema, initialTableName]);
@@ -997,16 +1111,17 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
                                                     setOpenPopover(null);
                                                 }, 100);
                                             }
-                                        }, title: "Select columns", children: _jsx(NewAddColumnModal, { onSave: (tables, columns) => {
+                                        }, title: "Select columns", children: _jsx(AddColumnModal, { onSave: (tables, columns) => {
                                                 handleMultiStateChange({
-                                                    ...EMPTY_REPORT_BUILDER_STATE,
-                                                    tables,
-                                                    columns,
-                                                }, true);
+                                                    state: {
+                                                        ...EMPTY_REPORT_BUILDER_STATE,
+                                                        tables,
+                                                        columns,
+                                                    },
+                                                    fetchData: true,
+                                                });
                                                 setOpenPopover(null);
-                                            }, 
-                                            // selectedTables={tables} // Bring back after select table join UI
-                                            selectedColumns: columns, schema: filteredSchema, schemaLoading: schemaData.isSchemaLoading, TextInputComponent: TextInputComponent, SelectColumn: SelectColumnComponent, SecondaryButton: SecondaryButtonComponent, Button: ButtonComponent, ColumnSearchEmptyState: ColumnSearchEmptyState, LoadingComponent: LoadingComponent }) })] }), _jsxs("div", { style: { width: '100%' }, children: [_jsx(SidebarHeadingComponent, { label: "Filters" }), filterStack.length > 0 && (_jsx("div", { style: {
+                                            }, selectedTables: tables, selectedColumns: columns, schema: filteredSchema, foreignKeyMap: foreignKeyMap, schemaLoading: schemaData.isSchemaLoading, TextInputComponent: TextInputComponent, SelectColumn: SelectColumnComponent, SecondaryButton: SecondaryButtonComponent, Button: ButtonComponent, ColumnSearchEmptyState: ColumnSearchEmptyState, LoadingComponent: LoadingComponent }) })] }), _jsxs("div", { style: { width: '100%' }, children: [_jsx(SidebarHeadingComponent, { label: "Filters" }), filterStack.length > 0 && (_jsx("div", { style: {
                                             display: 'flex',
                                             flexDirection: 'column',
                                             gap: 8,
@@ -1128,7 +1243,7 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
                                                     if (tables.length <= 1) {
                                                         fetchAstFromPromptHelper();
                                                     }
-                                                }, isLoading: askAILoading && columns.length === 0, label: 'Ask AI' }) }), !reportId && (_jsx(SecondaryButtonComponent, { label: 'New report', onClick: clearAllState, disabled: columns.length === 0 || loading }))] }) })), columns.length > 0 && (_jsx(TableComponent, { isLoading: tableLoading || (loading && errorMessage.length === 0), rows: formattedRows, rowCount: pivot ? pivotData?.rowCount : numberOfRows, rowCountIsLoading: rowCountIsLoading, rowsPerPage: 20, columns: pivot
+                                                }, isLoading: askAILoading && columns.length === 0, label: 'Ask AI' }) }), !reportId && (_jsx(SecondaryButtonComponent, { label: 'New report', onClick: () => clearAllState(false), disabled: columns.length === 0 || loading }))] }) })), columns.length > 0 && (_jsx(TableComponent, { isLoading: tableLoading || (loading && errorMessage.length === 0), rows: formattedRows, rowCount: pivot ? pivotData?.rowCount : numberOfRows, rowCountIsLoading: rowCountIsLoading, rowsPerPage: 20, columns: pivot
                                     ? pivotData?.columns || []
                                     : reportColumnsToStateColumns.map((col) => {
                                         return {
@@ -1155,7 +1270,12 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
                                             alignItems: 'center',
                                         }, children: [_jsx(ErrorMessageComponent, { errorMessage: errorMessage || pivotError }), _jsx(SecondaryButtonComponent, { onClick: () => {
                                                     fetchAstFromPromptHelper();
-                                                }, label: 'Retry' }), _jsx(SecondaryButtonComponent, { onClick: clearAllState, label: 'Reset' })] })) : (_jsx("div", { style: { width: '100%' } })), columns.length > 0 && activeQuery && (_jsxs(_Fragment, { children: [undoButtonEnabled && stateStack.length > 1 && (_jsx(SecondaryButtonComponent, { onClick: handleUndo, label: "Undo", disabled: stateStack.length <= 1 || loading })), onDiscardChanges && (_jsx(SecondaryButtonComponent, { onClick: onDiscardChanges, label: "Discard changes" })), !hideCopySQL && (_jsx(SecondaryButtonComponent, { label: isCopying ? 'Copied' : 'Copy SQL', onClick: () => copySQLToClipboard() })), !isAdminEnabled ? null : (_jsx(SecondaryButtonComponent, { onClick: async () => {
+                                                }, label: 'Retry' }), _jsx(SecondaryButtonComponent, { onClick: () => clearAllState(false), label: 'Reset' })] })) : (_jsx("div", { style: { width: '100%' } })), stateStack.length > 0 && (_jsx(SecondaryButtonComponent, { onClick: handleUndo, label: "", icon: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", strokeWidth: 1.5, stroke: "currentColor", className: "size-6", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 15 3 9m0 0 6-6M3 9h12a6 6 0 0 1 0 12h-3" }) }), disabled: stateStack.length <= 1 || loading })), stateStack.length > 0 && (_jsx(SecondaryButtonComponent, { onClick: handleRedo, label: "", icon: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", strokeWidth: 1.5, stroke: "currentColor", className: "size-6", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "m15 15 6-6m0 0-6-6m6 6H9a6 6 0 0 0 0 12h3" }) }), disabled: poppedStateStack.length < 1 || loading })), columns.length > 0 && activeQuery && (_jsxs(_Fragment, { children: [onDiscardChanges && (_jsx(SecondaryButtonComponent, { onClick: onDiscardChanges, label: "Discard changes" })), !hideCopySQL && (_jsx(SecondaryButtonComponent, { label: isCopying ? 'Copied' : 'Copy SQL', onClick: () => copySQLToClipboard() })), !isAdminEnabled ? null : (_jsx(SecondaryButtonComponent, { onClick: async () => {
+                                                    let tempReportQuery = activeQuery;
+                                                    if (queryOutOfSync) {
+                                                        tempReportQuery =
+                                                            await fetchQueryFromReportBuilderState(reportBuilderState);
+                                                    }
                                                     const tempReportColumns = columns
                                                         .map((column) => {
                                                         return reportColumnsToStateColumns.find((col) => col.field === (column.alias || column.field));
@@ -1193,8 +1313,8 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
                                                                 })
                                                             : tempReportColumns,
                                                         queryString: isSelectStar
-                                                            ? convertQueryToSelectStar(activeQuery)
-                                                            : activeQuery,
+                                                            ? convertQueryToSelectStar(tempReportQuery)
+                                                            : tempReportQuery,
                                                         includeCustomFields: isSelectStar,
                                                         rows: reportRows,
                                                         pivotRows: pivotData?.rows,
@@ -1210,6 +1330,11 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
                                                     tableLoading ||
                                                     loading ||
                                                     !!unresolvedReportMessage, label: 'Save query', tooltipText: unresolvedReportMessage })), _jsx(ButtonComponent, { onClick: async () => {
+                                                    let tempReportQuery = activeQuery;
+                                                    if (queryOutOfSync) {
+                                                        tempReportQuery =
+                                                            await fetchQueryFromReportBuilderState(reportBuilderState);
+                                                    }
                                                     onSaveChanges && onSaveChanges();
                                                     const tempReportColumns = columns
                                                         .map((column) => {
@@ -1248,8 +1373,8 @@ export default function ReportBuilder({ initialTableName = '', onSubmitEditRepor
                                                                 })
                                                             : tempReportColumns,
                                                         queryString: isSelectStar
-                                                            ? convertQueryToSelectStar(activeQuery)
-                                                            : activeQuery,
+                                                            ? convertQueryToSelectStar(tempReportQuery)
+                                                            : tempReportQuery,
                                                         includeCustomFields: isSelectStar,
                                                         rows: reportRows,
                                                         pivotRows: pivotData?.rows,

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

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

package/dist/esm/Table.js

@@ -52,8 +52,8 @@ const Table = ({ TableComponent = QuillTableComponent, ...props }) => {
     reportFilters } = useContext(ReportFiltersContext);
     const specificReportFilters = useMemo(() => {
         return Object.values(reportFilters[props.reportId ?? ''] ??
-            (dashboard[props.reportId ?? '']
-                ? dashboardFilters[dashboard[props.reportId ?? '']?.dashboardName ?? '']
+            (dashboard[report?.dashboardName ?? '']?.[report?.id ?? '']
+                ? dashboardFilters[report.dashboardName]
                 : null) ??
             {}).map((f) => f.filter);
     }, [reportFilters[props.reportId ?? '']]);
@@ -72,6 +72,6 @@ const Table = ({ TableComponent = QuillTableComponent, ...props }) => {
     }
     return (_jsx(DataLoader, { item: report, filters: specificReportFilters, userFilters: userFilters?.map(convertCustomFilter), additionalProcessing: {
             page: DEFAULT_PAGINATION,
-        }, reportMode: true, children: ({ isLoading, error, onPageChange, onSortChange, data, rowCount, rowCountIsLoading, }) => _jsx(TableComponent, { report: data, isLoading: isLoading, error: error, rowCount: rowCount ?? data?.rowCount ?? data?.rows?.length ?? 0, rowCountIsLoading: rowCountIsLoading, onPageChange: (page) => onPageChange(page), onSortChange: (sort) => onSortChange(sort), hideName: true }) }));
+        }, children: ({ isLoading, error, onPageChange, onSortChange, data, rowCount, rowCountIsLoading, }) => _jsx(TableComponent, { report: data, isLoading: isLoading, error: error, rowCount: rowCount ?? data?.rowCount ?? data?.rows?.length ?? 0, rowCountIsLoading: rowCountIsLoading, onPageChange: (page) => onPageChange(page), onSortChange: (sort) => onSortChange(sort), hideName: true }) }));
 };
 export default Table;

package/dist/esm/components/Chart/BarChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BarChart.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/BarChart.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAI7C,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,MAAM,EACN,QAAQ,EACR,WAAW,EACX,IAAI,EACJ,cAAc,EACd,SAAS,EACT,UAAU,EACV,WAAW,EACX,KAAK,EACL,UAAU,EACV,SAAS,EACT,iBAAwB,EACxB,SAAiB,EACjB,SAAiB,EACjB,iBAAyB,EACzB,mBAAmB,EACnB,UAAU,EACV,cAAc,GACf,EAAE;IACD,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,WAAW,EAAE,GAAG,EAAE,CAAC;IACnB,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,UAAU,CAAC;IACxB,KAAK,EAAE,GAAG,CAAC;IACX,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,mBAAmB,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IACvC,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,cAAc,CAAC,EAAE;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,EAAE,CAAA;KAAC,EAAE,CAAC;CACrD,2CAkNA"}
+{"version":3,"file":"BarChart.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/BarChart.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAI7C,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,MAAM,EACN,QAAQ,EACR,WAAW,EACX,IAAI,EACJ,cAAc,EACd,SAAS,EACT,UAAU,EACV,WAAW,EACX,KAAK,EACL,UAAU,EACV,SAAS,EACT,iBAAwB,EACxB,SAAiB,EACjB,SAAiB,EACjB,iBAAyB,EACzB,mBAAmB,EACnB,UAAU,EACV,cAAc,GACf,EAAE;IACD,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,WAAW,EAAE,GAAG,EAAE,CAAC;IACnB,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,UAAU,CAAC;IACxB,KAAK,EAAE,GAAG,CAAC;IACX,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,mBAAmB,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IACvC,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,cAAc,CAAC,EAAE;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,EAAE,CAAA;KAAC,EAAE,CAAC;CACrD,2CAiNA"}

package/dist/esm/components/Chart/BarChart.js

@@ -29,7 +29,6 @@ export default function BarChart({ colors, colorMap, yAxisFields, data, containe
                 display: 'flex',
                 flex: '1 0 auto',
                 height: '100%',
-                margin: 'auto',
                 justifyContent: 'center',
                 alignItems: 'center',
                 fontSize: 13,
@@ -40,7 +39,7 @@ export default function BarChart({ colors, colorMap, yAxisFields, data, containe
     return (_jsx("div", { style: {
             boxSizing: 'content-box',
             ...containerStyle,
-        }, className: className, children: _jsx(ResponsiveContainer, { width: "100%", height: "100%", children: _jsxs(ReChartsBarChart, { data: data ?? [], layout: 'horizontal', onClick: (event) => onClickChartElement
+        }, className: className, children: _jsx(ResponsiveContainer, { width: "100%", height: "100%", minWidth: 0, minHeight: 0, children: _jsxs(ReChartsBarChart, { data: data ?? [], layout: 'horizontal', onClick: (event) => onClickChartElement
                     ? onClickChartElement(event?.activePayload
                         ? event.activePayload[0].payload
                         : undefined)

package/dist/esm/components/Chart/GaugeChart.js

@@ -102,7 +102,7 @@ function D3Gauge({ percentage, containerStyle, xAxisFormat, colors, isAnimationA
         const gaugeHeight = Math.min(ch, cw / 1.2);
         const gaugeWidth = gaugeHeight * 1.2;
         const radius = gaugeHeight / 2;
-        const innerRadius = radius * 0.65;
+        const innerRadius = radius * 0.6;
         // const arcWidth = radius - innerRadius;
         // Vertical offset to visually center the 270° arc.
         const verticalOffset = gaugeHeight * 0.05;

package/dist/esm/components/Chart/LineChart.js

@@ -72,7 +72,7 @@ export default function LineChart({ colors, colorMap = {}, yAxisFields, data, co
             return sum + 1;
         return sum;
     }, 0);
-    return (_jsx("div", { style: { ...containerStyle }, className: className, children: _jsx(ResponsiveContainer, { width: "100%", height: '100%', children: _jsxs(ComposedChart, { data: formattedData, onClick: (event) => onClickChartElement(event?.activePayload ? event.activePayload[0].payload : undefined), children: [!hideCartesianGrid && (_jsx(CartesianGrid, { horizontal: !hideHorizontalCartesianGrid, vertical: !hideVerticalCartesianGrid, stroke: cartesianGridLineColor ?? '#e5e7eb', strokeDasharray: cartesianGridLineStyle === 'dashed' ? '5 5' : undefined })), _jsx(XAxis, { dataKey: xAxisField, hide: hideXAxis, tick: { transform: 'translate(0, 6)' }, style: {
+    return (_jsx("div", { style: { ...containerStyle }, className: className, children: _jsx(ResponsiveContainer, { width: "100%", height: '100%', minWidth: 0, minHeight: 0, children: _jsxs(ComposedChart, { data: formattedData, onClick: (event) => onClickChartElement(event?.activePayload ? event.activePayload[0].payload : undefined), children: [!hideCartesianGrid && (_jsx(CartesianGrid, { horizontal: !hideHorizontalCartesianGrid, vertical: !hideVerticalCartesianGrid, stroke: cartesianGridLineColor ?? '#e5e7eb', strokeDasharray: cartesianGridLineStyle === 'dashed' ? '5 5' : undefined })), _jsx(XAxis, { dataKey: xAxisField, hide: hideXAxis, tick: { transform: 'translate(0, 6)' }, style: {
                             fontSize: '12px',
                             fontFamily: theme?.chartLabelFontFamily ||
                                 theme?.fontFamily ||

package/dist/esm/components/Chart/MapChart.js

@@ -366,7 +366,7 @@ export function USMap({ theme, data, xAxisField, xAxisFormat, yAxisFields, onCli
     return (_jsxs("div", { ref: containerRef, className: className, style: {
             width: "100%",
             height: "auto",
-            marginTop: '-5%',
+            marginTop: '-6.5%',
             zIndex: 0,
             ...containerStyle,
             position: "relative",

package/dist/esm/components/Chart/PieChart.js

@@ -191,7 +191,7 @@ const PieChartWrapper = React.forwardRef((props, ref) => {
             justifyContent: 'center',
             boxSizing: 'content-box',
             ...containerStyle,
-        }, ...other, children: _jsx(ResponsiveContainer, { width: "100%", height: "100%", children: _jsxs(PieChart, { children: [_jsx(Pie, { data: parseData(data, (colorMap[category] &&
+        }, ...other, children: _jsx(ResponsiveContainer, { width: "100%", height: "100%", minWidth: 0, minHeight: 0, children: _jsxs(PieChart, { children: [_jsx(Pie, { data: parseData(data, (colorMap[category] &&
                             colorMap[category]['primary'] &&
                             generateArrayFromColor(colorMap[category]['primary'], data.length)) ??
                             (colors.length >= data.length