@quillsql/react 2.12.51 → 2.12.53

package/dist/cjs/ReportBuilder.js

@@ -73,11 +73,12 @@ exports.QUILL_SERVER = (typeof process !== 'undefined' && process?.env?.QUILL_SE
  * ### Report Builder API
  * @see https://docs.quillsql.com/components/report-builder
  */
-function ReportBuilder({ initialTableName = '', onSubmitEditReport = () => void null, onSubmitCreateReport = () => void null, onDiscardChanges = undefined, onSaveChanges = undefined, destinationDashboard = undefined, organizationName = '', ButtonComponent = UiComponents_1.MemoizedButton, SecondaryButtonComponent = UiComponents_1.MemoizedSecondaryButton, DeleteButtonComponent = UiComponents_1.MemoizedDeleteButton, ModalComponent = UiComponents_1.MemoizedModal, TextInputComponent = UiComponents_2.QuillTextInput, SelectComponent = QuillSelect_1.QuillSelectComponent, MultiSelectComponent = QuillMultiSelectWithCombo_1.QuillMultiSelectComponentWithCombo, TableComponent = UiComponents_1.QuillTableSQLEditorComponent, PopoverComponent = UiComponents_1.MemoizedPopover, TabsComponent = UiComponents_1.QuillTabs, 
+function ReportBuilder({ initialTableName = '', onSubmitEditReport = () => void null, onSubmitCreateReport = () => void null, onDiscardChanges = undefined, onSaveChanges = undefined, onCloseChartBuilder = undefined, destinationDashboard = undefined, organizationName = '', ButtonComponent = UiComponents_1.MemoizedButton, SecondaryButtonComponent = UiComponents_1.MemoizedSecondaryButton, DeleteButtonComponent = UiComponents_1.MemoizedDeleteButton, ModalComponent = UiComponents_1.MemoizedModal, TextInputComponent = UiComponents_2.QuillTextInput, SelectComponent = QuillSelect_1.QuillSelectComponent, MultiSelectComponent = QuillMultiSelectWithCombo_1.QuillMultiSelectComponentWithCombo, TableComponent = UiComponents_1.QuillTableSQLEditorComponent, PopoverComponent = UiComponents_1.MemoizedPopover, TabsComponent = UiComponents_1.QuillTabs, 
 // CheckboxComponent = MemoizedCheckbox,
 SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer, SelectColumnComponent = ui_1.QuillSelectColumn, DraggableColumnComponent = ui_1.QuillDraggableColumn, SidebarHeadingComponent = ui_1.QuillSidebarHeading, FilterPopoverComponent = ui_1.QuillFilterPopover, SortPopoverComponent = ui_1.QuillSortPopover, LimitPopoverComponent = ui_1.QuillLimitPopover, CardComponent = QuillCard_1.QuillCard, LabelComponent = UiComponents_1.MemoizedLabel, HeaderComponent = UiComponents_1.MemoizedHeader, SubHeaderComponent = UiComponents_1.MemoizedSubHeader, TextComponent = UiComponents_1.MemoizedText, ErrorMessageComponent = UiComponents_1.QuillErrorMessageComponent, ChartBuilderInputRowContainer = UiComponents_1.QuillChartBuilderInputRowContainer, ChartBuilderInputColumnContainer = UiComponents_1.QuillChartBuilderInputColumnContainer, PivotRowContainer = UiComponents_1.QuillPivotRowContainer, PivotColumnContainer = UiComponents_1.QuillPivotColumnContainer, LoadingComponent = UiComponents_1.QuillLoadingComponent, ColumnSearchEmptyState = UiComponents_1.QuillColumnSearchEmptyState, ChartBuilderFormContainer = UiComponents_1.QuillChartBuilderFormContainer, ChartBuilderModalComponent = UiComponents_1.MemoizedModal, isAdminEnabled = false, isAIEnabled = true, showChartBuilderTableFormatOptions = true, containerStyle, className, pivotRecommendationsEnabled = true, reportId, hideCopySQL = true, isChartBuilderHorizontalView = true, onClickChartElement, }) {
     const [dashboard] = (0, react_1.useContext)(Context_1.DashboardContext);
     const [schemaData] = (0, react_1.useContext)(Context_1.SchemaDataContext);
+    const { dashboardFilters } = (0, react_1.useContext)(Context_1.DashboardFiltersContext);
     const [reportInfo, setReportInfo] = (0, react_1.useState)(null);
     const [aiPrompt, setAiPrompt] = (0, react_1.useState)('');
     const [errorMessage, setErrorMessage] = (0, react_1.useState)('');
@@ -92,7 +93,7 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
     const [openPopover, setOpenPopover] = (0, react_1.useState)(null);
     const [loading, setLoading] = (0, react_1.useState)(!!initialTableName);
     const [isChartBuilderOpen, setIsChartBuilderOpen] = (0, react_1.useState)(false);
-    const [, setIsPending] = (0, react_1.useState)(false);
+    const [isAddLoading, setIsAddLoading] = (0, react_1.useState)(false);
     const [isCopying, setIsCopying] = (0, react_1.useState)(false);
     const [dataDisplayed, setDataDisplayed] = (0, react_1.useState)(false);
     const [rows, setRows] = (0, react_1.useState)([]);
@@ -100,6 +101,7 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
     const [columns, setColumns] = (0, react_1.useState)([]);
     const [tempReport, setTempReport] = (0, react_1.useState)(report_1.EMPTY_INTERNAL_REPORT);
     const [uniqueValues, setUniqueValues] = (0, react_1.useState)({});
+    const [uniqueValuesIsLoading, setUniqueValuesIsLoading] = (0, react_1.useState)(false);
     const [pivot, setPivot] = (0, react_1.useState)(null);
     const [pivotData, setPivotData] = (0, react_1.useState)(null);
     const [createdPivots, setCreatedPivots] = (0, react_1.useState)([]);
@@ -124,18 +126,23 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
     const [pivotAggregation, setPivotAggregation] = (0, react_1.useState)(undefined);
     const [dateRanges, setDateRanges] = (0, react_1.useState)(null);
     const [client] = (0, react_1.useContext)(Context_1.ClientContext);
-    // JANK: This is temp and stupid
-    const [overrideRecommendations, setOverrideRecommendations] = (0, react_1.useState)(true);
     const [fieldValuesMap, setFieldValuesMap] = (0, react_1.useState)({}); // Mapping of unique values per field, used in string filter 'in' and 'not in'
     const [globalUniqueValues, setGlobalUniqueValues] = (0, react_1.useState)({});
+    const [globalUniqueValuesIsLoading, setGlobalUniqueValuesIsLoading] = (0, react_1.useState)(false);
     const { filterTree, filterStack } = (0, useAstToFilterTree_1.default)(formData, client); // Stores the state of filters
     const [removingFilter, setRemovingFilter] = (0, react_1.useState)(false);
+    const [pivotRecommendationsEnabledState, setPivotRecommendationsEnabledState,] = (0, react_1.useState)(pivotRecommendationsEnabled);
+    const REPORT_BUILDER_PAGINATION = {
+        page: 0,
+        rowsPerPage: 20,
+        rowsPerRequest: 40,
+    };
     (0, react_1.useEffect)(() => {
         if (!client) {
             return;
         }
-        if (client.publicKey === '663416663aa9bc716e59a89d') {
-            setOverrideRecommendations(false);
+        if (client.recommendedPivotsDisabled !== undefined) {
+            setPivotRecommendationsEnabledState(!client.recommendedPivotsDisabled);
         }
         if (!initialLoad && client.publicKey) {
             clearAllState();
@@ -145,13 +152,18 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
         (0, width_1.updateFirstChildWidth)(askAIContainerRef, setAskAIInputWidth, { gap: 12 });
         (0, width_1.updateFirstChildWidth)(askAILoadingContainerRef, setAskAILoadingContainerWidth, { gap: 12 });
     }, [dataDisplayed]);
+    (0, react_1.useEffect)(() => {
+        if (isChartBuilderOpen === false) {
+            onCloseChartBuilder && onCloseChartBuilder();
+        }
+    }, [isChartBuilderOpen]);
     // Whenever unique values changes, update the fieldValuesMap, used in FilterModals
-    const updateFieldValuesMap = (curUnqiueValues, tableName) => {
+    const updateFieldValuesMap = (curUniqueValues, tableName) => {
         const newFieldValues = {};
-        if (curUnqiueValues[tableName]) {
-            for (const field of Object.keys(curUnqiueValues[tableName])) {
+        if (curUniqueValues[tableName]) {
+            for (const field of Object.keys(curUniqueValues[tableName])) {
                 newFieldValues[field] = [];
-                for (const value of Object.keys(curUnqiueValues[tableName][field])) {
+                for (const value of Object.keys(curUniqueValues[tableName][field])) {
                     newFieldValues[field]?.push(value);
                 }
             }
@@ -172,7 +184,7 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
         };
     }, []);
     const updatePivot = async (changeField, fieldKey) => {
-        const newPivot = pivot;
+        const newPivot = (0, util_1.deepCopy)(pivot);
         setTableLoading(true);
         // @ts-ignore
         newPivot[fieldKey] = changeField;
@@ -197,19 +209,19 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
             dateBucket = (0, dates_1.getDateBucketFromRange)(tempDateRange.dateRange);
         }
         let distinctValuesForQuery = {};
-        if (pivot.columnField) {
+        setPivot(newPivot);
+        if (newPivot.columnField) {
             distinctValuesForQuery = await (0, tableProcessing_1.getUniqueValuesByColumns)([
                 {
-                    field: pivot.columnField,
-                    label: pivot.columnField,
+                    field: newPivot.columnField,
+                    label: newPivot.columnField,
                     format: 'string',
                 },
             ], activeQuery, [], client, schemaData.customFields ?? []);
         }
-        const pivotedData = await (0, PivotModal_1.generatePivotTable)(pivot, rows, undefined, false, -1, undefined, dateBucket, tempReport, client, distinctValuesForQuery);
+        const pivotedData = await (0, PivotModal_1.generatePivotTable)(newPivot, rows, undefined, false, -1, undefined, dateBucket, tempReport, client, distinctValuesForQuery);
         setPivotData(pivotedData || []);
         const formattedRows = formatRows(pivotedData.rows, columns, true, newPivot.aggregationType);
-        setPivot(newPivot);
         setFormattedRows(formattedRows);
         setTableLoading(false);
     };
@@ -241,7 +253,6 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
             setActivePath(null);
             setOpenPopover(null);
             setLoading(false);
-            setIsPending(false);
             setDataDisplayed(false);
             setRows([]);
             setColumns([]);
@@ -254,8 +265,10 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
         }, 0);
     };
     const fetchGlobalUniqueValues = async (columns, currentTable, client) => {
-        const global = await (0, tableProcessing_1.getUniqueStringValues)(columns, currentTable, client);
+        setGlobalUniqueValuesIsLoading(true);
+        const global = await (0, tableProcessing_1.getUniqueStringValues)(columns, currentTable, client, schemaData.customFields, undefined, true);
         setGlobalUniqueValues((0, filterProcessing_1.uniqueValuesToStringMap)(global));
+        setGlobalUniqueValuesIsLoading(false);
     };
     const uniqueValuesDependenciesRef = (0, react_1.useRef)({ client, columns, currentTable });
     const memoizedFetchGlobalUniqueValues = (0, react_1.useCallback)(fetchGlobalUniqueValues, []);
@@ -403,11 +416,13 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
         setLoading(true);
         const tableInfo = tables.find((tableInfo) => tableInfo.name === initialTableName);
         if (tableInfo) {
-            const newUniqueValues = await (0, tableProcessing_1.getUniqueStringValues)(tableInfo.columns, initialTableName, client, schemaData.customFields, uniqueValues);
+            setUniqueValuesIsLoading(true);
+            const newUniqueValues = await (0, tableProcessing_1.getUniqueStringValues)(tableInfo.columns, initialTableName, client, schemaData.customFields, uniqueValues, true);
             if ((0, crypto_1.hashCode)(uniqueValues) !== (0, crypto_1.hashCode)(newUniqueValues)) {
                 setUniqueValues(newUniqueValues);
                 updateFieldValuesMap(newUniqueValues, initialTableName);
             }
+            setUniqueValuesIsLoading(false);
             const dateRangesTemp = await getDateRanges(tableInfo.columns, initialTableName);
             setDateRanges(dateRangesTemp);
         }
@@ -688,13 +703,14 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
     };
     const [previousPage, setPreviousPage] = (0, react_1.useState)(0);
     const [currentProcessing, setCurrentProcessing] = (0, react_1.useState)({
-        page: paginationProcessing_1.DEFAULT_PAGINATION,
+        page: REPORT_BUILDER_PAGINATION,
     });
     const [numberOfRows, setNumberOfRows] = (0, react_1.useState)(0);
+    const [rowCountIsLoading, setRowCountIsLoading] = (0, react_1.useState)(false);
     const [tableLoading, setTableLoading] = (0, react_1.useState)(false);
     const onPageChange = (page) => {
         if (currentProcessing.page &&
-            (0, paginationProcessing_1.shouldFetchMore)(paginationProcessing_1.DEFAULT_PAGINATION, page, previousPage)) {
+            (0, paginationProcessing_1.shouldFetchMore)(REPORT_BUILDER_PAGINATION, page, previousPage)) {
             const newPagination = { ...currentProcessing.page, page };
             const updatedProcessing = { ...currentProcessing, page: newPagination };
             setCurrentProcessing(updatedProcessing);
@@ -705,28 +721,52 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
         }
     };
     const onSortChange = (sort) => {
-        if ((0, paginationProcessing_1.shouldSortInMemory)(paginationProcessing_1.DEFAULT_PAGINATION, numberOfRows, !!pivot)) {
+        if ((0, paginationProcessing_1.shouldSortInMemory)(REPORT_BUILDER_PAGINATION, numberOfRows, !!pivot)) {
             return;
         }
-        const updatedProcessing = { page: paginationProcessing_1.DEFAULT_PAGINATION, sort };
+        const updatedProcessing = { page: REPORT_BUILDER_PAGINATION, sort };
         handleRunQuery(updatedProcessing, true);
         setCurrentProcessing(updatedProcessing);
         setPreviousPage(0);
     };
-    const handleRunQuery = async (processing, resetRows = false) => {
+    const onFilterPreviewChange = (preview) => {
+        handleRunQuery(currentProcessing, true, preview);
+    };
+    const fetchRowCount = async (processing, includeFilters) => {
+        if (!client || !activeQuery) {
+            return;
+        }
+        setRowCountIsLoading(true);
+        const tableInfo = await (0, tableProcessing_1.fetchResultsByQuery)(activeQuery, client, processing, schemaData.customFields, includeFilters ? dashboardFilters : undefined, includeFilters
+            ? tempReport.dateField ?? reportInfo?.dateField
+            : undefined, false, true);
+        if (tableInfo.rowCount) {
+            setNumberOfRows(tableInfo.rowCount);
+        }
+        setRowCountIsLoading(false);
+    };
+    const fetchRowCountFromAST = async (ast, where) => {
+        setRowCountIsLoading(true);
+        const tableData = await (0, tableProcessing_1.fetchTableByAST)({ ...ast, where }, client, { page: REPORT_BUILDER_PAGINATION }, undefined, false, true);
+        if (tableData.rowCount) {
+            setNumberOfRows(tableData.rowCount);
+        }
+        setRowCountIsLoading(false);
+    };
+    const handleRunQuery = async (processing, resetRows = false, includeFilters = false) => {
         try {
             setErrorMessage('');
             setTableLoading(true);
-            const tableInfo = await (0, tableProcessing_1.fetchTableByQuery)(activeQuery, client, processing, schemaData.customFields);
+            const tableInfo = await (0, tableProcessing_1.fetchResultsByQuery)(activeQuery, client, processing, schemaData.customFields, includeFilters
+                ? dashboardFilters.filter((f) => f && destinationDashboard === f.dashboardName)
+                : undefined, includeFilters ? tempReport.dateField : undefined, true);
             if (tableInfo.error) {
                 throw new Error(tableInfo.error);
             }
             else if (tableInfo.rows.length === 0) {
                 throw new Error('No data found');
             }
-            if (tableInfo.rowCount) {
-                setNumberOfRows(tableInfo.rowCount);
-            }
+            fetchRowCount(processing, includeFilters);
             setCurrentProcessing(processing);
             let tempRows = [...rows, ...tableInfo.rows];
             if (resetRows) {
@@ -734,6 +774,11 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
             }
             setRows(tempRows);
             setFormattedRows((0, report_1.formatRowsFromReport)({ rows: tempRows, columns: tableInfo.columns }));
+            setTempReport({
+                ...tempReport,
+                rows: tempRows,
+                rowCount: tableInfo.rowCount ?? tempReport.rowCount,
+            });
             setColumns(tableInfo.columns);
             setTableLoading(false);
         }
@@ -745,7 +790,7 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
             return;
         }
     };
-    const renderFilters = () => {
+    const renderFilters = (actionsEnabled = true) => {
         // Render filterStack
         return ((0, jsx_runtime_1.jsx)("div", { style: {
                 display: 'flex',
@@ -789,7 +834,7 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                             } }) }, index));
                 }
                 else if (item.value) {
-                    return ((0, jsx_runtime_1.jsx)(ui_1.FilterPopoverWrapper, { schema: schemaData.schema.find((s) => s.name === currentTable || s.displayName === currentTable) ?? schemaData.schema[0], filter: item.value, filterLabel: item.value ? (0, filterProcessing_1.filterSentence)(item.value) : '', index: index, FilterTagComponent: FilterPopoverComponent, FilterModal: FilterModal_1.default, fieldValuesMap: globalUniqueValues, priorFilters: filterStack.slice(0, index > 0 ? index - 1 : 0), columns: columns, client: client, customFields: schemaData.customFields, baseAst: baseAst, endpoint: exports.QUILL_SERVER, ButtonComponent: ButtonComponent, SecondaryButtonComponent: SecondaryButtonComponent, SelectComponent: SelectComponent, TextInputComponent: TextInputComponent, MultiSelectComponent: MultiSelectComponent, handleFilterSave: (filter) => {
+                    return ((0, jsx_runtime_1.jsx)(ui_1.FilterPopoverWrapper, { schema: schemaData.schema.find((s) => s.name === currentTable || s.displayName === currentTable) ?? schemaData.schema[0], filter: item.value, filterLabel: item.value ? (0, filterProcessing_1.filterSentence)(item.value) : '', index: index, FilterTagComponent: FilterPopoverComponent, FilterModal: FilterModal_1.default, fieldValuesMap: globalUniqueValues, fieldValuesMapIsLoading: globalUniqueValuesIsLoading, priorFilters: filterStack.slice(0, index > 0 ? index - 1 : 0), columns: columns, client: client, customFields: schemaData.customFields, baseAst: baseAst, endpoint: exports.QUILL_SERVER, ButtonComponent: ButtonComponent, SecondaryButtonComponent: SecondaryButtonComponent, SelectComponent: SelectComponent, TextInputComponent: TextInputComponent, MultiSelectComponent: MultiSelectComponent, handleFilterSave: (filter) => {
                             item.value = filter;
                             let newFormData = null;
                             if (filterTree) {
@@ -853,7 +898,7 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                 fetchSqlQuery(newAst, newFormData);
                                 setRemovingFilter(false);
                             }
-                        } }, `filter_${index}_${item.value ? (0, filterProcessing_1.filterSentence)(item.value) : ''}`));
+                        }, disabled: !actionsEnabled }, `filter_${index}_${item.value ? (0, filterProcessing_1.filterSentence)(item.value) : ''}`));
                 }
             }) }));
     };
