@quillsql/react 2.12.46 → 2.12.48

package/dist/cjs/SQLEditor.d.ts

@@ -1,4 +1,5 @@
 import React, { ReactNode } from 'react';
+import { TextInputComponentProps } from './components/UiComponents';
 import { QuillReport } from './models/Report';
 /**
  * Props for the Quill SQLEditor component.
@@ -12,6 +13,7 @@ export interface SQLEditorProps {
         label: string;
         disabled?: boolean;
         icon?: ReactNode;
+        tooltipText?: string;
     }) => JSX.Element;
     /**
      * A secondary button component.
@@ -29,14 +31,7 @@ export interface SQLEditorProps {
     /**
      * A input element for getting text from the user.
      */
-    TextInputComponent?: (props: {
-        id: string;
-        width: number;
-        value: string;
-        label?: string;
-        placeholder?: string;
-        onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
-    }) => JSX.Element;
+    TextInputComponent?: ((props: TextInputComponentProps) => JSX.Element) | React.ForwardRefExoticComponent<TextInputComponentProps & React.RefAttributes<HTMLInputElement>>;
     /** A select component. */
     SelectComponent?: (props: {
         value: string;
@@ -66,6 +61,7 @@ export interface SQLEditorProps {
             field: string;
             direction: string;
         }) => void;
+        containerStyle?: React.CSSProperties;
     }) => JSX.Element;
     /**
      * A component to show while the query results are loading.
@@ -164,6 +160,10 @@ export interface SQLEditorProps {
      * A callback that is fired when the data columns change.
      */
     onChangeColumns?: (columns: object[]) => void;
+    /** A callback function triggered when changes are discarded. */
+    onDiscardChanges?: () => void;
+    /** A callback function triggered when changes are saved. */
+    onSaveChanges?: () => void;
     /**
      * A callback that is fired when a report has been added to a dashboard.
      */
