@quillsql/react 2.13.2 → 2.13.3

package/dist/esm/ReportBuilder.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useCallback, useContext, useEffect, useMemo, useRef, useState, } from 'react';
-import { DEFAULT_TAB_OPTIONS, MemoizedButton, MemoizedDeleteButton, MemoizedHeader, MemoizedLabel, MemoizedSecondaryButton, MemoizedText, MemoizedPopover, QuillTabs, MemoizedModal, QuillChartBuilderInputRowContainer, QuillChartBuilderInputColumnContainer, MemoizedSubHeader, QuillErrorMessageComponent, QuillPivotRowContainer, QuillPivotColumnContainer, QuillColumnSearchEmptyState, QuillChartBuilderFormContainer, QuillLoadingComponent, QuillTableSQLEditorComponent, } from './components/UiComponents';
+import { MemoizedButton, MemoizedDeleteButton, MemoizedHeader, MemoizedLabel, MemoizedSecondaryButton, MemoizedText, MemoizedPopover, QuillTabs, MemoizedModal, QuillChartBuilderInputRowContainer, QuillChartBuilderInputColumnContainer, MemoizedSubHeader, QuillErrorMessageComponent, QuillPivotRowContainer, QuillPivotColumnContainer, QuillColumnSearchEmptyState, QuillChartBuilderFormContainer, QuillLoadingComponent, QuillTableSQLEditorComponent, } from './components/UiComponents';
 import { DndContext, closestCenter, KeyboardSensor, PointerSensor, useSensor, useSensors, } from '@dnd-kit/core';
 import { arrayMove, SortableContext, sortableKeyboardCoordinates, verticalListSortingStrategy, useSortable, } from '@dnd-kit/sortable';
 import { CSS as DND_CSS } from '@dnd-kit/utilities';