@@ -880,12 +925,18 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
         },
         as: null,
     });
+    const updateUniqueValue = (uniqueStrings, table) => {
+        const uniqueStringsObj = {};
+        uniqueStringsObj[table] = uniqueStrings ?? {};
+        setUniqueValues(uniqueStringsObj);
+        updateFieldValuesMap(uniqueStringsObj, table);
+    };
     const fetchReportFromASTHelper = async (baseAst, newFormData, curPivot, curSchema, previousReport) => {
         const curFormData = newFormData !== undefined ? newFormData : formData;
         let reportBuilderInfo = undefined;
         try {
             setLoading(true);
-            reportBuilderInfo = await (0, report_1.fetchReportBuilderDataFromAST)(baseAst, curFormData, curSchema ?? schemaData.schema, client, curPivot ?? pivot, formData, currentTable, { uniqueStrings: uniqueValues, dateRanges: dateRanges ?? {} }, previousReport ?? reportInfo ?? undefined, schemaData.customFields);
+            reportBuilderInfo = await (0, report_1.fetchReportBuilderDataFromAST)(baseAst, curFormData, curSchema ?? schemaData.schema, client, curPivot ?? pivot, formData, currentTable, { uniqueStrings: uniqueValues, dateRanges: dateRanges ?? {} }, previousReport ?? reportInfo ?? undefined, schemaData.customFields, true, true, { page: REPORT_BUILDER_PAGINATION });
             if (reportBuilderInfo.error) {
                 throw new Error(reportBuilderInfo.error);
             }
@@ -904,21 +955,22 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
             setErrorMessage('Failed to fetch');
             return;
         }
+        fetchRowCountFromAST(baseAst, curFormData);
         const reportTable = reportBuilderInfo.table;
         const reportBuilderInfoColumns = reportBuilderInfo.columns.map((column) => {
             return `${reportTable}.${column.field}`;
         });
+        const prevFormData = formData;
+        const prevTable = currentTable;
         setRows(reportBuilderInfo.rows);
         setColumns(reportBuilderInfo.columns);
-        setNumberOfRows(reportBuilderInfo.rowCount);
+        // setNumberOfRows(reportBuilderInfo.rowCount);
         setPivot(reportBuilderInfo.pivot);
         setPivotData(reportBuilderInfo.pivotData);
+        setDateRanges(reportBuilderInfo.dateRanges);
         setFormattedRows(reportBuilderInfo.formattedRows);
         setTempReport(reportBuilderInfo.report);
         setSelectedColumns(reportBuilderInfoColumns);
-        setUniqueValues(reportBuilderInfo.uniqueValues);
-        updateFieldValuesMap(reportBuilderInfo.uniqueValues, reportBuilderInfo.table);
-        setDateRanges(reportBuilderInfo.dateRanges);
         setLoading(false);
         setDataDisplayed(true);
         setCurrentTable(reportBuilderInfo.table);
@@ -930,6 +982,31 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
             setPivotValueField(reportBuilderInfo.pivot.valueField);
         }
         setReportInfo(reportBuilderInfo.report);