@@ -186,6 +186,10 @@ export interface SQLEditorProps {
      * Whether the "new query" button is enabled.
      */
     isNewQueryEnabled?: boolean;
+    /**
+     * Whether the user is an admin.
+     */
+    isAdminEnabled?: boolean;
     /**
      * Whether to show table format options.
      */
@@ -207,13 +211,17 @@ export interface SQLEditorProps {
      */
     defaultQuery?: string;
     /**
-     * The default dashboard to dashboard items to.
+     * The default dashboard to add the query to.
      */
     destinationDashboard?: string;
     /**
      * The title of the ChartBuilder dialog.
      */
     chartBuilderTitle?: string;
+    /**
+     * Whether to automatically run the query when the component mounts.
+     */
+    runQueryOnMount?: boolean;
     /**
      * The label of the button to add the current query to a dashboard.
      *
@@ -260,13 +268,14 @@ export interface SQLEditorProps {
  * ### SQLEditor API
  * @see https://docs.quillsql.com/components/sql-editor
  */
-export default function SQLEditor({ ButtonComponent, SecondaryButtonComponent, DeleteButtonComponent, TextInputComponent, SelectComponent, TableComponent, isNewQueryEnabled, LoadingComponent, ModalComponent, PopoverComponent, CardComponent, LabelComponent, HeaderComponent, SubHeaderComponent, TextComponent, ErrorMessageComponent, ChartBuilderInputRowContainer, ChartBuilderInputColumnContainer, PivotRowContainer, PivotColumnContainer, ChartBuilderFormContainer, defaultQuery, onChangeQuery, onChangeData, onChangeColumns, onChangeFields, isChartBuilderEnabled, showTableFormatOptions, showDateFieldOptions, showAccessControlOptions, destinationDashboard, chartBuilderTitle, onAddToDashboardComplete, addToDashboardButtonLabel, report, organizationName, isChartBuilderHorizontalView, containerStyle, className, onClickChartElement, }: SQLEditorProps): import("react/jsx-runtime").JSX.Element;
-export declare const SchemaListComponent: ({ schema, theme, loading, LoadingComponent, width, onClick, }: {
+export default function SQLEditor({ ButtonComponent, SecondaryButtonComponent, DeleteButtonComponent, TextInputComponent, SelectComponent, TableComponent, isNewQueryEnabled, LoadingComponent, ModalComponent, PopoverComponent, CardComponent, LabelComponent, HeaderComponent, SubHeaderComponent, TextComponent, ErrorMessageComponent, ChartBuilderInputRowContainer, ChartBuilderInputColumnContainer, PivotRowContainer, PivotColumnContainer, ChartBuilderFormContainer, defaultQuery, destinationDashboard, onChangeQuery, onChangeData, onChangeColumns, onChangeFields, onDiscardChanges, onSaveChanges, isChartBuilderEnabled, showTableFormatOptions, showDateFieldOptions, showAccessControlOptions, isAdminEnabled, chartBuilderTitle, runQueryOnMount, onAddToDashboardComplete, addToDashboardButtonLabel, report, organizationName, isChartBuilderHorizontalView, containerStyle, className, onClickChartElement, }: SQLEditorProps): import("react/jsx-runtime").JSX.Element;
+export declare const SchemaListComponent: ({ schema, theme, loading, LoadingComponent, width, onClick, style, }: {
     schema: any;
     theme: any;
     loading: boolean;
     LoadingComponent?: any;
     width?: any;
     onClick: (event: React.MouseEvent<HTMLDivElement>) => void;
+    style?: React.CSSProperties | undefined;
 }) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=SQLEditor.d.ts.map

package/dist/cjs/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":"AAEA,OAAO,KAAK,EAAE,EAMZ,SAAS,EAEV,MAAM,OAAO,CAAC;AAMf,OAAO,EAmBL,uBAAuB,EACxB,MAAM,2BAA2B,CAAC;AAGnC,OAAO,EAAE,WAAW,EAAuB,MAAM,iBAAiB,CAAC;AAoGnE;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B;;OAEG;IACH,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE;QACxB,OAAO,EAAE,MAAM,IAAI,CAAC;QACpB,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,IAAI,CAAC,EAAE,SAAS,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;KACtB,KAAK,GAAG,CAAC,OAAO,CAAC;IAElB;;OAEG;IACH,wBAAwB,CAAC,EAAE,CAAC,KAAK,EAAE;QACjC,OAAO,EAAE,MAAM,IAAI,CAAC;QACpB,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,IAAI,CAAC,EAAE,SAAS,CAAC;KAClB,KAAK,GAAG,CAAC,OAAO,CAAC;IAElB,8EAA8E;IAC9E,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,OAAO,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,GAAG,CAAC,OAAO,CAAC;IAExE;;OAEG;IACH,kBAAkB,CAAC,EACf,CAAC,CAAC,KAAK,EAAE,uBAAuB,KAAK,GAAG,CAAC,OAAO,CAAC,GACjD,KAAK,CAAC,yBAAyB,CAC7B,uBAAuB,GAAG,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAChE,CAAC;IAEN,0BAA0B;IAC1B,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE;QACxB,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,OAAO,EAAE;YACP,KAAK,EAAE,MAAM,CAAC;YACd,KAAK,EAAE,MAAM,CAAC;SACf,EAAE,CAAC;QACJ,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;QAChE,KAAK,EAAE,MAAM,CAAC;KACf,KAAK,GAAG,CAAC,OAAO,CAAC;IAElB;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE;QACvB,IAAI,EAAE;YAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;SAAE,EAAE,CAAC;QAC/B,OAAO,EAAE;YAAE,KAAK,EAAE,MAAM,CAAC;YAAC,KAAK,EAAE,MAAM,CAAA;SAAE,EAAE,CAAC;QAC5C,SAAS,CAAC,EAAE,OAAO,CAAC;QACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;QACtC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE;YAAE,KAAK,EAAE,MAAM,CAAC;YAAC,SAAS,EAAE,MAAM,CAAA;SAAE,KAAK,IAAI,CAAC;QACpE,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;KACtC,KAAK,GAAG,CAAC,OAAO,CAAC;IAElB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;IAErC,6EAA6E;IAC7E,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE;QACtB,QAAQ,EAAE,SAAS,CAAC;QACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;QACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;KACvB,KAAK,GAAG,CAAC,OAAO,CAAC;IAElB;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE;QACvB,MAAM,EAAE,OAAO,CAAC;QAChB,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;QACrC,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,QAAQ,EAAE,SAAS,CAAC;QACpB,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,MAAM,CAAC,EAAE,MAAM,CAAC;KACjB,KAAK,GAAG,CAAC,OAAO,CAAC;IAElB,2BAA2B;IAC3B,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE;QACzB,MAAM,EAAE,OAAO,CAAC;QAChB,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;QACrC,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,eAAe,EAAE,SAAS,CAAC;KAC5B,KAAK,GAAG,CAAC,OAAO,CAAC;IAElB,yBAAyB;IACzB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,GAAG,CAAC,OAAO,CAAC;IAE3D,0BAA0B;IAC1B,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,GAAG,CAAC,OAAO,CAAC;IAE5D,0DAA0D;IAC1D,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,GAAG,CAAC,OAAO,CAAC;IAE/D,+BAA+B;IAC/B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,GAAG,CAAC,OAAO,CAAC;IAE1D;;OAEG;IACH,6BAA6B,CAAC,EAAE,CAAC,KAAK,EAAE;QACtC,QAAQ,EAAE,SAAS,CAAC;KACrB,KAAK,GAAG,CAAC,OAAO,CAAC;IAElB;;OAEG;IACH,gCAAgC,CAAC,EAAE,CAAC,KAAK,EAAE;QACzC,QAAQ,EAAE,SAAS,CAAC;KACrB,KAAK,GAAG,CAAC,OAAO,CAAC;IAElB;;OAEG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,QAAQ,EAAE,SAAS,CAAA;KAAE,KAAK,GAAG,CAAC,OAAO,CAAC;IAEpE;;OAEG;IACH,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,QAAQ,EAAE,SAAS,CAAA;KAAE,KAAK,GAAG,CAAC,OAAO,CAAC;IAEvE;;OAEG;IACH,yBAAyB,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,QAAQ,EAAE,SAAS,CAAA;KAAE,KAAK,GAAG,CAAC,OAAO,CAAC;IAE5E;;OAEG;IACH,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,YAAY,EAAE,MAAM,CAAA;KAAE,KAAK,GAAG,CAAC,OAAO,CAAC;IAEzE;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAExC;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAExC;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAE5C;;OAEG;IACH,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAE9C,gEAAgE;IAChE,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B,4DAA4D;IAC5D,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAE3B;;OAEG;IACH,wBAAwB,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IAEzD,oEAAoE;IACpE,mBAAmB,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IAE3C;;;;;;OAMG;IACH,4BAA4B,CAAC,EAAE,OAAO,CAAC;IAEvC;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;OAEG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IAEjC;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAE/B;;OAEG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;IAEnC;;OAEG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IAErB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAE9B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;;OAIG;IACH,yBAAyB,CAAC,EAAE,MAAM,CAAC;IAEnC;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACtC;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,eAAgC,EAChC,wBAAkD,EAClD,qBAA4C,EAC5C,kBAAmC,EACnC,eAAsC,EACtC,cAA6C,EAC7C,iBAAyB,EACzB,gBAAwC,EACxC,cAA8B,EAC9B,gBAAkC,EAClC,aAAyB,EACzB,cAA8B,EAC9B,eAAgC,EAChC,kBAAsC,EACtC,aAA4B,EAC5B,qBAAkD,EAClD,6BAAkE,EAClE,gCAAwE,EACxE,iBAA0C,EAC1C,oBAAgD,EAChD,yBAA0D,EAC1D,YAAY,EACZ,oBAAoB,EACpB,aAAa,EACb,YAAY,EACZ,eAAe,EACf,cAAc,EACd,gBAAgB,EAChB,aAAa,EACb,qBAA6B,EAC7B,sBAA8B,EAC9B,oBAA4B,EAC5B,wBAAgC,EAChC,cAAsB,EACtB,iBAAiB,EACjB,eAAuB,EACvB,wBAAwB,EACxB,yBAA8C,EAC9C,MAAkB,EAClB,gBAA4B,EAC5B,4BAAmC,EACnC,cAAoC,EACpC,SAAS,EACT,mBAAmB,GACpB,EAAE,cAAc,2CA6lBhB;AAoID,eAAO,MAAM,mBAAmB;YAStB,GAAG;WACJ,GAAG;aACD,OAAO;uBACG,GAAG;YACd,GAAG;qBACM,gBAAgB,CAAC,cAAc,CAAC,KAAK,IAAI;;6CAkG3D,CAAC"}

package/dist/cjs/SQLEditor.js

@@ -17,7 +17,6 @@ const UiComponents_2 = require("./components/UiComponents");
 const width_1 = require("./utils/width");
 const QuillCard_1 = require("./components/QuillCard");
 const QuillSelect_1 = require("./components/QuillSelect");
-const schema_1 = require("./utils/schema");
 const tableProcessing_1 = require("./utils/tableProcessing");
 const queryConstructor_1 = require("./utils/queryConstructor");
 const monacoConfig_1 = require("./utils/monacoConfig");
@@ -88,26 +87,28 @@ function setEditorTheme(_editor, monaco, schema, databaseType, clientName) {
  * ### SQLEditor API
  * @see https://docs.quillsql.com/components/sql-editor
  */
-function SQLEditor({ ButtonComponent = UiComponents_1.MemoizedButton, SecondaryButtonComponent = UiComponents_1.MemoizedSecondaryButton, DeleteButtonComponent = UiComponents_1.MemoizedDeleteButton, TextInputComponent = UiComponents_2.QuillTextInput, SelectComponent = QuillSelect_1.QuillSelectComponent, TableComponent = UiComponents_1.QuillTableSQLEditorComponent, isNewQueryEnabled = false, LoadingComponent = UiComponents_1.QuillLoadingComponent, ModalComponent = UiComponents_1.MemoizedModal, PopoverComponent = UiComponents_1.MemoizedPopover, 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, ChartBuilderFormContainer = UiComponents_1.QuillChartBuilderFormContainer, defaultQuery, onChangeQuery, onChangeData, onChangeColumns, onChangeFields, isChartBuilderEnabled = false, showTableFormatOptions = false, showDateFieldOptions = false, showAccessControlOptions = false, destinationDashboard, chartBuilderTitle, onAddToDashboardComplete, addToDashboardButtonLabel = 'Add to dashboard', report = undefined, organizationName = undefined, isChartBuilderHorizontalView = true, containerStyle = { height: '100vh' }, className, onClickChartElement, }) {
+function SQLEditor({ ButtonComponent = UiComponents_1.MemoizedButton, SecondaryButtonComponent = UiComponents_1.MemoizedSecondaryButton, DeleteButtonComponent = UiComponents_1.MemoizedDeleteButton, TextInputComponent = UiComponents_2.QuillTextInput, SelectComponent = QuillSelect_1.QuillSelectComponent, TableComponent = UiComponents_1.QuillTableSQLEditorComponent, isNewQueryEnabled = false, LoadingComponent = UiComponents_1.QuillLoadingComponent, ModalComponent = UiComponents_1.MemoizedModal, PopoverComponent = UiComponents_1.MemoizedPopover, 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, ChartBuilderFormContainer = UiComponents_1.QuillChartBuilderFormContainer, defaultQuery, destinationDashboard, onChangeQuery, onChangeData, onChangeColumns, onChangeFields, onDiscardChanges, onSaveChanges, isChartBuilderEnabled = false, showTableFormatOptions = false, showDateFieldOptions = false, showAccessControlOptions = false, isAdminEnabled = false, chartBuilderTitle, runQueryOnMount = false, onAddToDashboardComplete, addToDashboardButtonLabel = 'Add to dashboard', report = undefined, organizationName = undefined, isChartBuilderHorizontalView = true, containerStyle = { height: '100vh' }, className, onClickChartElement, }) {
     const [sqlPrompt, setSqlPrompt] = (0, react_1.useState)('');
     const [client] = (0, react_1.useContext)(Context_1.ClientContext);
     const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
     const [query, setQuery] = (0, react_1.useState)(defaultQuery);
     const [rows, setRows] = (0, react_1.useState)([]);
     const [columns, setColumns] = (0, react_1.useState)([]);
-    const [schema, setSchema] = (0, react_1.useContext)(Context_1.SchemaContext);
-    const [customFields, setCustomFields] = (0, react_1.useContext)(Context_1.CustomFieldContext);
+    const [schemaData] = (0, react_1.useContext)(Context_1.SchemaDataContext);
     const [errorMessage, setErrorMessage] = (0, react_1.useState)('');
     const [sqlResponseLoading, setSqlResponseLoading] = (0, react_1.useState)(false);
     const [sqlQueryLoading, setSqlQueryLoading] = (0, react_1.useState)(false);
-    const [schemaLoading, setSchemaLoading] = (0, react_1.useState)(false);
     const [isChartBuilderOpen, setIsChartBuilderOpen] = (0, react_1.useState)(false);
     const [displayTable, setDisplayTable] = (0, react_1.useState)(false);
     const formRef = (0, react_1.useRef)(null);
+    const sidebarRef = (0, react_1.useRef)(null);
     const [searchBarWidth, setSearchBarWidth] = (0, react_1.useState)(200);
+    const [filterBarWidth, setFilterBarWidth] = (0, react_1.useState)(200);
     const [formattedRows, setFormattedRows] = (0, react_1.useState)([]);
     const [rowCount, setRowCount] = (0, react_1.useState)(undefined);
     const [maxPage, setMaxPage] = (0, react_1.useState)(1);
+    const [tableSearchQuery, setTableSearchQuery] = (0, react_1.useState)('');
+    const [lastSuccessfulQuery, setLastSuccessfulQuery] = (0, react_1.useState)('');
     const [tempReport, setTempReport] = (0, react_1.useState)({
         ...report_1.EMPTY_INTERNAL_REPORT,
         ...report,
@@ -115,11 +116,22 @@ function SQLEditor({ ButtonComponent = UiComponents_1.MemoizedButton, SecondaryB
     const [currentProcessing, setCurrentProcessing] = (0, react_1.useState)({
         page: paginationProcessing_1.DEFAULT_PAGINATION,
     });
+    const displayedTableData = (0, react_1.useMemo)(() => {
+        return (schemaData?.schema?.filter((table) => {
+            return (table.name
+                ?.toLowerCase()
+                ?.includes(tableSearchQuery.toLowerCase().trim()) ||
+                table.columns.some((col) => col.field
+                    ?.toLowerCase()
+                    ?.includes(tableSearchQuery.toLowerCase().trim())));
+        }) ?? []);
+    }, [tableSearchQuery, schemaData.schema]);
     (0, react_1.useEffect)(() => {
         // Since the TextInput component takes a required numeric width parameter,
         // we dynamically calculate the width of this component here.
         function handleResize() {
             (0, width_1.updateFirstChildWidth)(formRef, setSearchBarWidth, { gap: 12 });
+            (0, width_1.updateFirstChildWidth)(sidebarRef, setFilterBarWidth, { gap: 12 });
         }
         handleResize();
         window.addEventListener('resize', handleResize);
@@ -127,20 +139,8 @@ function SQLEditor({ ButtonComponent = UiComponents_1.MemoizedButton, SecondaryB
             window.removeEventListener('resize', handleResize);
         };
     }, []);
-    const getSchema = async () => {
-        if (!client) {
-            setSchemaLoading(false);
-            return;
-        }
-        const { schemaData, customFieldsByTable } = await (0, schema_1.getSchemaInfoWithCustomFields)(client);
-        setSchema(schemaData);
-        setCustomFields(customFieldsByTable);
-        setSchemaLoading(false);
-    };
     (0, react_1.useEffect)(() => {
-        if (client && !schemaLoading) {
-            setSchemaLoading(true);
-            getSchema();
+        if (client) {
             setRows([]);
             setColumns([]);
             setDisplayTable(false);
@@ -192,7 +192,7 @@ function SQLEditor({ ButtonComponent = UiComponents_1.MemoizedButton, SecondaryB
             setDisplayTable(true);
             setSqlQueryLoading(true);
             setErrorMessage('');
-            const tableInfo = await (0, tableProcessing_1.fetchTableByQuery)(query, client, processing, customFields);
+            const tableInfo = await (0, tableProcessing_1.fetchTableByQuery)(query, client, processing, schemaData.customFields);
             if (!!tableInfo.error) {
                 throw new Error(tableInfo.error);
             }
@@ -232,6 +232,7 @@ function SQLEditor({ ButtonComponent = UiComponents_1.MemoizedButton, SecondaryB
                 rows: tempRows,
                 columns: tableInfo.columns,
             });
+            setLastSuccessfulQuery(query);
         }
         catch (e) {
             setErrorMessage(e.message);
@@ -277,88 +278,154 @@ function SQLEditor({ ButtonComponent = UiComponents_1.MemoizedButton, SecondaryB
         }
     }, [query]);
     return ((0, jsx_runtime_1.jsxs)("div", { style: { backgroundColor: theme?.backgroundColor, ...containerStyle }, className: className, children: [(!isChartBuilderHorizontalView ||
-                (isChartBuilderHorizontalView && !isChartBuilderOpen)) && ((0, jsx_runtime_1.jsx)("div", { style: {
+                (isChartBuilderHorizontalView && !isChartBuilderOpen)) &&
+                !schemaData.isSchemaLoading && ((0, jsx_runtime_1.jsx)("div", { style: {
                     height: '100%',
                     display: 'flex',
                     flexDirection: 'column',
                     padding: 0,
-                }, children: (0, jsx_runtime_1.jsx)("div", { style: { height: '100%', display: 'flex', flexDirection: 'column' }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                }, children: (0, jsx_runtime_1.jsx)("div", { style: {
+                        height: '100%',
+                        display: 'flex',
+                        flexDirection: 'column',
+                    }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
                             width: '100%',
                             display: 'flex',
                             height: '100%',
                             flexDirection: 'row',
                             gap: 20,
-                        }, children: [(0, jsx_runtime_1.jsx)(exports.SchemaListComponent, { schema: schema, theme: theme, LoadingComponent: LoadingComponent, loading: schemaLoading, onClick: handleClickSchemaItem }), (0, jsx_runtime_1.jsxs)("div", { style: {
+                        }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
+                                    display: 'flex',
+                                    flexDirection: 'column',
+                                    gap: 20,
+                                }, children: [(0, jsx_runtime_1.jsx)("div", { style: {
+                                            paddingTop: 16,
+                                            paddingLeft: '20px',
+                                            paddingRight: '30px',
+                                        }, children: (0, jsx_runtime_1.jsx)(TextInputComponent, { placeholder: "Filter tables...", onChange: (e) => {
+                                                setTableSearchQuery(e.target.value);
+                                            }, value: tableSearchQuery, id: 'edit-name', width: filterBarWidth }) }), (0, jsx_runtime_1.jsx)(exports.SchemaListComponent, { schema: displayedTableData, theme: theme, LoadingComponent: LoadingComponent, loading: schemaData.isSchemaLoading, onClick: handleClickSchemaItem })] }), (0, jsx_runtime_1.jsxs)("div", { style: {
                                     display: 'flex',
                                     // gap: 12,
                                     flexDirection: 'column',
+                                    justifyContent: 'space-between',
                                     width: 'calc(100% - 290px)',
                                     height: '100%',
                                     overflowX: 'hidden',
-                                }, children: [(0, jsx_runtime_1.jsxs)("form", { ref: formRef, onSubmit: (e) => {
-                                            e.preventDefault();
-                                            handleRunSqlPrompt();
-                                        }, style: {
-                                            display: 'flex',
-                                            flexDirection: 'row',
-                                            gap: 12,
-                                            paddingTop: 16,
-                                            paddingBottom: 16,
-                                        }, children: [(0, jsx_runtime_1.jsx)(TextInputComponent, { id: "ai-search", value: sqlPrompt, width: searchBarWidth, onChange: (e) => setSqlPrompt(e.target.value), placeholder: "Ask a question..." }), (0, jsx_runtime_1.jsx)(ButtonComponent, { onClick: handleRunSqlPrompt, label: "Ask AI" })] }), (0, jsx_runtime_1.jsx)("div", { style: { height: 'calc(50% - 40px)' }, children: (0, jsx_runtime_1.jsx)(SQLEditorComponent, { query: query || '', schema: schema, databaseType: client?.databaseType ?? 'postgresql', clientName: client?.publicKey || '', setQuery: setQuery, handleRunQuery: () => {
-                                                handleRunQuery(currentProcessing, true);
-                                            }, handleFixWithAI: handleFixWithAI, isNewQueryEnabled: isNewQueryEnabled, handleClearQuery: handleClearQuery, theme: theme, defineEditorTheme: defineEditorTheme, setEditorTheme: setEditorTheme, setEditorMounted: () => { }, ButtonComponent: ButtonComponent, SecondaryButtonComponent: SecondaryButtonComponent, loading: sqlResponseLoading, LoadingComponent: LoadingComponent }) }), (0, jsx_runtime_1.jsxs)("div", { style: {
+                                }, children: [(0, jsx_runtime_1.jsx)("div", { style: {
                                             display: 'flex',
                                             flexDirection: 'column',
-                                            height: 'calc(50% - 108px)',
-                                            padding: 0,
-                                            margin: 0,
-                                            border: 'none',
-                                            outline: 'none',
-                                        }, children: [errorMessage && ((0, jsx_runtime_1.jsx)("div", { style: {
-                                                    fontFamily: theme?.fontFamily,
-                                                    color: theme?.primaryTextColor,
-                                                    fontSize: 15,
-                                                    fontWeight: '400',
-                                                    width: '100%',
-                                                }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                                            overflow: 'auto',
+                                            height: '100%',
+                                        }, children: (0, jsx_runtime_1.jsxs)(UiComponents_1.OverflowContainer, { children: [(0, jsx_runtime_1.jsxs)("form", { ref: formRef, onSubmit: (e) => {
+                                                        e.preventDefault();
+                                                        handleRunSqlPrompt();
+                                                    }, style: {
                                                         display: 'flex',
                                                         flexDirection: 'row',
-                                                        justifyContent: 'space-between',
                                                         gap: 12,
-                                                        background: 'rgba(0,0,0,0.02)', // TODO: change color
-                                                        color: theme?.primaryTextColor,
-                                                        fontFamily: theme?.fontFamily,
-                                                        borderRadius: 6,
-                                                        padding: 20,
+                                                        paddingTop: 16,
+                                                        paddingBottom: 16,
+                                                    }, children: [(0, jsx_runtime_1.jsx)(TextInputComponent, { id: "ai-search", value: sqlPrompt, width: searchBarWidth, onChange: (e) => setSqlPrompt(e.target.value), placeholder: "Ask a question..." }), (0, jsx_runtime_1.jsx)(ButtonComponent, { onClick: handleRunSqlPrompt, label: "Ask AI" })] }), (0, jsx_runtime_1.jsx)("div", { style: {
+                                                        minHeight: 210,
+                                                        maxHeight: '30vh',
+                                                        height: '30%',
+                                                    }, children: (0, jsx_runtime_1.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 }) }), (0, jsx_runtime_1.jsx)("div", { style: {
+                                                        display: 'flex',
+                                                        flexDirection: 'row',
                                                         width: '100%',
-                                                        alignItems: 'center',
-                                                    }, children: [errorMessage, errorMessage !== 'No data found' && ((0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: handleFixWithAI, label: "Fix with AI" }))] }) })), errorMessage || !displayTable ? null : ((0, jsx_runtime_1.jsx)(TableComponent, { isLoading: sqlQueryLoading, rows: formattedRows, columns: columns, rowCount: rowCount, onPageChange: onPageChange, onSortChange: onSortChange }))] }), isChartBuilderEnabled && rows.length > 0 && ((0, jsx_runtime_1.jsx)("div", { style: {
+                                                        justifyContent: addToDashboardButtonLabel === 'Add to dashboard'
+                                                            ? 'flex-end'
+                                                            : 'flex-start',
+                                                    }, children: (0, jsx_runtime_1.jsx)("div", { style: {
+                                                            display: 'flex',
+                                                            flexDirection: 'row',
+                                                            alignItems: 'center',
+                                                            height: 70,
+                                                        }, children: (0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', gap: 12 }, children: [addToDashboardButtonLabel ===
+                                                                    'Add to dashboard' ? ((0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: () => {
+                                                                        handleRunQuery(currentProcessing, true);
+                                                                    }, label: "Run query" })) : ((0, jsx_runtime_1.jsx)(ButtonComponent, { onClick: () => {
+                                                                        handleRunQuery(currentProcessing, true);
+                                                                    }, label: "Run query" })), isNewQueryEnabled && ((0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: handleClearQuery, label: "Clear query" })), addToDashboardButtonLabel ===
+                                                                    'Add to dashboard' && ((0, jsx_runtime_1.jsx)(ButtonComponent, { onClick: () => {
+                                                                        onSaveChanges && onSaveChanges();
+                                                                        setIsChartBuilderOpen(true);
+                                                                    }, label: addToDashboardButtonLabel, disabled: !!errorMessage ||
+                                                                        !(rows.length > 0 &&
+                                                                            lastSuccessfulQuery === query), tooltipText: !!errorMessage ||
+                                                                        !(rows.length > 0 &&
+                                                                            lastSuccessfulQuery === query)
+                                                                        ? 'Please run a query'
+                                                                        : '' }))] }) }) }), (0, jsx_runtime_1.jsxs)("div", { style: {
+                                                        display: 'flex',
+                                                        flexDirection: 'column',
+                                                        // height: '100%',
+                                                        padding: 0,
+                                                        margin: 0,
+                                                        border: 'none',
+                                                        outline: 'none',
+                                                    }, children: [errorMessage && ((0, jsx_runtime_1.jsx)("div", { style: {
+                                                                fontFamily: theme?.fontFamily,
+                                                                color: theme?.primaryTextColor,
+                                                                fontSize: 15,
+                                                                fontWeight: '400',
+                                                                width: '100%',
+                                                            }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                                                                    display: 'flex',
+                                                                    flexDirection: 'row',
+                                                                    justifyContent: 'space-between',
+                                                                    gap: 12,
+                                                                    background: 'rgba(0,0,0,0.02)', // TODO: change color
+                                                                    color: theme?.primaryTextColor,
+                                                                    fontFamily: theme?.fontFamily,
+                                                                    borderRadius: 6,
+                                                                    padding: 20,
+                                                                    marginBottom: 15,
+                                                                    width: '100%',
+                                                                    alignItems: 'center',
+                                                                }, children: [errorMessage, errorMessage !== 'No data found' &&
+                                                                        errorMessage !== 'No query found' && ((0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: handleFixWithAI, label: "Fix with AI" }))] }) })), errorMessage || !displayTable ? null : ((0, jsx_runtime_1.jsx)(TableComponent, { isLoading: sqlQueryLoading, rows: formattedRows, columns: columns, rowCount: rowCount, onPageChange: onPageChange, onSortChange: onSortChange, containerStyle: {
+                                                                maxHeight: Math.max(window.innerHeight * 0.7, 75 +
+                                                                    Math.min(Math.max(10, rows.length), 10) * 37),
+                                                            } }))] })] }) }), isChartBuilderEnabled && ((0, jsx_runtime_1.jsxs)("div", { style: {
                                             display: 'flex',
                                             flexDirection: 'row',
                                             alignItems: 'center',
                                             justifyContent: 'flex-end',
                                             width: '100%',
-                                            height: '70px',
-                                        }, children: (0, jsx_runtime_1.jsx)(ButtonComponent, { onClick: () => setIsChartBuilderOpen(true), label: addToDashboardButtonLabel, disabled: !!errorMessage }) }))] })] }) }) })), (0, jsx_runtime_1.jsx)(ChartBuilder_1.ChartBuilderWithModal, { rows: rows, columns: columns, query: query, isHorizontalView: isChartBuilderHorizontalView, isOpen: isChartBuilderOpen, setIsOpen: setIsChartBuilderOpen, onAddToDashboardComplete: onAddToDashboardComplete, showTableFormatOptions: showTableFormatOptions, showDateFieldOptions: showDateFieldOptions, showAccessControlOptions: showAccessControlOptions, destinationDashboard: destinationDashboard, title: chartBuilderTitle, buttonLabel: addToDashboardButtonLabel, report: tempReport ?? report, pivot: tempReport?.pivot ?? undefined, pivotData: tempReport?.pivotRows && tempReport?.pivotColumns
+                                            gap: 12,
+                                            marginTop: 15,
+                                            marginBottom: 5,
+                                        }, children: [onDiscardChanges && ((0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: onDiscardChanges, label: "Discard changes" })), addToDashboardButtonLabel !== 'Add to dashboard' && ((0, jsx_runtime_1.jsx)(ButtonComponent, { onClick: () => {
+                                                    onSaveChanges && onSaveChanges();
+                                                    setIsChartBuilderOpen(true);
+                                                }, label: addToDashboardButtonLabel, disabled: !!errorMessage ||
+                                                    !(rows.length > 0 && lastSuccessfulQuery === query) }))] }))] })] }) }) })), (!isChartBuilderHorizontalView || isChartBuilderOpen) && ((0, jsx_runtime_1.jsx)(ChartBuilder_1.ChartBuilderWithModal, { rows: rows, columns: columns, query: query, isHorizontalView: isChartBuilderHorizontalView, isOpen: isChartBuilderOpen, setIsOpen: setIsChartBuilderOpen, onAddToDashboardComplete: onAddToDashboardComplete, showTableFormatOptions: showTableFormatOptions, showDateFieldOptions: showDateFieldOptions, showAccessControlOptions: showAccessControlOptions, isAdmin: isAdminEnabled, destinationDashboard: destinationDashboard, title: chartBuilderTitle, buttonLabel: addToDashboardButtonLabel, report: tempReport ?? report, pivot: tempReport?.pivot ?? undefined, pivotData: tempReport?.pivotRows && tempReport?.pivotColumns
                     ? {
                         rows: tempReport.pivotRows,
                         columns: tempReport.pivotColumns,
                     }
-                    : undefined, organizationName: organizationName, CardComponent: CardComponent, TableComponent: TableComponent, ModalComponent: ModalComponent, ButtonComponent: ButtonComponent, TextInputComponent: TextInputComponent, SelectComponent: SelectComponent, SecondaryButtonComponent: SecondaryButtonComponent, HeaderComponent: HeaderComponent, SubHeaderComponent: SubHeaderComponent, LabelComponent: LabelComponent, TextComponent: TextComponent, PopoverComponent: PopoverComponent, DeleteButtonComponent: DeleteButtonComponent, LoadingComponent: LoadingComponent, ChartBuilderInputRowContainer: ChartBuilderInputRowContainer, ChartBuilderInputColumnContainer: ChartBuilderInputColumnContainer, ErrorMessageComponent: ErrorMessageComponent, PivotRowContainer: PivotRowContainer, PivotColumnContainer: PivotColumnContainer, FormContainer: ChartBuilderFormContainer, hideDateRangeFilter: true, onClickChartElement: onClickChartElement, rowCount: rowCount, onPageChange: onPageChange, onSortChange: onSortChange, isLoading: sqlQueryLoading })] }));
+                    : undefined, organizationName: organizationName, CardComponent: CardComponent, TableComponent: TableComponent, ModalComponent: ModalComponent, ButtonComponent: ButtonComponent, TextInputComponent: TextInputComponent, SelectComponent: SelectComponent, SecondaryButtonComponent: SecondaryButtonComponent, HeaderComponent: HeaderComponent, SubHeaderComponent: SubHeaderComponent, LabelComponent: LabelComponent, TextComponent: TextComponent, PopoverComponent: PopoverComponent, DeleteButtonComponent: DeleteButtonComponent, LoadingComponent: LoadingComponent, ChartBuilderInputRowContainer: ChartBuilderInputRowContainer, ChartBuilderInputColumnContainer: ChartBuilderInputColumnContainer, ErrorMessageComponent: ErrorMessageComponent, PivotRowContainer: PivotRowContainer, PivotColumnContainer: PivotColumnContainer, FormContainer: ChartBuilderFormContainer, hideDateRangeFilter: true, onClickChartElement: onClickChartElement, rowCount: rowCount, onPageChange: onPageChange, onSortChange: onSortChange, isLoading: sqlQueryLoading, isEditingMode: true }))] }));
 }
 exports.default = SQLEditor;