@@ -8,7 +8,7 @@ import { ClientContext, DashboardContext, DashboardFiltersContext, SchemaDataCon
 import { getTableNames, isNumericColumnType, } from './components/ReportBuilder/ast';
 import { ChartBuilderWithModal } from './ChartBuilder';
 import { QuillTextInput } from './components/UiComponents';
-import { QuillSidebar, CustomContainer, QuillSelectColumn, QuillDraggableColumn, QuillSidebarHeading, QuillFilterPopover, QuillSortPopover, QuillLimitPopover, FilterPopoverWrapper, } from './components/ReportBuilder/ui';
+import { QuillSidebar, CustomContainer, QuillSelectColumn, QuillDraggableColumn, QuillSidebarHeading, QuillFilterPopover, QuillSortPopover, QuillLimitPopover, } from './components/ReportBuilder/ui';
 import { deepCopy } from './components/ReportBuilder/util';
 import { hashCode } from './utils/crypto';
 import { defaultAST, defaultColumn, defaultEntry, defaultNumericComparison, defaultTable, defaultVariant, } from './components/ReportBuilder/constants';
@@ -29,11 +29,12 @@ import { getDateBucketFromRange } from './utils/dates';
 import FilterModal from './components/ReportBuilder/FilterModal';
 import { astToFilterTree, filterToAst, filterTreeToAst, } from './utils/astFilterProcessing';
 import useAstToFilterTree from './hooks/useAstToFilterTree';
-import { filterSentence, filterStackToFilterTree, uniqueValuesToStringMap, } from './utils/filterProcessing';
+import { uniqueValuesToStringMap } from './utils/filterProcessing';
 import { QuillMultiSelectComponentWithCombo } from './components/QuillMultiSelectWithCombo';
 import { shouldFetchMore, shouldSortInMemory, } from './utils/paginationProcessing';
 import { EMPTY_INTERNAL_REPORT, fetchReportBuilderDataFromAST, formatRowsFromReport, } from './utils/report';
 import equal from 'fast-deep-equal';
+import FilterStack from './components/ReportBuilder/FilterStack';
 export const QUILL_SERVER = (typeof process !== 'undefined' && process?.env?.QUILL_SERVER_HOST) ||
     'https://quill-344421.uc.r.appspot.com';
 /**
@@ -790,118 +791,182 @@ SidebarComponent = QuillSidebar, ContainerComponent = CustomContainer, SelectCol
             return;
         }
     };
-    const renderFilters = (actionsEnabled = true) => {
-        // Render filterStack
-        return (_jsx("div", { style: {
-                display: 'flex',
-                flexDirection: 'column',
-            }, children: filterStack.map((item, index) => {
-                if (!item.leaf &&
-                    (item.operator === 'and' || item.operator === 'or')) {
-                    return (_jsx("div", { style: {
-                            width: 'fit-content',
-                            marginBottom: '8px',
-                            marginTop: '8px',
-                        }, children: _jsx(TabsComponent, { value: item.operator.toUpperCase(), options: DEFAULT_TAB_OPTIONS, onChange: () => {
-                                if (item.operator === 'and') {
-                                    item.operator = 'or';
-                                }
-                                else {
-                                    item.operator = 'and';
-                                }
-                                let newFormData = null;
-                                if (filterTree) {
-                                    newFormData = filterTreeToAst(filterTree, client.databaseType.toLowerCase());
-                                }
-                                const newAst = deepCopy({
-                                    ...defaultAST,
-                                    ...baseAst,
-                                    ...(!baseAst?.columns && {
-                                        columns: getAllPossibleColumns(baseAst, schemaData.schema).map((c) => {
-                                            const newColumn = deepCopy(defaultColumn);
-                                            newColumn.expr.column = c.field;
-                                            return newColumn;
-                                        }),
-                                    }),
-                                    ...(!baseAst?.from && {
-                                        from: [{ ...defaultTable, table: initialTableName }],
-                                    }),
-                                    where: newFormData,
-                                });
-                                setBaseAst(newAst);
-                                setFormData(newFormData);
-                                fetchSqlQuery(newAst, newFormData);
-                            } }) }, index));
-                }
-                else if (item.value) {
-                    return (_jsx(FilterPopoverWrapper, { schema: schemaData.schema.find((s) => s.name === currentTable || s.displayName === currentTable) ?? schemaData.schema[0], filter: item.value, filterLabel: item.value ? filterSentence(item.value) : '', index: index, FilterTagComponent: FilterPopoverComponent, FilterModal: FilterModal, fieldValuesMap: globalUniqueValues, fieldValuesMapIsLoading: globalUniqueValuesIsLoading, priorFilters: filterStack.slice(0, index > 0 ? index - 1 : 0), columns: columns, client: client, customFields: schemaData.customFields, baseAst: baseAst, endpoint: QUILL_SERVER, ButtonComponent: ButtonComponent, SecondaryButtonComponent: SecondaryButtonComponent, SelectComponent: SelectComponent, TextInputComponent: TextInputComponent, MultiSelectComponent: MultiSelectComponent, handleFilterSave: (filter) => {
-                            item.value = filter;
-                            let newFormData = null;
-                            if (filterTree) {
-                                newFormData = filterTreeToAst(filterTree, client.databaseType.toLowerCase());
-                            }
-                            const newAst = deepCopy({
-                                ...defaultAST,
-                                ...baseAst,
-                                ...(!baseAst?.columns && {
-                                    columns: getAllPossibleColumns(baseAst, schemaData.schema).map((c) => {
-                                        const newColumn = deepCopy(defaultColumn);
-                                        newColumn.expr.column = c.field;
-                                        return newColumn;
-                                    }),
-                                }),
-                                ...(!baseAst?.from && {
-                                    from: [{ ...defaultTable, table: initialTableName }],
-                                }),
-                                where: newFormData,
-                            });
-                            setBaseAst(newAst);
-                            setFormData(newFormData);
-                            fetchSqlQuery(newAst, newFormData);
-                        }, handleFilterDelete: (i) => {
-                            if (!removingFilter) {
-                                setRemovingFilter(true);
-                                const newStack = filterStack;
-                                if (i > 0) {
-                                    newStack.splice(i - 1, 2);
-                                }
-                                else {
-                                    if (filterStack.length > 1) {
-                                        newStack.splice(i, 2);
-                                    }
-                                    else {
-                                        newStack.splice(i, 1);
-                                    }
-                                }
-                                const tree = filterStackToFilterTree(newStack);
-                                let newFormData = null;
-                                if (tree) {
-                                    newFormData = filterTreeToAst(tree, client.databaseType.toLowerCase());
-                                }
-                                const newAst = deepCopy({
-                                    ...defaultAST,
-                                    ...baseAst,
-                                    ...(!baseAst?.columns && {
-                                        columns: getAllPossibleColumns(baseAst, schemaData.schema).map((c) => {
-                                            const newColumn = deepCopy(defaultColumn);
-                                            newColumn.expr.column = c.field;
-                                            return newColumn;
-                                        }),
-                                    }),
-                                    ...(!baseAst?.from && {
-                                        from: [{ ...defaultTable, table: initialTableName }],
-                                    }),
-                                    where: newFormData,
-                                });
-                                setBaseAst(newAst);
-                                setFormData(newFormData);
-                                fetchSqlQuery(newAst, newFormData);
-                                setRemovingFilter(false);
-                            }
-                        }, disabled: !actionsEnabled }, `filter_${index}_${item.value ? filterSentence(item.value) : ''}`));
-                }
-            }) }));
-    };
+    // const renderFilters = (actionsEnabled = true) => {
+    //   // Render filterStack
+    //   return (
+    //     <div
+    //       style={{
+    //         display: 'flex',
+    //         flexDirection: 'column',
+    //       }}
+    //     >
+    //       {filterStack.map((item, index) => {
+    //         if (
+    //           !item.leaf &&
+    //           (item.operator === 'and' || item.operator === 'or')
+    //         ) {
+    //           return (
+    //             <div
+    //               style={{
+    //                 width: 'fit-content',
+    //                 marginBottom: '8px',
+    //                 marginTop: '8px',
+    //               }}
+    //               key={index}
+    //             >
+    //               <TabsComponent
+    //                 value={item.operator.toUpperCase()}
+    //                 options={DEFAULT_TAB_OPTIONS}
+    //                 onChange={() => {
+    //                   if (item.operator === 'and') {
+    //                     item.operator = 'or';
+    //                   } else {
+    //                     item.operator = 'and';
+    //                   }
+    //                   let newFormData = null;
+    //                   if (filterTree) {
+    //                     newFormData = filterTreeToAst(
+    //                       filterTree,
+    //                       client.databaseType.toLowerCase(),
+    //                     );
+    //                   }
+    //                   const newAst = deepCopy({
+    //                     ...defaultAST,
+    //                     ...baseAst,
+    //                     ...(!baseAst?.columns && {
+    //                       columns: getAllPossibleColumns(
+    //                         baseAst,
+    //                         schemaData.schema,
+    //                       ).map((c) => {
+    //                         const newColumn = deepCopy(defaultColumn);
+    //                         newColumn.expr.column = c.field;
+    //                         return newColumn;
+    //                       }),
+    //                     }),
+    //                     ...(!baseAst?.from && {
+    //                       from: [{ ...defaultTable, table: initialTableName }],
+    //                     }),
+    //                     where: newFormData,
+    //                   });
+    //                   setBaseAst(newAst);
+    //                   setFormData(newFormData);
+    //                   fetchSqlQuery(newAst, newFormData);
+    //                 }}
+    //               />
+    //             </div>
+    //           );
+    //         } else if (item.value) {
+    //           return (
+    //             <FilterPopoverWrapper
+    //               key={`filter_${index}_${item.value ? filterSentence(item.value) : ''}`}
+    //               schema={
+    //                 schemaData.schema.find(
+    //                   (s: Table) =>
+    //                     s.name === currentTable || s.displayName === currentTable,
+    //                 ) ?? schemaData.schema[0]
+    //               }
+    //               filter={item.value}
+    //               filterLabel={item.value ? filterSentence(item.value) : ''}
+    //               index={index}
+    //               FilterTagComponent={FilterPopoverComponent}
+    //               FilterModal={FilterModal}
+    //               fieldValuesMap={globalUniqueValues}
+    //               fieldValuesMapIsLoading={globalUniqueValuesIsLoading}
+    //               priorFilters={filterStack.slice(0, index > 0 ? index - 1 : 0)}
+    //               columns={columns}
+    //               client={client}
+    //               customFields={schemaData.customFields}
+    //               baseAst={baseAst}
+    //               endpoint={QUILL_SERVER}
+    //               ButtonComponent={ButtonComponent}
+    //               SecondaryButtonComponent={SecondaryButtonComponent}
+    //               SelectComponent={SelectComponent}
+    //               TextInputComponent={TextInputComponent}
+    //               MultiSelectComponent={MultiSelectComponent}
+    //               handleFilterSave={(filter: Filter) => {
+    //                 item.value = filter;
+    //                 let newFormData = null;
+    //                 if (filterTree) {
+    //                   newFormData = filterTreeToAst(
+    //                     filterTree,
+    //                     client.databaseType.toLowerCase(),
+    //                   );
+    //                 }
+    //                 const newAst = deepCopy({
+    //                   ...defaultAST,
+    //                   ...baseAst,
+    //                   ...(!baseAst?.columns && {
+    //                     columns: getAllPossibleColumns(
+    //                       baseAst,
+    //                       schemaData.schema,
+    //                     ).map((c) => {
+    //                       const newColumn = deepCopy(defaultColumn);
+    //                       newColumn.expr.column = c.field;
+    //                       return newColumn;
+    //                     }),
+    //                   }),
+    //                   ...(!baseAst?.from && {
+    //                     from: [{ ...defaultTable, table: initialTableName }],
+    //                   }),
+    //                   where: newFormData,
+    //                 });
+    //                 setBaseAst(newAst);
+    //                 setFormData(newFormData);
+    //                 fetchSqlQuery(newAst, newFormData);
+    //               }}
+    //               handleFilterDelete={(i: number) => {
+    //                 if (!removingFilter) {
+    //                   setRemovingFilter(true);
+    //                   const newStack = filterStack;
+    //                   if (i > 0) {
+    //                     newStack.splice(i - 1, 2);
+    //                   } else {
+    //                     if (filterStack.length > 1) {
+    //                       newStack.splice(i, 2);
+    //                     } else {
+    //                       newStack.splice(i, 1);
+    //                     }
+    //                   }
+    //                   const tree = filterStackToFilterTree(newStack);
+    //                   let newFormData = null;
+    //                   if (tree) {
+    //                     newFormData = filterTreeToAst(
+    //                       tree,
+    //                       client.databaseType.toLowerCase(),
+    //                     );
+    //                   }
+    //                   const newAst = deepCopy({
+    //                     ...defaultAST,
+    //                     ...baseAst,
+    //                     ...(!baseAst?.columns && {
+    //                       columns: getAllPossibleColumns(
+    //                         baseAst,
+    //                         schemaData.schema,
+    //                       ).map((c) => {
+    //                         const newColumn = deepCopy(defaultColumn);
+    //                         newColumn.expr.column = c.field;
+    //                         return newColumn;
+    //                       }),
+    //                     }),
+    //                     ...(!baseAst?.from && {
+    //                       from: [{ ...defaultTable, table: initialTableName }],
+    //                     }),
+    //                     where: newFormData,
+    //                   });
+    //                   setBaseAst(newAst);
+    //                   setFormData(newFormData);
+    //                   fetchSqlQuery(newAst, newFormData);
+    //                   setRemovingFilter(false);
+    //                 }
+    //               }}
+    //               disabled={!actionsEnabled}
+    //             />
+    //           );
+    //         }
+    //       })}
+    //     </div>
+    //   );
+    // };
     /**
      * Return whether all columns have been selected (used to hide select all
      * and show clear button).
@@ -1181,7 +1246,7 @@ SidebarComponent = QuillSidebar, ContainerComponent = CustomContainer, SelectCol
                                         flexDirection: 'column',
                                         gap: 8,
                                         marginBottom: 12,
-                                    }, children: renderFilters(false) })), _jsxs("div", { style: {
+                                    }, children: _jsx(FilterStack, { client: client, filterStack: filterStack, filterTree: filterTree, defaultAST: defaultAST, baseAst: baseAst, setBaseAst: setBaseAst, setFormData: setFormData, fetchSqlQuery: fetchSqlQuery, schemaData: schemaData, defaultColumn: defaultColumn, defaultTable: defaultTable, currentTable: currentTable, initialTableName: initialTableName, globalUniqueValues: globalUniqueValues, globalUniqueValuesIsLoading: globalUniqueValuesIsLoading, columns: columns, removingFilter: removingFilter, setRemovingFilter: setRemovingFilter, TabsComponent: TabsComponent, FilterPopoverComponent: FilterPopoverComponent, FilterModal: FilterModal, ButtonComponent: ButtonComponent, SecondaryButtonComponent: SecondaryButtonComponent, SelectComponent: SelectComponent, TextInputComponent: TextInputComponent, MultiSelectComponent: MultiSelectComponent, actionsEnabled: false }) })), _jsxs("div", { style: {
                                         display: 'flex',
                                         flexDirection: 'column',
                                         alignItems: 'flex-start',
@@ -1419,7 +1484,7 @@ SidebarComponent = QuillSidebar, ContainerComponent = CustomContainer, SelectCol
                                             flexDirection: 'column',
                                             gap: 8,
                                             marginBottom: 12,
-                                        }, children: renderFilters() })), _jsxs("div", { style: {
+                                        }, children: _jsx(FilterStack, { client: client, filterStack: filterStack, filterTree: filterTree, defaultAST: defaultAST, baseAst: baseAst, setBaseAst: setBaseAst, setFormData: setFormData, fetchSqlQuery: fetchSqlQuery, schemaData: schemaData, defaultColumn: defaultColumn, defaultTable: defaultTable, currentTable: currentTable, initialTableName: initialTableName, globalUniqueValues: globalUniqueValues, globalUniqueValuesIsLoading: globalUniqueValuesIsLoading, columns: columns, removingFilter: removingFilter, setRemovingFilter: setRemovingFilter, TabsComponent: TabsComponent, FilterPopoverComponent: FilterPopoverComponent, FilterModal: FilterModal, ButtonComponent: ButtonComponent, SecondaryButtonComponent: SecondaryButtonComponent, SelectComponent: SelectComponent, TextInputComponent: TextInputComponent, MultiSelectComponent: MultiSelectComponent, actionsEnabled: true }) })), _jsxs("div", { style: {
                                             display: 'flex',
                                             flexDirection: 'column',
                                             alignItems: 'flex-start',

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

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

package/dist/esm/SQLEditor.js

@@ -100,11 +100,12 @@ export default function SQLEditor({ ButtonComponent = MemoizedButton, SecondaryB
     const [isAddLoading, setIsAddLoading] = useState(false);
     const [isChartBuilderOpen, setIsChartBuilderOpen] = useState(false);
     const [displayTable, setDisplayTable] = useState(false);
+    const [formattedRows, setFormattedRows] = useState([]);
     const formRef = useRef(null);
     const sidebarRef = useRef(null);
     const [searchBarWidth, setSearchBarWidth] = useState(200);
+    const [showSearchBar, setShowSearchBar] = useState(false);
     const [filterBarWidth, setFilterBarWidth] = useState(200);
-    const [formattedRows, setFormattedRows] = useState([]);
     const [rowCount, setRowCount] = useState(undefined);
     const [rowCountIsLoading, setRowCountIsLoading] = useState(false);
     const [maxPage, setMaxPage] = useState(1);
@@ -114,12 +115,12 @@ export default function SQLEditor({ ButtonComponent = MemoizedButton, SecondaryB
         ...EMPTY_INTERNAL_REPORT,
         ...report,
     });
-    const DEFAULT_ROWS_PER_PAGE = 10;
+    const tableRef = useRef(null);
+    const DEFAULT_ROWS_PER_PAGE = 5;
     const ROW_HEIGHT = 37;
     const TABLE_TAB_HEIGHT = 75;
-    const dynamicHeight = window.innerHeight * 0.8 - 310;
-    const rowsPerPage = Math.max(DEFAULT_ROWS_PER_PAGE, Math.floor((dynamicHeight - TABLE_TAB_HEIGHT) / ROW_HEIGHT));
-    const calculatedHeight = TABLE_TAB_HEIGHT + rowsPerPage * ROW_HEIGHT; // height needs to be 75 + rows * rowheight <= window.innerHeight * 0.8 - 330
+    const dynamicHeight = tableRef.current ? tableRef.current.clientHeight : 0;
+    const rowsPerPage = Math.max(DEFAULT_ROWS_PER_PAGE, Math.ceil((dynamicHeight - TABLE_TAB_HEIGHT) / ROW_HEIGHT));
     const pagination = {
         page: 0,
         rowsPerPage,
@@ -145,6 +146,7 @@ export default function SQLEditor({ ButtonComponent = MemoizedButton, SecondaryB
         function handleResize() {
             updateFirstChildWidth(formRef, setSearchBarWidth, { gap: 12 });
             updateFirstChildWidth(sidebarRef, setFilterBarWidth, { gap: 12 });
+            setShowSearchBar(true);
         }
         handleResize();
         window.addEventListener('resize', handleResize);
@@ -313,6 +315,9 @@ export default function SQLEditor({ ButtonComponent = MemoizedButton, SecondaryB
             onChangeQuery(query || '');
         }
     }, [query]);
+    if (schemaData.isSchemaLoading) {
+        return _jsx(LoadingComponent, {});
+    }
     return (_jsxs("div", { style: { backgroundColor: theme?.backgroundColor, ...containerStyle }, className: className, children: [(!isChartBuilderHorizontalView ||
                 (isChartBuilderHorizontalView && !isChartBuilderOpen)) &&
                 !schemaData.isSchemaLoading && (_jsx("div", { style: {
@@ -360,14 +365,15 @@ export default function SQLEditor({ ButtonComponent = MemoizedButton, SecondaryB
                                                         handleRunSqlPrompt();
                                                     }, style: {
                                                         display: 'flex',
+                                                        visibility: showSearchBar ? 'visible' : 'hidden',
                                                         flexDirection: 'row',
                                                         gap: 12,
                                                         paddingTop: 16,
                                                         paddingBottom: 16,
                                                     }, children: [_jsx(TextInputComponent, { id: "ai-search", value: sqlPrompt, width: searchBarWidth, onChange: (e) => setSqlPrompt(e.target.value), placeholder: "Ask a question..." }), _jsx(ButtonComponent, { onClick: handleRunSqlPrompt, label: "Ask AI" })] }), _jsx("div", { style: {
-                                                        minHeight: Math.max(210, window.innerHeight * 0.2),
+                                                        minHeight: 'max(210px, 20vh)',
                                                         maxHeight: '30%',
-                                                        height: window.innerHeight * 0.2,
+                                                        height: '20vh',
                                                     }, children: _jsx(SQLEditorComponent, { query: query || '', schema: schemaData.schema, databaseType: client?.databaseType ?? 'postgresql', clientName: client?.publicKey || '', setQuery: setQuery, handleRunQuery: () => {
                                                             handleRunQuery(currentProcessing, true);
                                                         }, handleFixWithAI: handleFixWithAI, isNewQueryEnabled: isNewQueryEnabled, runQueryOnMount: runQueryOnMount, handleClearQuery: handleClearQuery, theme: theme, defineEditorTheme: defineEditorTheme, setEditorTheme: setEditorTheme, setEditorMounted: () => { }, ButtonComponent: ButtonComponent, SecondaryButtonComponent: SecondaryButtonComponent, loading: sqlResponseLoading && schemaData.isSchemaLoading, LoadingComponent: LoadingComponent }) }), _jsx("div", { style: {
@@ -428,10 +434,11 @@ export default function SQLEditor({ ButtonComponent = MemoizedButton, SecondaryB
                                                                     width: '100%',
                                                                     alignItems: 'center',
                                                                 }, children: [errorMessage, errorMessage !== 'No data found' &&
-                                                                        errorMessage !== 'No query found' && (_jsx(SecondaryButtonComponent, { onClick: handleFixWithAI, label: "Fix with AI" }))] }) })), errorMessage || !displayTable ? null : (_jsx(TableComponent, { isLoading: sqlQueryLoading && !isAddLoading, rows: formattedRows, columns: columns, rowCount: rowCount, rowsPerPage: rowsPerPage, rowCountIsLoading: rowCountIsLoading, onPageChange: onPageChange, onSortChange: onSortChange, containerStyle: {
-                                                                height: calculatedHeight,
-                                                                maxHeight: calculatedHeight,
-                                                            }, currentPage: currentPage, setCurrentPage: setCurrentPage }))] })] }) }), isChartBuilderEnabled && (_jsxs("div", { style: {
+                                                                        errorMessage !== 'No query found' && (_jsx(SecondaryButtonComponent, { onClick: handleFixWithAI, label: "Fix with AI" }))] }) })), errorMessage || !displayTable ? null : (_jsx("div", { ref: tableRef, children: _jsx(TableComponent, { isLoading: sqlQueryLoading && !isAddLoading, rows: formattedRows, columns: columns, rowCount: rowCount, rowsPerPage: rowsPerPage, rowCountIsLoading: rowCountIsLoading, onPageChange: onPageChange, onSortChange: onSortChange, containerStyle: {
+                                                                    height: 'calc(100vh - max(210px, 20vh) - 310px)',
+                                                                    minHeight: `calc(${DEFAULT_ROWS_PER_PAGE} * ${ROW_HEIGHT}px + ${TABLE_TAB_HEIGHT}px)`, // at least 10 rows tall
+                                                                    maxHeight: 'calc(100vh - max(210px, 20vh) - 310px)',
+                                                                }, currentPage: currentPage, setCurrentPage: setCurrentPage }) }))] })] }) }), isChartBuilderEnabled && (_jsxs("div", { style: {
                                             display: 'flex',
                                             flexDirection: 'row',
                                             alignItems: 'center',

package/dist/esm/Table.js

@@ -197,7 +197,7 @@ const ChartUpdater = ({ reportId, containerStyle, className, dashboardContext, c
                             if (f.field === filter.field ||
                                 (f.filterType === 'date_range' &&
                                     filter.filterType === 'date_range')) {
-                                return updateFilter(f, value, comparison);
+                                return updateFilter(f, value, comparison, f.dashboardName);
                             }
                             return f;
                         });

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

@@ -83,7 +83,7 @@ export function DashboardFilter({ filter, onChangeFilter, SelectComponent = Quil
                                 whiteSpace: 'nowrap',
                                 minWidth: 80,
                                 justifyContent: 'center',
-                            }, children: "compared to" }), _jsx(SelectComponent, { value: filter.comparisonRange?.value, onChange: (e) => {
+                            }, children: "compared to" }), _jsx(SelectComponent, { value: filter.comparisonRange?.value ?? 'NO_COMPARISON', onChange: (e) => {
                                 onChangeFilter(filter, null, COMPARISON_OPTIONS.find((option) => option.value === e.target.value));
                             }, options: COMPARISON_OPTIONS.map((compareOption) => ({
                                 value: compareOption.value,

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

@@ -1 +1 @@
-{"version":3,"file":"DataLoader.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DataLoader.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,WAAW,EAAuB,MAAM,qBAAqB,CAAC;AACvE,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAajD,OAAO,EACL,oBAAoB,EAErB,MAAM,6BAA6B,CAAC;AAuBrC,MAAM,MAAM,oBAAoB,GAAG;IACjC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,YAAY,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACnE,IAAI,EAAE,WAAW,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B,CAAC;AAkCF,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,oBAAoB,EAAE,2BAA2B,GAClD,EAAE;IACD,IAAI,EAAE,WAAW,CAAC;IAClB,OAAO,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC;IACtB,oBAAoB,EAAE,oBAAoB,CAAC;IAC3C,QAAQ,EAAE,CAAC,EACT,SAAS,EACT,KAAK,EACL,YAAY,EACZ,YAAY,EACZ,IAAI,GACL,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;CACzC,GAAG,GAAG,CAAC,OAAO,CAyLd;AAED,KAAK,YAAY,GAAG;IAClB,CAAC,GAAG,EAAE,MAAM,GAAG;QACb,OAAO,EAAE,MAAM,CAAC;QAChB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,uBAAuB,CAAC,EAAE,MAAM,CAAC;QACjC,sBAAsB,CAAC,EAAE,MAAM,CAAC;KACjC,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG;IACtC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,WAAW,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B,CAAC;AAIF,eAAO,MAAM,eAAe;UAOpB,WAAW;;mCAGN,WAAW,UACZ,UAAU,KACf,YAAY;0BACK,oBAAoB;aACjC,GAAG,EAAE,GAAG,IAAI;qFAQlB,yBAAyB,KAAK,WAAW;MAC1C,WAmFH,CAAC"}
+{"version":3,"file":"DataLoader.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DataLoader.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,WAAW,EAAuB,MAAM,qBAAqB,CAAC;AACvE,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAajD,OAAO,EACL,oBAAoB,EAErB,MAAM,6BAA6B,CAAC;AAuBrC,MAAM,MAAM,oBAAoB,GAAG;IACjC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,YAAY,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACnE,IAAI,EAAE,WAAW,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B,CAAC;AAoCF,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,oBAAoB,EAAE,2BAA2B,GAClD,EAAE;IACD,IAAI,EAAE,WAAW,CAAC;IAClB,OAAO,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC;IACtB,oBAAoB,EAAE,oBAAoB,CAAC;IAC3C,QAAQ,EAAE,CAAC,EACT,SAAS,EACT,KAAK,EACL,YAAY,EACZ,YAAY,EACZ,IAAI,GACL,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;CACzC,GAAG,GAAG,CAAC,OAAO,CAwLd;AAED,KAAK,YAAY,GAAG;IAClB,CAAC,GAAG,EAAE,MAAM,GAAG;QACb,OAAO,EAAE,MAAM,CAAC;QAChB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,uBAAuB,CAAC,EAAE,MAAM,CAAC;QACjC,sBAAsB,CAAC,EAAE,MAAM,CAAC;KACjC,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG;IACtC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,WAAW,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B,CAAC;AAIF,eAAO,MAAM,eAAe;UAOpB,WAAW;;mCAGN,WAAW,UACZ,UAAU,KACf,YAAY;0BACK,oBAAoB;aACjC,GAAG,EAAE,GAAG,IAAI;qFAQlB,yBAAyB,KAAK,WAAW;MAC1C,WAmFH,CAAC"}

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

@@ -48,7 +48,9 @@ function filterValuesEquivalent(filters1, filters2) {
             mappedFilters1[key].table !== mappedFilters2[key]?.table ||
             mappedFilters1[key].filterType !== mappedFilters2[key]?.filterType ||
             mappedFilters1[key].startDate !== mappedFilters2[key]?.startDate ||
-            mappedFilters1[key].endDate !== mappedFilters2[key]?.endDate) {
+            mappedFilters1[key].endDate !== mappedFilters2[key]?.endDate ||
+            mappedFilters1[key].comparisonRange !==
+                mappedFilters2[key]?.comparisonRange) {
             return false;
         }
     }
@@ -176,8 +178,7 @@ export default function DataLoader({ item, children, filters, additionalProcessi
         fetchReportHelper(additionalProcessing);
     }, [filters, item.id]);
     useEffect(() => {
-        // @ts-ignore
-        if (dashboard[item.id] && dashboard[item.id].triggerReload) {
+        if (dashboard[item.id]?.triggerReload) {
             fetchReportHelper(additionalProcessing);
         }
     }, [dashboard[item.id]]);

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

@@ -1 +1 @@
-{"version":3,"file":"MetricComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/MetricComponent.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAMnD,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAC3C,MAAM,EACN,OAAO,EACP,KAAK,EACL,SAAS,GACV,EAAE,gBAAgB,GAAG,GAAG,CAAC,OAAO,CA+MhC"}
+{"version":3,"file":"MetricComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/MetricComponent.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAMnD,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAC3C,MAAM,EACN,OAAO,EACP,KAAK,EACL,SAAS,GACV,EAAE,gBAAgB,GAAG,GAAG,CAAC,OAAO,CA2NhC"}

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

@@ -10,8 +10,8 @@ export default function QuillMetricComponent({ report, onClick, error, isLoading
     const primaryMetricLabel = report?.filtersApplied?.date_range?.preset?.label;
     const comparisonKey = report?.filtersApplied?.date_range?.comparisonRange?.value;
     const comparisonLabel = COMPARISON_OPTIONS.find((opt) => opt.value === comparisonKey)?.text;
-    return (_jsx("div", { onClick: () => onClick && !error && onClick(report), style: {
-            cursor: error || !onClick ? 'default' : 'pointer',
+    return (_jsx("div", { onClick: () => onClick && onClick(report), style: {
+            cursor: !onClick ? 'default' : 'pointer',
             boxSizing: 'content-box',
             borderRadius: 8,
             paddingBottom: isLoading ? 0 : 30,
@@ -51,7 +51,18 @@ export default function QuillMetricComponent({ report, onClick, error, isLoading
                                 }, children: report?.name })) }), isLoading ? (_jsx(ChartSkeleton, { containerStyle: {
                                 maxHeight: '78px',
                                 height: '100%',
-                            } })) : error ? (_jsx("div", { children: _jsx(ChartError, { errorMessage: error }) })) : report.rows?.length === 0 ||
+                            } })) : error ? (_jsx(ChartError, { errorMessage: error, containerStyle: {
+                                display: 'flex',
+                                flex: '1 0 auto',
+                                height: '80%',
+                                margin: 'auto',
+                                justifyContent: 'center',
+                                alignItems: 'center',
+                                fontSize: 13,
+                                color: theme?.secondaryTextColor,
+                                maxWidth: '100%',
+                                width: '100%',
+                            } })) : report.rows?.length === 0 ||
                             report.rows[0][report.xAxisField] === null ? (_jsx("div", { style: {
                                 display: 'flex',
                                 flex: '1 0 auto',

package/dist/esm/components/QuillMultiSelectWithCombo.d.ts

@@ -2,7 +2,7 @@ import { MultiSelectComponentProps } from './UiComponents';
 /**
  * A robust select component that implements the new minimal Select interface.
  */
-export declare function QuillMultiSelectComponentWithCombo({ options, width, onChange, label, value, isLoading, }: MultiSelectComponentProps): import("react/jsx-runtime").JSX.Element;
+export declare function QuillMultiSelectComponentWithCombo({ options, width, onChange, label, value, isLoading, disabled, }: MultiSelectComponentProps): import("react/jsx-runtime").JSX.Element;
 export declare const ListboxTextInput: ({ value, onChange, placeholder, }: {
     value: string;
     onChange: (e: string) => void;

package/dist/esm/components/QuillMultiSelectWithCombo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QuillMultiSelectWithCombo.d.ts","sourceRoot":"","sources":["../../../src/components/QuillMultiSelectWithCombo.tsx"],"names":[],"mappings":"AACA,OAAO,EAAkB,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAiC3E;;GAEG;AACH,wBAAgB,kCAAkC,CAAC,EACjD,OAAO,EACP,KAAK,EACL,QAAQ,EACR,KAAK,EACL,KAAK,EACL,SAAS,GACV,EAAE,yBAAyB,2CA4U3B;AAED,eAAO,MAAM,gBAAgB;WAKpB,MAAM;kBACC,MAAM,KAAK,IAAI;iBAChB,MAAM;6CAwDpB,CAAC"}
+{"version":3,"file":"QuillMultiSelectWithCombo.d.ts","sourceRoot":"","sources":["../../../src/components/QuillMultiSelectWithCombo.tsx"],"names":[],"mappings":"AACA,OAAO,EAAkB,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAiC3E;;GAEG;AACH,wBAAgB,kCAAkC,CAAC,EACjD,OAAO,EACP,KAAK,EACL,QAAQ,EACR,KAAK,EACL,KAAK,EACL,SAAS,EACT,QAAQ,GACT,EAAE,yBAAyB,2CAiV3B;AAED,eAAO,MAAM,gBAAgB;WAKpB,MAAM;kBACC,MAAM,KAAK,IAAI;iBAChB,MAAM;6CAwDpB,CAAC"}

package/dist/esm/components/QuillMultiSelectWithCombo.js

@@ -21,7 +21,7 @@ function displaySelectedOptionLabels({ options, value, }) {
 /**
  * A robust select component that implements the new minimal Select interface.
  */
-export function QuillMultiSelectComponentWithCombo({ options, width, onChange, label, value, isLoading, }) {
+export function QuillMultiSelectComponentWithCombo({ options, width, onChange, label, value, isLoading, disabled, }) {
     const [theme] = useContext(ThemeContext);
     const [selectedOptions, setSelectedOptions] = useState([]);
     const [showModal, setShowModal] = useState(false);
@@ -124,8 +124,12 @@ export function QuillMultiSelectComponentWithCombo({ options, width, onChange, l
                     height: 40,
                     minHeight: 40,
                     maxHeight: 40,
-                }, className: "quill-select-button", onClick: () => setShowModal((showModal) => !showModal), children: [_jsx("style", { children: ` .quill-select-button { background: ${theme?.backgroundColor}; } 
+                }, className: 'quill-select-button', onClick: () => setShowModal((showModal) => !showModal), disabled: disabled, children: [_jsx("style", { children: ` .quill-select-button { background: ${theme?.backgroundColor}; } 
           .quill-select-button:hover { background: ${theme?.hoverBackgroundColor}; }
+          .quill-select-button:disabled {
+            cursor: not-allowed;
+            background: ${theme?.hoverBackgroundColor};
+          }
         ` }), _jsx("span", { style: {
                             textOverflow: 'ellipsis',
                             whiteSpace: 'nowrap',