+        // fetch unique values after everything else since it is the most expensive
+        if (prevTable !== reportBuilderInfo.table ||
+            !(0, fast_deep_equal_1.default)(prevFormData, curFormData)) {
+            try {
+                setUniqueValuesIsLoading(true);
+                const schema = curSchema ?? schemaData.schema;
+                const tableInfo = schema.find((tableInfo) => tableInfo.name === reportBuilderInfo?.table);
+                if (!reportBuilderInfo.table || !tableInfo) {
+                    throw new Error('No table found;');
+                }
+                const uniqueStrings = await (0, tableProcessing_1.getUniqueStringValues)(tableInfo.columns, reportBuilderInfo.table, client, schemaData.customFields, undefined, true, reportBuilderInfo.query);
+                updateUniqueValue(uniqueStrings, reportBuilderInfo.table);
+                setUniqueValuesIsLoading(false);
+            }
+            catch (err) {
+                if (err instanceof Error) {
+                    setErrorMessage(err.message);
+                    setLoading(false);
+                    return { error: true, message: err.message, rows: [] };
+                }
+                setLoading(false);
+                setErrorMessage('Failed to fetch');
+                return { error: true, message: 'Failed to fetch', rows: [] };
+            }
+        }
     };
     const fetchAstFromPromptHelper = async (overridePrompt) => {
         let astInfo = {};
@@ -995,7 +1072,7 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
         };
         return ((0, jsx_runtime_1.jsx)("div", { style: { ...style }, ref: setNodeRef, children: (0, jsx_runtime_1.jsx)(DraggableColumnComponent, { label: (0, textProcessing_1.snakeAndCamelCaseToTitleCase)(label), onDelete: onDelete, DragHandle: (props) => ((0, jsx_runtime_1.jsx)("div", { style: {
                         cursor: 'grab',
-                    }, ...attributes, ...listeners, children: (0, jsx_runtime_1.jsx)(props.dragIcon, {}) })) }) }));
+                    }, ...attributes, ...listeners, children: (0, jsx_runtime_1.jsx)(props.dragIcon, {}) })), deleteDisabled: loading }) }));
     };
     function DraggableColumns() {
         const sensors = (0, core_1.useSensors)((0, core_1.useSensor)(core_1.PointerSensor), (0, core_1.useSensor)(core_1.KeyboardSensor, {
@@ -1070,7 +1147,7 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                         display: 'flex',
                         flexDirection: 'column',
                         gap: 8,
-                    }, children: [columnNamesInAst.map((name) => ((0, jsx_runtime_1.jsx)(DraggableItem, { id: name, label: name, onDelete: () => handleDeleteColumn(name) }, name))), columnNamesInAst?.length > 0 && (0, jsx_runtime_1.jsx)("div", { style: { height: 6 } })] }) }) }));
+                    }, children: [columnNamesInAst.map((name) => ((0, jsx_runtime_1.jsx)(DraggableItem, { id: name, label: name, onDelete: () => !loading && handleDeleteColumn(name) }, name))), columnNamesInAst?.length > 0 && (0, jsx_runtime_1.jsx)("div", { style: { height: 6 } })] }) }) }));
     }
     // TODO: Refactor this part
     if (loading || initialChartLoad) {
@@ -1083,11 +1160,10 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                         if (!openPopover) {
                                             setOpenPopover('AddColumnModal');
                                         }
-                                    }, label: 'Select columns' }), (0, jsx_runtime_1.jsx)(ModalComponent, { isOpen: openPopover === 'AddColumnModal', setIsOpen: (isOpen) => {
+                                    }, label: 'Select columns', disabled: true }), (0, jsx_runtime_1.jsx)(ModalComponent, { isOpen: openPopover === 'AddColumnModal', setIsOpen: (isOpen) => {
                                         if (!isOpen) {
                                             // delay onClose callback so onClick no-ops
                                             setTimeout(() => {
-                                                setIsPending(false);
                                                 setActiveEditItem(null);
                                                 setActivePath(null);
                                                 setOpenPopover(null);
@@ -1105,7 +1181,7 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                         flexDirection: 'column',
                                         gap: 8,
                                         marginBottom: 12,
-                                    }, children: renderFilters() })), (0, jsx_runtime_1.jsxs)("div", { style: {
+                                    }, children: renderFilters(false) })), (0, jsx_runtime_1.jsxs)("div", { style: {
                                         display: 'flex',
                                         flexDirection: 'column',
                                         alignItems: 'flex-start',
@@ -1131,14 +1207,12 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                                     }
                                                     setOpenPopover('AddFilterPopover');
                                                     setActivePath('');
-                                                    setIsPending(true);
                                                 }
-                                            }, label: 'Add filter' }), (0, jsx_runtime_1.jsx)("div", { style: {
+                                            }, label: 'Add filter', disabled: true }), (0, jsx_runtime_1.jsx)("div", { style: {
                                                 position: 'relative',
                                                 ...(openPopover === 'AddFilterPopover' && { top: 12 }),
                                             }, children: (0, jsx_runtime_1.jsx)(PopoverComponent, { isOpen: openPopover === 'AddFilterPopover', setIsOpen: (isOpen) => {
                                                     if (!isOpen) {
-                                                        setIsPending(false);
                                                         setActivePath(null);
                                                         setOpenPopover(null);
                                                         setTimeout(() => {
@@ -1149,9 +1223,8 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                                 }, popoverTitle: 'Add filter', popoverChildren: (0, jsx_runtime_1.jsx)(FilterModal_1.default, { schema: schemaData.schema.find((s) => s.name === currentTable ||
                                                         s.displayName === currentTable) ?? schemaData.schema[0], fieldValuesMap: uniqueValues[(0, ast_1.getTableNames)(baseAst).length === 1
                                                         ? (0, ast_1.getTableNames)(baseAst)[0]
-                                                        : initialTableName], onSubmitFilter: (filter) => {
+                                                        : initialTableName], fieldValuesMapIsLoading: uniqueValuesIsLoading, onSubmitFilter: (filter) => {
                                                         setOpenPopover(null);
-                                                        setIsPending(false);
                                                         const item = (0, astFilterProcessing_1.filterToAst)(filter, client.databaseType.toLowerCase());
                                                         handleInsertion(item, 'AND', false);
                                                     }, onDeleteFilter: () => { }, ButtonComponent: ButtonComponent, SelectComponent: SelectComponent, TextInputComponent: TextInputComponent, SecondaryButtonComponent: SecondaryButtonComponent, MultiSelectComponent: MultiSelectComponent }) }) })] })] }), (0, jsx_runtime_1.jsxs)("div", { style: { width: '100%' }, children: [(0, jsx_runtime_1.jsx)(SidebarHeadingComponent, { label: "Pivot" }), (0, jsx_runtime_1.jsx)(PivotModal_1.PivotModal, { pivotRowField: pivotRowField, setPivotRowField: setPivotRowField, pivotColumnField: pivotColumnField, setPivotColumnField: setPivotColumnField, pivotValueField: pivotValueField, setPivotValueField: setPivotValueField, pivotAggregation: pivotAggregation, setPivotAggregation: setPivotAggregation, createdPivots: createdPivots, setCreatedPivots: setCreatedPivots, recommendedPivots: recommendedPivots, setRecommendedPivots: setRecommendedPivots, popUpTitle: pivotPopUpTitle, setPopUpTitle: setPivotPopUpTitle, selectedTable: initialTableName, CardComponent: CardComponent, SelectComponent: SelectComponent, ButtonComponent: ButtonComponent, PopoverComponent: PopoverComponent, TextComponent: TextComponent, ErrorMessageComponent: ErrorMessageComponent, PivotRowContainer: PivotRowContainer, PivotColumnContainer: PivotColumnContainer, LoadingComponent: LoadingComponent, isOpen: showPivotPopover, setIsOpen: setShowPivotPopover, showUpdatePivot: isEditingPivot, setShowUpdatePivot: setIsEditingPivot, parentRef: parentRef, data: rows, columns: columns, triggerButtonText: 'Add pivot', selectedPivotIndex: selectedPivotIndex, setSelectedPivotIndex: setSelectedPivotIndex, removePivot: () => {
@@ -1163,14 +1236,14 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                     // TODOs
                                     selectPivot: () => {
                                         return;
-                                    }, selectPivotOnEdit: true, showTrigger: !pivot, theme: theme, LabelComponent: LabelComponent, HeaderComponent: HeaderComponent, dateRange: undefined, pivotCountRequest: 4, SecondaryButtonComponent: SecondaryButtonComponent, query: activeQuery, initialUniqueValues: uniqueValues[currentTable], disabled: !loading && (!baseAst || !dataDisplayed), pivotRecommendationsEnabled: pivotRecommendationsEnabled && overrideRecommendations, report: tempReport ?? reportInfo }), pivot && ((0, jsx_runtime_1.jsx)(PivotForm_1.default, { columns: columns, uniqueValues: uniqueValues[currentTable], setPivotRowField: (value) => {
+                                    }, selectPivotOnEdit: true, showTrigger: !pivot, theme: theme, LabelComponent: LabelComponent, HeaderComponent: HeaderComponent, dateRange: undefined, pivotCountRequest: 4, SecondaryButtonComponent: SecondaryButtonComponent, query: activeQuery, initialUniqueValues: uniqueValues[currentTable], disabled: true, pivotRecommendationsEnabled: pivotRecommendationsEnabledState, report: tempReport ?? reportInfo }), pivot && ((0, jsx_runtime_1.jsx)(PivotForm_1.default, { columns: columns, uniqueValues: uniqueValues[currentTable], uniqueValuesIsLoading: uniqueValuesIsLoading, setPivotRowField: (value) => {
                                         setPivotRowField(value);
                                     }, setPivotColumnField: setPivotColumnField, setPivotValueField: setPivotValueField, setPivotAggregation: setPivotAggregation, pivotRowField: pivotRowField, pivotColumnField: pivotColumnField, pivotValueField: pivotValueField, pivotAggregation: pivotAggregation, onDelete: () => {
                                         setPivot(null);
                                         setPivotData([]);
                                         const formattedRows = formatRows(rows, columns, false);
                                         setFormattedRows(formattedRows);
-                                    }, SecondaryButtonComponent: SecondaryButtonComponent, SelectComponent: SelectComponent, PivotColumnContainer: PivotColumnContainer }))] }), (0, jsx_runtime_1.jsxs)("div", { style: { width: '100%' }, children: [(0, jsx_runtime_1.jsx)(SidebarHeadingComponent, { label: "Sort" }), pivot && pivot.sort && ((0, jsx_runtime_1.jsx)("div", { style: {
+                                    }, isLoading: tableLoading, SecondaryButtonComponent: SecondaryButtonComponent, SelectComponent: SelectComponent, PivotColumnContainer: PivotColumnContainer }))] }), (0, jsx_runtime_1.jsxs)("div", { style: { width: '100%' }, children: [(0, jsx_runtime_1.jsx)(SidebarHeadingComponent, { label: "Sort" }), pivot && pivot.sort && ((0, jsx_runtime_1.jsx)("div", { style: {
                                         display: 'flex',
                                         flexDirection: 'column',
                                         gap: 8,
@@ -1178,7 +1251,7 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                     }, children: (0, jsx_runtime_1.jsx)(AddSortPopover_1.SortSentence, { sortData: {
                                             type: pivot.sortDirection,
                                             expr: { type: 'column_ref', column: pivot.sortField },
-                                        }, columns: selectedColumns, setIsPending: setIsPending, setEditPopoverKey: () => { }, setActiveEditItem: setActiveEditItem, setActivePath: setActivePath, setOpenPopover: setOpenPopover, SortPopover: SortPopoverComponent, EditPopover: AddSortPopover_1.AddSortPopover, handleDelete: () => {
+                                        }, columns: selectedColumns, setIsPending: () => { }, setEditPopoverKey: () => { }, setActiveEditItem: setActiveEditItem, setActivePath: setActivePath, setOpenPopover: setOpenPopover, SortPopover: SortPopoverComponent, EditPopover: AddSortPopover_1.AddSortPopover, handleDelete: () => {
                                             setPivot({ ...pivot, sort: false });
                                             setBaseAst((0, util_1.deepCopy)(baseAst));
                                             if (!pivot) {
@@ -1206,7 +1279,6 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                         gap: 8,
                                         marginBottom: 12,
                                     }, children: baseAst.orderby.map((sortData, id) => ((0, jsx_runtime_1.jsx)(AddSortPopover_1.SortSentence, { sortData: sortData, columns: selectedColumns, onSave: (column, direction) => {
-                                            setIsPending(false);
                                             setActiveEditItem(null);
                                             setOpenPopover(null);
                                             if (column === '')
@@ -1227,14 +1299,14 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                             if (!pivot) {
                                                 fetchSqlQuery(newAst);
                                             }
-                                        }, setIsPending: setIsPending, setEditPopoverKey: () => { }, setActiveEditItem: setActiveEditItem, setActivePath: setActivePath, setOpenPopover: setOpenPopover, SortPopover: SortPopoverComponent, EditPopover: AddSortPopover_1.AddSortPopover, handleDelete: () => {
+                                        }, setIsPending: () => { }, setEditPopoverKey: () => { }, setActiveEditItem: setActiveEditItem, setActivePath: setActivePath, setOpenPopover: setOpenPopover, SortPopover: SortPopoverComponent, EditPopover: AddSortPopover_1.AddSortPopover, handleDelete: () => {
                                             const newAst = { ...baseAst };
                                             newAst.orderby.splice(id, 1);
                                             setBaseAst((0, util_1.deepCopy)(newAst));
                                             if (!pivot) {
                                                 fetchSqlQuery(newAst);
                                             }
-                                        }, Select: SelectComponent, Button: ButtonComponent, SecondaryButton: SecondaryButtonComponent }, `sort-sentence-${id}`))) })), (0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: () => {
+                                        }, Select: SelectComponent, Button: ButtonComponent, SecondaryButton: SecondaryButtonComponent, disabled: true }, `sort-sentence-${id}`))) })), (0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: () => {
                                         if (!selectedColumns ||
                                             selectedColumns.length === 0 ||
                                             loading) {
@@ -1243,9 +1315,8 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                         if (!openPopover) {
                                             setOpenPopover('AddSortPopover');
                                         }
-                                    }, label: "Add sort" }), (0, jsx_runtime_1.jsx)(PopoverComponent, { isOpen: openPopover === 'AddSortPopover', setIsOpen: (isOpen) => {
+                                    }, label: "Add sort", disabled: true }), (0, jsx_runtime_1.jsx)(PopoverComponent, { isOpen: openPopover === 'AddSortPopover', setIsOpen: (isOpen) => {
                                         if (!isOpen) {
-                                            setIsPending(false);
                                             setActiveEditItem(null);
                                             setActivePath(null);
                                             setOpenPopover(null);
@@ -1274,7 +1345,7 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                             setOpenPopover(null);
                                             setBaseAst((0, util_1.deepCopy)(newAst));
                                             fetchSqlQuery(newAst);
-                                        }, TextInput: TextInputComponent, Button: ButtonComponent, SecondaryButton: SecondaryButtonComponent }) })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: () => {
+                                        }, TextInput: TextInputComponent, Button: ButtonComponent, SecondaryButton: SecondaryButtonComponent, disabled: true }) })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: () => {
                                                 if (!selectedColumns ||
                                                     selectedColumns.length === 0 ||
                                                     loading) {
@@ -1283,9 +1354,8 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                                 if (!openPopover) {
                                                     setOpenPopover('AddLimitPopover');
                                                 }
-                                            }, label: 'Add limit' }), (0, jsx_runtime_1.jsx)(PopoverComponent, { isOpen: openPopover === 'AddLimitPopover', setIsOpen: (isOpen) => {
+                                            }, label: 'Add limit', disabled: true }), (0, jsx_runtime_1.jsx)(PopoverComponent, { isOpen: openPopover === 'AddLimitPopover', setIsOpen: (isOpen) => {
                                                 if (!isOpen) {
-                                                    setIsPending(false);
                                                     setActiveEditItem(null);
                                                     setActivePath(null);
                                                     setOpenPopover(null);
@@ -1332,7 +1402,6 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                             if (!isOpen) {
                                                 // delay onClose callback so onClick no-ops
                                                 setTimeout(() => {
-                                                    setIsPending(false);
                                                     setActiveEditItem(null);
                                                     setActivePath(null);
                                                     setOpenPopover(null);
@@ -1376,7 +1445,6 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                                         }
                                                         setOpenPopover('AddFilterPopover');
                                                         setActivePath('');
-                                                        setIsPending(true);
                                                     }
                                                 }, label: 'Add filter' }), (0, jsx_runtime_1.jsx)("div", { style: {
                                                     position: 'relative',
@@ -1386,16 +1454,14 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                                             // delay onClose callback so onClick no-ops
                                                             setOpenPopover(null);
                                                             setTimeout(() => {
-                                                                setIsPending(false);
                                                                 setActivePath(null);
                                                                 clearCheckboxes();
                                                                 setActiveEditItem(null);
                                                             }, 300);
                                                         }
                                                     }, popoverTitle: "Add filter", popoverChildren: (0, jsx_runtime_1.jsx)(FilterModal_1.default, { schema: schemaData.schema.find((s) => s.name === currentTable ||
-                                                            s.displayName === currentTable) ?? schemaData.schema[0], fieldValuesMap: fieldValuesMap, onSubmitFilter: (filter) => {
+                                                            s.displayName === currentTable) ?? schemaData.schema[0], fieldValuesMap: fieldValuesMap, fieldValuesMapIsLoading: uniqueValuesIsLoading, onSubmitFilter: (filter) => {
                                                             setOpenPopover(null);
-                                                            setIsPending(false);
                                                             const item = (0, astFilterProcessing_1.filterToAst)(filter, client.databaseType.toLowerCase());
                                                             handleInsertion(item, 'AND', false);
                                                         }, onDeleteFilter: () => { }, ButtonComponent: ButtonComponent, SelectComponent: SelectComponent, TextInputComponent: TextInputComponent, MultiSelectComponent: MultiSelectComponent }) }) })] })] }), (0, jsx_runtime_1.jsxs)("div", { style: { width: '100%' }, children: [(0, jsx_runtime_1.jsx)(SidebarHeadingComponent, { label: "Pivot" }), (0, jsx_runtime_1.jsx)(PivotModal_1.PivotModal, { pivotRowField: pivotRowField, setPivotRowField: setPivotRowField, pivotColumnField: pivotColumnField, setPivotColumnField: setPivotColumnField, pivotValueField: pivotValueField, setPivotValueField: setPivotValueField, pivotAggregation: pivotAggregation, setPivotAggregation: setPivotAggregation, createdPivots: createdPivots, setCreatedPivots: setCreatedPivots, recommendedPivots: recommendedPivots, setRecommendedPivots: setRecommendedPivots, popUpTitle: pivotPopUpTitle, setPopUpTitle: setPivotPopUpTitle, selectedTable: initialTableName, SelectComponent: SelectComponent, ButtonComponent: ButtonComponent, CardComponent: CardComponent, SecondaryButtonComponent: SecondaryButtonComponent, PopoverComponent: PopoverComponent, TextComponent: TextComponent, ErrorMessageComponent: ErrorMessageComponent, PivotRowContainer: PivotRowContainer, PivotColumnContainer: PivotColumnContainer, LoadingComponent: LoadingComponent, isOpen: showPivotPopover, setIsOpen: setShowPivotPopover, showUpdatePivot: isEditingPivot, setShowUpdatePivot: setIsEditingPivot, parentRef: parentRef, data: rows, columns: columns, triggerButtonText: 'Add pivot', selectedPivotIndex: selectedPivotIndex, setSelectedPivotIndex: setSelectedPivotIndex, removePivot: () => {
@@ -1403,29 +1469,32 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                             setPivotData(null);
                                             const formattedRows = formatRows(rows, columns, false);
                                             setFormattedRows(formattedRows);
-                                        }, selectPivot: async (pivot, uniqueValues, dateRange, pivotTable) => {
-                                            if (!pivot)
+                                        }, selectPivot: async (selectedPivot, uniqueValues, dateRange, pivotTable) => {
+                                            if (!selectedPivot)
                                                 return;
                                             const newAst = { ...baseAst };
                                             newAst.orderby = null;
-                                            if (pivot.rowFieldType === 'date') {
-                                                pivot['sort'] = true;
-                                                pivot['sortDirection'] = 'ASC';
+                                            if (selectedPivot.rowFieldType === 'date') {
+                                                selectedPivot['sort'] = true;
+                                                selectedPivot['sortDirection'] = 'ASC';
                                             }
                                             setBaseAst(newAst); // trigger refetch
                                             let dateBucket = undefined;
                                             if (dateRange) {
                                                 dateBucket = (0, dates_1.getDateBucketFromRange)(dateRange);
                                             }
+                                            setPivot(selectedPivot);
                                             if (!pivotTable) {
-                                                pivotTable = await (0, PivotModal_1.generatePivotTable)(pivot, rows, undefined, false, -1, undefined, dateBucket, tempReport, client, uniqueValues);
+                                                setTableLoading(true);
+                                                pivotTable = await (0, PivotModal_1.generatePivotTable)(selectedPivot, rows, undefined, false, -1, undefined, dateBucket, tempReport, client, uniqueValues);
                                             }
+                                            // no other calls made
                                             setPivotData(pivotTable || []);
-                                            setPivot(pivot);
-                                            const formattedRows = formatRows(pivotTable.rows, columns, true, pivot.aggregationType);
+                                            const formattedRows = formatRows(pivotTable.rows, columns, true, selectedPivot.aggregationType);
                                             setFormattedRows(formattedRows);
                                             setErrorMessage('');
-                                        }, selectPivotOnEdit: true, showTrigger: !pivot, theme: theme, LabelComponent: LabelComponent, HeaderComponent: HeaderComponent, dateRange: undefined, pivotCountRequest: 4, query: activeQuery, initialUniqueValues: uniqueValues[currentTable], disabled: !baseAst || !dataDisplayed, pivotRecommendationsEnabled: pivotRecommendationsEnabled && overrideRecommendations, report: tempReport }), pivot && ((0, jsx_runtime_1.jsx)(PivotForm_1.default, { columns: columns, uniqueValues: uniqueValues[currentTable], setPivotRowField: (value) => {
+                                            setTableLoading(false); // only set to false if this was the final call
+                                        }, selectPivotOnEdit: true, showTrigger: !pivot, theme: theme, LabelComponent: LabelComponent, HeaderComponent: HeaderComponent, dateRange: undefined, pivotCountRequest: 4, query: activeQuery, initialUniqueValues: uniqueValues[currentTable], uniqueValuesIsLoading: uniqueValuesIsLoading, disabled: !baseAst || !dataDisplayed || tableLoading, pivotRecommendationsEnabled: pivotRecommendationsEnabledState, report: tempReport }), pivot && ((0, jsx_runtime_1.jsx)(PivotForm_1.default, { columns: columns, uniqueValues: uniqueValues[currentTable], uniqueValuesIsLoading: uniqueValuesIsLoading, setPivotRowField: (value) => {
                                             setPivotRowField(value);
                                             updatePivot(value, 'rowField');
                                         }, setPivotColumnField: (value) => {
@@ -1442,7 +1511,7 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                             setPivotData([]);
                                             const formattedRows = formatRows(rows, columns, false);
                                             setFormattedRows(formattedRows);
-                                        }, pivotRowField: pivotRowField, pivotColumnField: pivotColumnField, pivotValueField: pivotValueField, pivotAggregation: pivotAggregation, SecondaryButtonComponent: SecondaryButtonComponent, SelectComponent: SelectComponent, PivotColumnContainer: PivotColumnContainer }))] }), (0, jsx_runtime_1.jsxs)("div", { style: { width: '100%' }, children: [(0, jsx_runtime_1.jsx)(SidebarHeadingComponent, { label: "Sort" }), pivot && pivot.sort && ((0, jsx_runtime_1.jsx)("div", { style: {
+                                        }, isLoading: tableLoading, pivotRowField: pivotRowField, pivotColumnField: pivotColumnField, pivotValueField: pivotValueField, pivotAggregation: pivotAggregation, SecondaryButtonComponent: SecondaryButtonComponent, SelectComponent: SelectComponent, PivotColumnContainer: PivotColumnContainer }))] }), (0, jsx_runtime_1.jsxs)("div", { style: { width: '100%' }, children: [(0, jsx_runtime_1.jsx)(SidebarHeadingComponent, { label: "Sort" }), pivot && pivot.sort && ((0, jsx_runtime_1.jsx)("div", { style: {
                                             display: 'flex',
                                             flexDirection: 'column',
                                             gap: 8,
@@ -1457,7 +1526,7 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                                         `.${pivot.rowField}`,
                                                         `.${pivot.valueField || 'count'}`,
                                                     ]
-                                                : selectedColumns, setIsPending: setIsPending, setEditPopoverKey: () => { }, setActiveEditItem: setActiveEditItem, setActivePath: setActivePath, setOpenPopover: setOpenPopover, SortPopover: SortPopoverComponent, EditPopover: AddSortPopover_1.AddSortPopover, handleDelete: async () => {
+                                                : selectedColumns, setIsPending: () => { }, setEditPopoverKey: () => { }, setActiveEditItem: setActiveEditItem, setActivePath: setActivePath, setOpenPopover: setOpenPopover, SortPopover: SortPopoverComponent, EditPopover: AddSortPopover_1.AddSortPopover, handleDelete: async () => {
                                                 if (pivot) {
                                                     const tempPivot = { ...pivot, sort: false };
                                                     let dateBucket = undefined;
@@ -1512,7 +1581,7 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                             flexDirection: 'column',
                                             gap: 8,
                                             marginBottom: 12,
-                                        }, children: baseAst.orderby.map((sortData, id) => ((0, jsx_runtime_1.jsx)(AddSortPopover_1.SortSentence, { sortData: sortData, columns: selectedColumns, setIsPending: setIsPending, setEditPopoverKey: () => { }, setActiveEditItem: setActiveEditItem, setActivePath: setActivePath, setOpenPopover: setOpenPopover, SortPopover: SortPopoverComponent, EditPopover: AddSortPopover_1.AddSortPopover, handleDelete: () => {
+                                        }, children: baseAst.orderby.map((sortData, id) => ((0, jsx_runtime_1.jsx)(AddSortPopover_1.SortSentence, { sortData: sortData, columns: selectedColumns, setIsPending: () => { }, setEditPopoverKey: () => { }, setActiveEditItem: setActiveEditItem, setActivePath: setActivePath, setOpenPopover: setOpenPopover, SortPopover: SortPopoverComponent, EditPopover: AddSortPopover_1.AddSortPopover, handleDelete: () => {
                                                 if (pivot) {
                                                     setPivot({ ...pivot, sort: false });
                                                     return;
@@ -1535,7 +1604,6 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                                     });
                                                     return;
                                                 }
-                                                setIsPending(false);
                                                 setActiveEditItem(null);
                                                 setOpenPopover(null);
                                                 if (column === '')
@@ -1566,7 +1634,6 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                             ...(openPopover === 'AddSortPopover' && { top: 12 }),
                                         }, children: (0, jsx_runtime_1.jsx)(PopoverComponent, { isOpen: openPopover === 'AddSortPopover', setIsOpen: (isOpen) => {
                                                 if (!isOpen) {
-                                                    setIsPending(false);
                                                     setActiveEditItem(null);
                                                     setActivePath(null);
                                                     setOpenPopover(null);
@@ -1661,7 +1728,6 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                                     ...(openPopover === 'AddLimitPopover' && { top: 12 }),
                                                 }, children: (0, jsx_runtime_1.jsx)(PopoverComponent, { isOpen: openPopover === 'AddLimitPopover', setIsOpen: (isOpen) => {
                                                         if (!isOpen) {
-                                                            setIsPending(false);
                                                             setActiveEditItem(null);
                                                             setActivePath(null);
                                                             setOpenPopover(null);
@@ -1695,9 +1761,10 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                                 ? 'Ask a follow-up question...'
                                                 : 'Ask a question...' }), (0, jsx_runtime_1.jsx)(ButtonComponent, { onClick: () => {
                                                 fetchAstFromPromptHelper();
-                                            }, label: 'Ask AI' }), ((baseAst && dataDisplayed) || initialLoad) && !reportId && ((0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { label: 'New report', onClick: clearAllState }))] }) })), baseAst && ((0, jsx_runtime_1.jsx)(TableComponent, { isLoading: tableLoading ||
-                                    (loading && errorMessage.length === 0) ||
-                                    initialChartLoad, rows: formattedRows, rowCount: pivot ? undefined : numberOfRows, rowsPerPage: 20, columns: pivot
+                                            }, label: 'Ask AI' }), ((baseAst && dataDisplayed) || initialLoad) && !reportId && ((0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { label: 'New report', onClick: clearAllState }))] }) })), baseAst && ((0, jsx_runtime_1.jsx)(TableComponent, { isLoading: !isAddLoading &&
+                                    (tableLoading ||
+                                        (loading && errorMessage.length === 0) ||
+                                        initialChartLoad), rows: formattedRows, rowCount: pivot ? undefined : numberOfRows, rowCountIsLoading: rowCountIsLoading, rowsPerPage: 20, columns: pivot
                                     ? pivotData?.columns || emptyPivotColumns()
                                     : enforceOrderOnColumns(Object.keys(rows[0] ?? {})).map((c) => {
                                         return {
@@ -1721,13 +1788,17 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                                             alignItems: 'center',
                                         }, children: [(0, jsx_runtime_1.jsx)(ErrorMessageComponent, { errorMessage: errorMessage }), (0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: () => {
                                                     fetchAstFromPromptHelper();
-                                                }, label: 'Retry' })] })) : ((0, jsx_runtime_1.jsx)("div", { style: { width: '100%' } })), baseAst && dataDisplayed && !initialChartLoad && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [onDiscardChanges && ((0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: onDiscardChanges, label: "Discard changes" })), !hideCopySQL && ((0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { label: isCopying ? 'Copied' : 'Copy SQL', onClick: () => copySQLToClipboard() })), (0, jsx_runtime_1.jsx)(ButtonComponent, { onClick: () => {
+                                                }, label: 'Retry' })] })) : ((0, jsx_runtime_1.jsx)("div", { style: { width: '100%' } })), baseAst && dataDisplayed && !initialChartLoad && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [onDiscardChanges && ((0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: onDiscardChanges, label: "Discard changes" })), !hideCopySQL && ((0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { label: isCopying ? 'Copied' : 'Copy SQL', onClick: () => copySQLToClipboard() })), (0, jsx_runtime_1.jsx)(ButtonComponent, { onClick: async () => {
+                                                    setIsAddLoading(true);
+                                                    await handleRunQuery(currentProcessing, true);
+                                                    setIsAddLoading(false);
                                                     onSaveChanges && onSaveChanges();
                                                     setIsChartBuilderOpen(true);
-                                                }, disabled: !!errorMessage, label: reportId ? 'Save changes' : 'Add to dashboard' })] }))] })] }), (0, jsx_runtime_1.jsx)("style", { children: `body{margin:0;}` })] })), (!isChartBuilderHorizontalView || isChartBuilderOpen) && ((0, jsx_runtime_1.jsx)(ChartBuilder_1.ChartBuilderWithModal, { report: reportInfo
+                                                }, disabled: !!errorMessage, label: reportId ? 'Save changes' : 'Add to dashboard', isLoading: isAddLoading })] }))] })] }), (0, jsx_runtime_1.jsx)("style", { children: `body{margin:0;}` })] })), (!isChartBuilderHorizontalView || isChartBuilderOpen) && ((0, jsx_runtime_1.jsx)(ChartBuilder_1.ChartBuilderWithModal, { report: reportInfo
                     ? {
                         ...reportInfo,
                         ...tempReport,
+                        filtersApplied: dashboardFilters.filter((f) => f && destinationDashboard === f.dashboardName),
                         pivot: pivot,
                         yAxisFields: reportInfo.pivot && !pivot ? [] : reportInfo.yAxisFields,
                         columns: reportInfo.columns.filter((col) => {
@@ -1738,6 +1809,9 @@ SidebarComponent = ui_1.QuillSidebar, ContainerComponent = ui_1.CustomContainer,
                         queryString: activeQuery,
                         rows: rows,
                     }
-                    : tempReport, rows: rows, columns: columns, pivot: pivot, query: activeQuery, showTableFormatOptions: showChartBuilderTableFormatOptions, showDateFieldOptions: isAdminEnabled, showAccessControlOptions: isAdminEnabled, isAdmin: isAdminEnabled, title: reportId ? 'Save changes' : 'Add to dashboard', isHorizontalView: true, isOpen: isChartBuilderOpen, setIsOpen: setIsChartBuilderOpen, onAddToDashboardComplete: reportId ? onSubmitEditReport : onSubmitCreateReport, destinationDashboard: destinationDashboard, organizationName: organizationName, pivotData: pivotData, initialUniqueValues: uniqueValues[currentTable], pivotRecommendationsEnabled: pivotRecommendationsEnabled && overrideRecommendations, SelectComponent: SelectComponent, TextInputComponent: TextInputComponent, ButtonComponent: ButtonComponent, SecondaryButtonComponent: SecondaryButtonComponent, HeaderComponent: HeaderComponent, SubHeaderComponent: SubHeaderComponent, LabelComponent: LabelComponent, TextComponent: TextComponent, CardComponent: CardComponent, ModalComponent: ChartBuilderModalComponent, PopoverComponent: PopoverComponent, TableComponent: TableComponent, DeleteButtonComponent: DeleteButtonComponent, LoadingComponent: LoadingComponent, ChartBuilderInputRowContainer: ChartBuilderInputRowContainer, ChartBuilderInputColumnContainer: ChartBuilderInputColumnContainer, FormContainer: ChartBuilderFormContainer, hideDateRangeFilter: true, buttonLabel: !!reportId ? 'Save changes' : 'Add to dashboard', onClickChartElement: onClickChartElement, rowCount: numberOfRows, onPageChange: onPageChange, onSortChange: onSortChange, isLoading: tableLoading, isEditingMode: true }))] }));
+                    : {
+                        ...tempReport,
+                        filtersApplied: dashboardFilters.filter((f) => f && destinationDashboard === f.dashboardName),
+                    }, rows: rows, columns: columns, pivot: pivot, query: activeQuery, showTableFormatOptions: showChartBuilderTableFormatOptions, showDateFieldOptions: isAdminEnabled, showAccessControlOptions: isAdminEnabled, isAdmin: isAdminEnabled, title: reportId ? 'Save changes' : 'Add to dashboard', isHorizontalView: true, isOpen: isChartBuilderOpen, setIsOpen: setIsChartBuilderOpen, onAddToDashboardComplete: reportId ? onSubmitEditReport : onSubmitCreateReport, destinationDashboard: destinationDashboard, organizationName: organizationName, pivotData: pivotData, initialUniqueValues: uniqueValues[currentTable], initialUniqueValuesIsLoading: uniqueValuesIsLoading, pivotRecommendationsEnabled: pivotRecommendationsEnabledState, SelectComponent: SelectComponent, TextInputComponent: TextInputComponent, ButtonComponent: ButtonComponent, SecondaryButtonComponent: SecondaryButtonComponent, HeaderComponent: HeaderComponent, SubHeaderComponent: SubHeaderComponent, LabelComponent: LabelComponent, TextComponent: TextComponent, CardComponent: CardComponent, ModalComponent: ChartBuilderModalComponent, PopoverComponent: PopoverComponent, TableComponent: TableComponent, DeleteButtonComponent: DeleteButtonComponent, LoadingComponent: LoadingComponent, ChartBuilderInputRowContainer: ChartBuilderInputRowContainer, ChartBuilderInputColumnContainer: ChartBuilderInputColumnContainer, FormContainer: ChartBuilderFormContainer, hideDateRangeFilter: true, buttonLabel: !!reportId ? 'Save changes' : 'Add to dashboard', onClickChartElement: onClickChartElement, rowCount: numberOfRows, onPageChange: onPageChange, onSortChange: onSortChange, onFilterPreviewChange: onFilterPreviewChange, isLoading: tableLoading || isAddLoading, isEditingMode: true }))] }));
 }
 exports.default = ReportBuilder;