-const SQLEditorComponent = ({ query, schema, databaseType, clientName, setQuery, setEditorMounted, handleRunQuery, handleClearQuery, defineEditorTheme, setEditorTheme, ButtonComponent, SecondaryButtonComponent, isNewQueryEnabled, theme, loading, LoadingComponent = UiComponents_1.QuillLoadingComponent, }) => {
+const SQLEditorComponent = ({ query, schema, databaseType, clientName, setQuery, setEditorMounted, handleRunQuery, defineEditorTheme, setEditorTheme, runQueryOnMount = false, theme, loading, LoadingComponent = UiComponents_1.QuillLoadingComponent, }) => {
     const [editorKey, setEditorKey] = (0, react_1.useState)(0);
-    const [currentProvider, setCurrentProvider] = (0, react_1.useState)(null);
+    const currentProvider = (0, react_1.useRef)(null);
     (0, react_1.useEffect)(() => {
-        if (currentProvider) {
-            currentProvider.dispose();
-        }
-        if (schema && schema.length !== 0) {
-            setEditorKey((prevKey) => prevKey + 1);
+        if (currentProvider.current) {
+            currentProvider.current.dispose();
+            if (schema && schema.length !== 0) {
+                setEditorKey((prevKey) => prevKey + 1);
+            }
         }
-    }, [schema, clientName]);
-    return ((0, jsx_runtime_1.jsxs)("div", { style: {
+        return () => {
+            currentProvider.current?.dispose();
+        };
+    }, [schema, clientName, databaseType]);
+    return ((0, jsx_runtime_1.jsx)("div", { style: {
             // maxHeight: 700,
             width: '100%',
             height: '100%',
@@ -373,31 +440,29 @@ const SQLEditorComponent = ({ query, schema, databaseType, clientName, setQuery,
             borderTopRightRadius: 0,
             borderBottomRightRadius: 0,
             overflow: 'hidden',
-        }, children: [loading ? ((0, jsx_runtime_1.jsx)("div", { style: {
-                    height: 'calc(100% - 70px)',
-                    width: '100%',
-                    display: 'flex',
-                    alignItems: 'center',
-                    justifyContent: 'center',
-                    background: '#F9F9F9',
-                }, children: (0, jsx_runtime_1.jsx)(LoadingComponent, {}) })) : ((0, jsx_runtime_1.jsx)(react_2.default, { height: "calc(100% - 70px)", width: "100%", defaultLanguage: clientName, defaultValue: "", language: clientName, value: query, loading: (0, jsx_runtime_1.jsx)("div", {}), options: {
-                    wordWrap: 'on',
-                    minimap: {
-                        enabled: false,
-                    },
-                    padding: { top: 16 },
-                }, onChange: (query) => setQuery(query || ''), beforeMount: (monaco) => defineEditorTheme(monaco, theme), onMount: (_editor, monaco) => {
-                    const disposable = setEditorTheme(_editor, monaco, schema, databaseType, clientName);
-                    setCurrentProvider(disposable);
-                    setEditorMounted();
-                } }, editorKey)), (0, jsx_runtime_1.jsx)("div", { style: {
-                    display: 'flex',
-                    flexDirection: 'row',
-                    alignItems: 'center',
-                    height: 70,
-                }, children: (0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', gap: 12 }, children: [(0, jsx_runtime_1.jsx)(ButtonComponent, { onClick: handleRunQuery, label: "Run query" }), isNewQueryEnabled && ((0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: handleClearQuery, label: "Clear query" }))] }) })] }));
+        }, children: loading ? ((0, jsx_runtime_1.jsx)("div", { style: {
+                height: '100%',
+                width: '100%',
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+                background: '#F9F9F9',
+            }, children: (0, jsx_runtime_1.jsx)(LoadingComponent, {}) })) : ((0, jsx_runtime_1.jsx)(react_2.default, { height: "100%", width: "100%", defaultLanguage: clientName, defaultValue: "", language: clientName, value: query, loading: (0, jsx_runtime_1.jsx)("div", {}), options: {
+                wordWrap: 'on',
+                minimap: {
+                    enabled: false,
+                },
+                padding: { top: 16 },
+            }, onChange: (query) => setQuery(query || ''), beforeMount: (monaco) => defineEditorTheme(monaco, theme), onMount: (_editor, monaco) => {
+                currentProvider.current = setEditorTheme(_editor, monaco, schema, databaseType, clientName);
+                setEditorMounted();
+                if (runQueryOnMount) {
+                    handleRunQuery();
+                }
+                _editor.focus();
+            } }, editorKey)) }));
 };
-const SchemaListComponent = ({ schema, theme, loading, LoadingComponent, width, onClick, }) => {
+const SchemaListComponent = ({ schema, theme, loading, LoadingComponent, width, onClick, style, }) => {
     if (loading) {
         return ((0, jsx_runtime_1.jsxs)("div", { style: {
                 // maxHeight: 700,
@@ -412,11 +477,13 @@ const SchemaListComponent = ({ schema, theme, loading, LoadingComponent, width,
                 display: 'flex',
                 // alignItems: 'center',
                 justifyContent: 'center',
+                ...style,
             }, children: [(0, jsx_runtime_1.jsx)("div", { style: { height: 100 } }), LoadingComponent && (0, jsx_runtime_1.jsx)(LoadingComponent, {}), !LoadingComponent && ((0, jsx_runtime_1.jsxs)("svg", { width: "24", height: "24", children: [(0, jsx_runtime_1.jsx)("circle", { cx: "12", cy: "12", r: "9.375", strokeWidth: "3.75", strokeDasharray: "calc(2 * 3.14 * 9.375 / 3) calc(2 * 3.14 * 9.375 * 2 / 3)", strokeDashoffset: "calc(2 * 3.14 * 9.375 / 6)", stroke: theme?.primaryTextColor || '#364153', fill: "none", transform: "rotate(-90 12 12)", children: (0, jsx_runtime_1.jsx)("animateTransform", { attributeName: "transform", attributeType: "XML", type: "rotate", from: "-180 12 12", to: "180 12 12", dur: "0.8s", repeatCount: "indefinite" }) }), (0, jsx_runtime_1.jsx)("circle", { cx: "12", cy: "12", r: "9.375", strokeWidth: "3.75", strokeDasharray: "calc(2 * 3.14 * 9.375 / 3) calc(2 * 3.14 * 9.375 * 1 / 3)", strokeDashoffset: "calc(2 * 3.14 * 9.375 / 3) calc(2 * 3.14 * 9.375 * 2 / 3)", stroke: '#ADB1B9', fill: "none", transform: "rotate(90 12 12)", children: (0, jsx_runtime_1.jsx)("animateTransform", { attributeName: "transform", attributeType: "XML", type: "rotate", from: "0 12 12", to: "360 12 12", dur: "0.8s", repeatCount: "indefinite" }) })] }))] }));
     }
     return ((0, jsx_runtime_1.jsx)("div", { style: {
             // maxHeight: 700,
             width: width || 250,
+            maxWidth: 350,
             minWidth: 250,
             overflowY: 'auto',
             height: '100%',

package/dist/cjs/Table.js

@@ -64,7 +64,7 @@ const ChartUpdater = ({ reportId, containerStyle, className, dashboardContext, c
     const [loading, setLoading] = (0, react_1.useState)(false);
     const [initialLoad, setInitialLoad] = (0, react_1.useState)(true);
     const { downloadCSV } = (0, useExport_1.useExport)(reportId);
-    const [customFields] = (0, react_1.useContext)(Context_1.CustomFieldContext);
+    const [schemaData] = (0, react_1.useContext)(Context_1.SchemaDataContext);
     const [rows, setRows] = (0, react_1.useState)([]);
     const [columns, setColumns] = (0, react_1.useState)([]);
     const [tableFilters, setTableFilters] = (0, react_1.useState)([]);
@@ -103,7 +103,7 @@ const ChartUpdater = ({ reportId, containerStyle, className, dashboardContext, c
             setLoading(true);
             try {
                 const updatedProcessing = { ...currentProcessing, ...processing };
-                const paginatedRows = await (0, tableProcessing_1.fetchTableByReport)(reportId, client, updatedProcessing, tableFilters, customFields);
+                const paginatedRows = await (0, tableProcessing_1.fetchTableByReport)(reportId, client, updatedProcessing, tableFilters, schemaData.customFields);
                 if (paginatedRows.error) {
                     throw new Error('Error fetching chart');
                 }
@@ -125,7 +125,7 @@ const ChartUpdater = ({ reportId, containerStyle, className, dashboardContext, c
     };
     const fetchReportHelper = async (useReportTask = true, reportFilters, processing) => {
         setLoading(true);
-        const { report, error } = await (0, report_1.fetchReport)(reportId, client, useReportTask, reportFilters ? reportFilters.filters : [], processing, undefined, customFields);
+        const { report, error } = await (0, report_1.fetchReport)(reportId, client, useReportTask, reportFilters ? reportFilters.filters : [], processing, undefined, schemaData.customFields);
         if (error) {
             setLoading(false);
             setInitialLoad(false);

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

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

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

@@ -10,26 +10,7 @@ const axisFormatter_1 = require("../../utils/axisFormatter");
 const color_1 = require("../../utils/color");
 const ChartTooltip_1 = __importDefault(require("../../components/Chart/ChartTooltip"));
 const getDomain_1 = __importDefault(require("../../utils/getDomain"));
-const react_1 = require("react");
 function BarChart({ colors, colorMap, yAxisFields, data, containerStyle, className, xAxisField, xAxisFormat, theme, comparison, isStacked, isAnimationActive = true, hideXAxis = false, hideYAxis = false, hideCartesianGrid = false, onClickChartElement, dateFilter, }) {
-    const [formattedData, setFormattedData] = (0, react_1.useState)(data);
-    (0, react_1.useEffect)(() => {
-        setFormattedData(data);
-        if (!data || data.length === 0) {
-            let barChartData = [];
-            if (dateFilter && (!barChartData || barChartData.length === 0)) {
-                const xAxis = xAxisField || '';
-                const endDate = (0, valueFormatter_1.quillFormat)({
-                    value: dateFilter?.endDate,
-                    format: xAxisFormat,
-                });
-                const yAxis = yAxisFields[0]?.field;
-                barChartData = [{ [xAxis]: endDate, [yAxis]: '0' }];
-            }
-            setFormattedData(barChartData);
-            return;
-        }
-    }, [data]);
     const getCustomColor = (field) => {
         const key = field.startsWith('comparison_') ? 'comparison' : 'primary';
         field = field.replace('comparison_', '');
@@ -39,15 +20,15 @@ function BarChart({ colors, colorMap, yAxisFields, data, containerStyle, classNa
         return colorMap?.[field]?.[key];
     };
     const sortYAxisFields = (fields) => {
-        if (formattedData.length > 0) {
+        if (data?.length > 0) {
             fields = fields
-                .sort((a, b) => Object.keys(formattedData[0]).indexOf(a.field) -
-                Object.keys(formattedData[0]).indexOf(b.field))
+                .sort((a, b) => Object.keys(data[0]).indexOf(a.field) -
+                Object.keys(data[0]).indexOf(b.field))
                 .filter((field) => comparison || !field.field.startsWith('comparison_'));
         }
         return fields;
     };
-    if (!formattedData || formattedData.length === 0) {
+    if (!data || data.length === 0) {
         return ((0, jsx_runtime_1.jsx)("div", { style: {
                 display: 'flex',
                 flex: '1 0 auto',
@@ -58,12 +39,12 @@ function BarChart({ colors, colorMap, yAxisFields, data, containerStyle, classNa
                 fontSize: 13,
                 color: theme.secondaryTextColor,
                 ...containerStyle,
-            }, className: className, children: "No results found for specified time period." }));
+            }, className: className, children: "No results" }));
     }
     return ((0, jsx_runtime_1.jsx)("div", { style: {
             boxSizing: 'content-box',
             ...containerStyle,
-        }, className: className, children: (0, jsx_runtime_1.jsx)(recharts_1.ResponsiveContainer, { width: "100%", height: '100%', children: (0, jsx_runtime_1.jsxs)(recharts_1.BarChart, { data: formattedData, layout: 'horizontal', children: [!hideCartesianGrid && ((0, jsx_runtime_1.jsx)(recharts_1.CartesianGrid, { horizontal: true, vertical: false, stroke: "#e5e7eb" })), (0, jsx_runtime_1.jsx)(recharts_1.YAxis, { width: 44, hide: hideYAxis, axisLine: false, tickLine: false, type: "number", domain: (0, getDomain_1.default)(data, yAxisFields), tick: { transform: 'translate(-3, 0)' }, tickCount: 5, style: {
+        }, className: className, children: (0, jsx_runtime_1.jsx)(recharts_1.ResponsiveContainer, { width: "100%", height: '100%', children: (0, jsx_runtime_1.jsxs)(recharts_1.BarChart, { data: data ?? [], layout: 'horizontal', children: [!hideCartesianGrid && ((0, jsx_runtime_1.jsx)(recharts_1.CartesianGrid, { horizontal: true, vertical: false, stroke: "#e5e7eb" })), (0, jsx_runtime_1.jsx)(recharts_1.YAxis, { width: 44, hide: hideYAxis, axisLine: false, tickLine: false, type: "number", domain: (0, getDomain_1.default)(data, yAxisFields), tick: { transform: 'translate(-3, 0)' }, tickCount: 5, style: {
                             fontSize: '12px',
                             fontFamily: theme.chartLabelFontFamily,
                         }, tickFormatter: (tick) => {