@quillsql/admin 1.6.1 → 1.6.2

package/dist/esm/modals/PromoteReportModal.js

@@ -0,0 +1,125 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { useAdmin } from '../AdminProvider';
+import { useDashboards } from '@quillsql/react';
+export default function PromoteReportModal({ ModalComponent, HeaderComponent, ButtonComponent, SelectComponent, CheckboxComponent, isOpen, setIsOpen, reportId, currentClientId, currentDashboardName, }) {
+    const { state, quillFetchWithToken } = useAdmin();
+    const { dashboards } = useDashboards();
+    const [selectedClientId, setSelectedClientId] = useState(currentClientId);
+    const [dashboardName, setDashboardName] = useState(null);
+    const [autoPromoteVirtualTables, setAutoPromoteVirtualTables] = useState(true);
+    const [dashboardNameMap, setDashboardNameMap] = useState({ [currentClientId]: dashboards?.map((d) => d.name) || [] });
+    const getDashboardNames = async (clientId) => {
+        const { data } = await quillFetchWithToken({
+            client: {
+                queryEndpoint: state.queryEndpoint,
+                queryHeaders: state.queryHeaders,
+                clientId,
+                withCredentials: !!state.withCredentials,
+            },
+            task: 'dashnames',
+            metadata: {
+                clientId,
+            },
+            adminMode: true,
+        });
+        setDashboardNameMap((prev) => ({
+            ...prev,
+            [clientId]: data.dashboardNames || [],
+        }));
+    };
+    const handlePromote = async (skipWarning = false) => {
+        if (!selectedClientId) {
+            return;
+        }
+        try {
+            const respJson = await quillFetchWithToken({
+                client: {
+                    queryEndpoint: state.queryEndpoint,
+                    clientId: currentClientId,
+                    queryHeaders: state.queryHeaders,
+                    withCredentials: !!state.withCredentials,
+                },
+                task: 'promote-item',
+                metadata: {
+                    clientId: currentClientId,
+                    fromClientId: currentClientId,
+                    toClientId: selectedClientId,
+                    dashboardName: dashboardName,
+                    itemId: reportId,
+                    skipWarning,
+                    addMissingTables: autoPromoteVirtualTables,
+                },
+                adminMode: true,
+            });
+            if (respJson?.error) {
+                alert(respJson?.error);
+                return;
+            }
+            const data = respJson?.data;
+            if (data.error) {
+                alert(data.error);
+                return;
+            }
+            else if (data.tableErrors?.length > 0) {
+                alert(`Could not promote report:\n\n${data.tableErrors
+                    .map((error) => {
+                    return `Error promoting virtual table ${error.table}: ${error.error}`;
+                })
+                    .join('\n\n')}`);
+                return;
+            }
+            else if (!skipWarning && data.warning) {
+                if (confirm(`${data.warning}\n\nContinue?`)) {
+                    handlePromote(true);
+                }
+                return;
+            }
+            alert('Report promoted successfully.');
+        }
+        catch (error) {
+            console.error('Promotion failed:', error);
+        }
+    };
+    return (_jsx(ModalComponent, { isOpen: isOpen, onClose: () => {
+            setIsOpen(false);
+        }, setIsOpen: setIsOpen, width: 500, children: _jsxs("div", { style: {
+                display: 'flex',
+                flexDirection: 'column',
+                boxSizing: 'border-box',
+                maxHeight: 600,
+            }, children: [_jsx(HeaderComponent, { label: "Promote Report" }), _jsx("div", { id: "promote-report-description", style: { marginBottom: 16 }, children: "Copy this report to another dashboard." }), _jsxs("div", { style: {
+                        display: 'flex',
+                        flexDirection: 'column',
+                        gap: 12,
+                    }, children: [_jsxs("div", { style: { display: 'flex', flexDirection: 'row', gap: 12 }, children: [_jsx(SelectComponent, { options: state.clients.map((client) => {
+                                        return { label: client.name, value: client._id };
+                                    }), onChange: (e) => {
+                                        const id = e.target.value;
+                                        setSelectedClientId(id);
+                                        if (id && !dashboardNameMap[id]) {
+                                            getDashboardNames(id);
+                                        }
+                                    }, value: selectedClientId, theme: state.theme, width: 200 }), _jsx(SelectComponent, { options: (dashboardNameMap[selectedClientId || ''] || [])
+                                        .filter((name) => selectedClientId !== currentClientId ||
+                                        name !== currentDashboardName)
+                                        .map((name) => {
+                                        return { label: name, value: name };
+                                    }), onChange: (e) => {
+                                        const name = e.target.value;
+                                        setDashboardName(name);
+                                    }, isLoading: dashboardNameMap[selectedClientId || ''] === undefined, value: dashboardName, theme: state.theme, width: 200 })] }), _jsxs("div", { style: {
+                                display: 'flex',
+                                justifyContent: 'space-between',
+                                gap: 12,
+                            }, children: [_jsx(CheckboxComponent, { label: "Add missing tables", isChecked: autoPromoteVirtualTables, onChange: () => {
+                                        setAutoPromoteVirtualTables(!autoPromoteVirtualTables);
+                                    }, labelStyle: {
+                                        color: '#666666',
+                                        fontSize: '13px',
+                                        fontWeight: 400,
+                                    } }), _jsx(ButtonComponent, { onClick: () => {
+                                        handlePromote();
+                                        setIsOpen(false);
+                                    }, label: "Promote Report", disabled: !selectedClientId || !dashboardName, width: 160 })] })] })] }) }));
+}

package/dist/esm/modals/PromoteViewModal.d.ts

@@ -1,14 +1,14 @@
-/// <reference types="react" />
-interface PromoteViewModalProps {
+interface PromoteVirtualTableProps {
     ModalComponent: React.ComponentType<any>;
+    HeaderComponent: React.ComponentType<any>;
+    ButtonComponent: React.ComponentType<any>;
     isOpen: boolean;
     setIsOpen: (isOpen: boolean) => void;
     clientId: string;
     client: any;
-    views: any[];
+    view: string;
     clients: any[];
-    parentRef: any;
 }
-export default function PromoteViewModal({ ModalComponent, isOpen, setIsOpen, clientId, client, clients, views, parentRef, }: PromoteViewModalProps): import("react/jsx-runtime").JSX.Element;
+export default function PromoteVirtualTableModal({ ModalComponent, HeaderComponent, ButtonComponent, isOpen, setIsOpen, clientId, client, clients, view, }: PromoteVirtualTableProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=PromoteViewModal.d.ts.map

package/dist/esm/modals/PromoteViewModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PromoteViewModal.d.ts","sourceRoot":"","sources":["../../../src/modals/PromoteViewModal.tsx"],"names":[],"mappings":";AAOA,UAAU,qBAAqB;IAC7B,cAAc,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;IACzC,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,GAAG,CAAC;IACZ,KAAK,EAAE,GAAG,EAAE,CAAC;IACb,OAAO,EAAE,GAAG,EAAE,CAAC;IACf,SAAS,EAAE,GAAG,CAAC;CAChB;AAgED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,cAAc,EACd,MAAM,EACN,SAAS,EACT,QAAQ,EACR,MAAM,EACN,OAAO,EACP,KAAK,EACL,SAAS,GACV,EAAE,qBAAqB,2CAuGvB"}
+{"version":3,"file":"PromoteViewModal.d.ts","sourceRoot":"","sources":["../../../src/modals/PromoteViewModal.tsx"],"names":[],"mappings":"AAIA,UAAU,wBAAwB;IAChC,cAAc,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;IACzC,eAAe,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;IAC1C,eAAe,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;IAC1C,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,GAAG,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,GAAG,EAAE,CAAC;CAChB;AAED,MAAM,CAAC,OAAO,UAAU,wBAAwB,CAAC,EAC/C,cAAc,EACd,eAAe,EACf,eAAe,EACf,MAAM,EACN,SAAS,EACT,QAAQ,EACR,MAAM,EACN,OAAO,EACP,IAAI,GACL,EAAE,wBAAwB,2CA2H1B"}

package/dist/esm/modals/PromoteViewModal.js

@@ -1,115 +1,79 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { theme } from '../Admin';
-import { DropDownMenu } from '../components';
-import { useEffect, useRef, useState } from 'react';
-import { QUILL_SERVER } from '../utils/constants';
-import { QuillSelectComponent } from '../components/QuillSelect';
-const createStyles = (theme) => ({
-    modalContent: {
-        display: 'flex',
-        flexDirection: 'column',
-    },
-    modalHeader: {
-        fontWeight: '600',
-        fontSize: 20,
-        paddingBottom: 4,
-        color: theme.primaryTextColor,
-    },
-    container: {
-        display: 'flex',
-        flexDirection: 'column',
-        justifyContent: 'flex-start',
-        alignItems: 'flex-start',
-        gap: '5px',
-        marginTop: 20,
-    },
-    multiContainer: {
-        display: 'flex',
-        flexDirection: 'row',
-        justifyContent: 'space-between',
-        alignItems: 'center',
-        gap: '20px',
-        marginTop: 20,
-    },
-    header: {
-        fontSize: theme.fontSize,
-        paddingTop: '0px',
-        marginTop: '0px',
-        marginBottom: '0px',
-        fontWeight: theme.labelFontWeight,
-        color: theme.primaryTextColor,
-    },
-    text: {
-        fontSize: theme.fontSize,
-        paddingTop: '0px',
-        marginTop: '0px',
-        marginBottom: '4px',
-        fontWeight: theme.labelFontWeight,
-        color: theme.secondaryTextColor,
-    },
-    group: {
-        display: 'flex',
-        flexDirection: 'column',
-        alignItems: 'start',
-        gap: '5px',
-    },
-    button: {
-        flexGrow: 1,
-        fontSize: theme.fontSize,
-        fontWeight: '600',
-        padding: '10px 20px',
-        marginTop: 20,
-        backgroundColor: theme.primaryButtonColor,
-        borderRadius: '5px',
-        color: theme.primaryButtonTextColor,
-        width: '40px',
-    },
-});
-export default function PromoteViewModal({ ModalComponent, isOpen, setIsOpen, clientId, client, clients, views, parentRef, }) {
-    const [modalSelectedView, setModalSelectedView] = useState(views[0]);
-    const [selectedToClient, setSelectedToClient] = useState(clients[0]);
-    const modalRef = useRef(null);
+import { useEffect, useState } from 'react';
+import { QuillSelectComponentWithCombo } from '../components/QuillSelectWithCombo';
+import { useAdmin } from '../AdminProvider';
+export default function PromoteVirtualTableModal({ ModalComponent, HeaderComponent, ButtonComponent, isOpen, setIsOpen, clientId, client, clients, view, }) {
+    const { state, quillFetchWithToken } = useAdmin();
+    const [selectedClientId, setClientId] = useState(undefined);
     useEffect(() => {
-        setModalSelectedView(views[0]);
-        setSelectedToClient(clients[0]);
-    }, [views, clients]);
-    const styles = createStyles(theme);
-    const handlePromote = async () => {
+        setClientId(clients[0].id);
+    }, [clients]);
+    const handlePromote = async (skipWarning = false) => {
+        if (!selectedClientId) {
+            return;
+        }
         try {
-            const response = await fetch(`${QUILL_SERVER}/promote_view/`, {
-                method: 'POST',
-                headers: {
-                    'Content-Type': 'application/json',
-                    Authorization: 'Bearer ',
+            const respJson = await quillFetchWithToken({
+                client: {
+                    queryEndpoint: state.queryEndpoint,
+                    queryHeaders: state.queryHeaders,
+                    clientId,
+                    withCredentials: !!state.withCredentials,
                 },
-                body: JSON.stringify({
-                    viewName: modalSelectedView.name,
+                task: 'promote-view',
+                metadata: {
+                    clientId,
+                    viewName: view,
                     fromClientId: clientId,
-                    toClientId: selectedToClient._id,
-                }),
+                    toClientId: selectedClientId,
+                    skipWarning,
+                },
+                adminMode: true,
             });
-            if (!response.ok) {
-                throw new Error('API request failed');
+            if (respJson?.error) {
+                alert(respJson?.error);
+                return;
+            }
+            const data = respJson?.data;
+            if (data.error) {
+                alert(data.error);
+                return;
             }
-            const data = await response.json();
+            else if (!skipWarning && data.warning) {
+                if (confirm(`${data.warning}\n\nContinue?`)) {
+                    handlePromote(true);
+                }
+                return;
+            }
+            alert('Virtual Table promoted successfully.');
         }
         catch (error) {
             console.error('Promotion failed:', error);
         }
     };
-    return (_jsx(ModalComponent, { isOpen: isOpen, setIsOpen: setIsOpen, title: 'Promote Changes', width: 500, children: _jsxs("div", { style: {
+    return (_jsx(ModalComponent, { isOpen: isOpen, onClose: () => {
+            setIsOpen(false);
+        }, setIsOpen: setIsOpen, title: 'Promote Changes', width: 500, children: _jsxs("div", { style: {
                 display: 'flex',
                 flexDirection: 'column',
-                padding: '20px',
                 boxSizing: 'border-box',
                 maxHeight: 600,
-            }, ref: modalRef, children: [_jsx(QuillSelectComponent, { options: views.map((v) => ({ label: v.name, value: v })), onChange: setModalSelectedView, value: modalSelectedView, theme: theme, label: "SQL View:" }), _jsxs("div", { style: styles.multiContainer, children: [_jsxs("div", { style: styles.group, children: [_jsx("h1", { style: styles.header, children: "From:" }), _jsx("div", { style: styles.text, children: _jsx(DropDownMenu, { items: [client], setSelected: () => { }, selected: client, theme: theme, disabled: true }) })] }), _jsx(QuillSelectComponent, { options: clients.map((c) => ({ label: c.name, value: c })), onChange: setSelectedToClient, value: selectedToClient, theme: theme, label: "To:" })] }), _jsx("div", { style: {
+            }, children: [_jsx(HeaderComponent, { label: "Promote Virtual Table" }), _jsxs("div", { style: {
+                        display: 'flex',
+                        flexDirection: 'row',
+                        gap: 12,
+                        marginTop: 12,
+                    }, children: [_jsx(QuillSelectComponentWithCombo, { options: [{ label: client.name, value: clientId }], onChange: () => { }, value: clientId, disabled: true, width: 200, label: "From:" }), _jsx(QuillSelectComponentWithCombo, { options: clients
+                                .filter((c) => c._id !== clientId)
+                                .map((c) => ({ label: c.name, value: c._id })), onChange: (e) => {
+                                setClientId(e.target.value);
+                            }, value: selectedClientId, width: 200, label: "To:" })] }), _jsx("div", { style: {
                         display: 'flex',
-                        justifyContent: 'flex-start',
+                        justifyContent: 'flex-end',
                         alignItems: 'center',
-                        width: 200,
-                    }, children: _jsx("button", { style: styles.button, onClick: () => {
+                        marginTop: 12,
+                    }, children: _jsx(ButtonComponent, { onClick: () => {
                             handlePromote();
                             setIsOpen(false);
-                        }, children: "Promote SQL View" }) })] }) }));
+                        }, label: "Promote Virtual Table", disabled: !selectedClientId, width: 160 }) })] }) }));
 }

package/dist/esm/modals/ReorderDashboardModal.d.ts

@@ -1,4 +1,4 @@
-export default function ReorderDashboardModal({ isOpen, setIsOpen, client, onSave, ModalComponent, ButtonComponent, selectedDashboard, organizationId, }: {
+export default function ReorderDashboardModal({ isOpen, setIsOpen, client, onSave, ModalComponent, ButtonComponent, selectedDashboard, }: {
     isOpen: any;
     setIsOpen: any;
     client: any;
@@ -6,6 +6,5 @@ export default function ReorderDashboardModal({ isOpen, setIsOpen, client, onSav
     ModalComponent: any;
     ButtonComponent: any;
     selectedDashboard: any;
-    organizationId: any;
 }): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ReorderDashboardModal.d.ts.map

package/dist/esm/modals/ReorderDashboardModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ReorderDashboardModal.d.ts","sourceRoot":"","sources":["../../../src/modals/ReorderDashboardModal.tsx"],"names":[],"mappings":"AA0BA,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAC5C,MAAM,EACN,SAAS,EACT,MAAM,EACN,MAAM,EACN,cAAc,EACd,eAAe,EACf,iBAAiB,EACjB,cAAc,GACf;;;;;;;;;CAAA,2CAqLA"}
+{"version":3,"file":"ReorderDashboardModal.d.ts","sourceRoot":"","sources":["../../../src/modals/ReorderDashboardModal.tsx"],"names":[],"mappings":"AAyBA,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAC5C,MAAM,EACN,SAAS,EACT,MAAM,EACN,MAAM,EACN,cAAc,EACd,eAAe,EACf,iBAAiB,GAClB;;;;;;;;CAAA,2CA6LA"}

package/dist/esm/modals/ReorderDashboardModal.js

@@ -2,14 +2,15 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // @ts-nocheck
 import { useEffect, useState } from 'react';
 import { useAdmin } from '../AdminProvider';
-import { QUILL_SERVER } from '../utils/constants';
+import { QUILL_SERVER, SINGLE_TENANT } from '../utils/constants';
 import { arrayMove, rectSortingStrategy, SortableContext, sortableKeyboardCoordinates, useSortable, } from '@dnd-kit/sortable';
 import { CSS } from '@dnd-kit/utilities';
 import { DndContext, closestCenter, KeyboardSensor, PointerSensor, useSensor, useSensors, TouchSensor, } from '@dnd-kit/core';
 import { Chart } from '@quillsql/react';
 import { LoadingSpinner } from '../components/UiComponents';
-export default function ReorderDashboardModal({ isOpen, setIsOpen, client, onSave, ModalComponent, ButtonComponent, selectedDashboard, organizationId, }) {
-    const { state } = useAdmin();
+// TODO: DEPRECATED
+export default function ReorderDashboardModal({ isOpen, setIsOpen, client, onSave, ModalComponent, ButtonComponent, selectedDashboard, }) {
+    const { state, quillFetchWithToken } = useAdmin();
     const [sections, setSections] = useState([]);
     const [metrics, setMetrics] = useState({});
     const [charts, setCharts] = useState({});
@@ -17,23 +18,30 @@ export default function ReorderDashboardModal({ isOpen, setIsOpen, client, onSav
     const [loading, setLoading] = useState(false);
     useEffect(() => {
         async function getDashboardItems() {
-            const { _id, environment } = state.client;
             setLoading(true);
-            const url = new URL(`${QUILL_SERVER}/dashconfig`);
-            // Add query parameters to the URL
-            url.search = new URLSearchParams({
-                publicKey: _id,
-                orgId: organizationId,
-                name: selectedDashboard,
-            }).toString();
-            const response = await fetch(url, {
-                method: 'GET',
-                headers: {
-                    environment: environment || undefined,
+            const responseData = await quillFetchWithToken({
+                client: {
+                    queryEndpoint: state.queryEndpoint,
+                    clientId: state.client.id,
+                    queryHeaders: state.queryHeaders,
+                    withCredentials: !!state.withCredentials,
+                },
+                task: 'dashboard',
+                metadata: {
+                    name: selectedDashboard,
+                    clientId: state.client.id,
+                    databaseType: state.client.databaseType,
+                    useNewNodeSql: true,
+                    tenants: state.selectedTenantField === SINGLE_TENANT
+                        ? [SINGLE_TENANT]
+                        : state.currentTenantIdentity,
+                    flags: state.selectedTenantField === SINGLE_TENANT
+                        ? state.selectedTenantValues
+                        : undefined,
                 },
+                adminMode: true,
             });
-            const responseData = await response.json();
-            const sections = responseData.sections;
+            const sections = responseData.data.sections;
             setSections(Object.keys(sections));
             const isMetric = (elem) => elem.chartType === 'metric';
             const isChart = (elem) => !['metric', 'table'].includes(elem.chartType);
@@ -51,6 +59,7 @@ export default function ReorderDashboardModal({ isOpen, setIsOpen, client, onSav
         if (!client)
             return;
         try {
+            // THIS IS DEPRECATED BECAUSE THE COMPONENT ISN'T USED
             const response = await fetch(`${QUILL_SERVER}/dashorder/`, {
                 method: 'POST',
                 headers: {
@@ -64,6 +73,7 @@ export default function ReorderDashboardModal({ isOpen, setIsOpen, client, onSav
                         ...Object.values(tables).flat(),
                     ],
                 }),
+                credentials: state.withCredentials ? 'include' : 'omit',
             });
             if (!response.ok) {
                 const errorData = await response.json();
@@ -78,7 +88,7 @@ export default function ReorderDashboardModal({ isOpen, setIsOpen, client, onSav
             console.error(error.message);
         }
     };
-    return (_jsxs(ModalComponent, { isOpen: isOpen, close: () => setIsOpen(false), style: {
+    return (_jsxs(ModalComponent, { isOpen: isOpen, onClose: () => setIsOpen(false), style: {
             gap: 20,
             display: 'flex',
             flexDirection: 'column',
@@ -149,9 +159,13 @@ const SortableItem = (props) => {
                                     flexGrow: 1,
                                 }, children: props.value }), _jsx(HandleButton, {})] }), _jsx(Chart, { reportId: props.id, containerStyle: {
                             padding: 10,
-                            height: props.chartType === 'metric' ? 80 : 250,
+                            height: props.chartType === 'metric'
+                                ? 80
+                                : props.chartType === 'table'
+                                    ? 420
+                                    : 250,
                             width: 'calc(100% - 20px)',
-                        } })] }) }) }));
+                        }, hideFilters: true, hideDateRangeFilter: true })] }) }) }));
 };
 function ReorderableGrid({ type, section, items, setItems }) {
     if (!items)

package/dist/esm/modals/SavedQueriesModal.d.ts

@@ -0,0 +1,7 @@
+export default function SavedQueriesModal({ ModalComponent, isOpen, setIsOpen, }: {
+    ModalComponent: any;
+    isOpen: boolean;
+    setIsOpen: (isOpen: boolean) => void;
+    clientId: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SavedQueriesModal.d.ts.map

package/dist/esm/modals/SavedQueriesModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SavedQueriesModal.d.ts","sourceRoot":"","sources":["../../../src/modals/SavedQueriesModal.tsx"],"names":[],"mappings":"AAWA,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,cAAc,EACd,MAAM,EACN,SAAS,GACV,EAAE;IACD,cAAc,EAAE,GAAG,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,QAAQ,EAAE,MAAM,CAAC;CAClB,2CA0FA"}

package/dist/esm/modals/SavedQueriesModal.js

@@ -0,0 +1,125 @@
+import { createElement as _createElement } from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { useAdmin } from '../AdminProvider';
+import { Dashboard } from '@quillsql/react';
+import { SecondaryButtonPrimitive } from '../primitives';
+import { parseQuillReportToQuillReportInternal, } from '../utils/report';
+import { QuillToolTip } from '../components/UiComponents';
+import { Highlight, themes } from 'prism-react-renderer';
+export default function SavedQueriesModal({ ModalComponent, isOpen, setIsOpen, }) {
+    const parentRef = useRef(null);
+    const { dispatch } = useAdmin();
+    const [modalWidth, setModalWidth] = useState(200);
+    const [modalHeight, setModalHeight] = useState(200);
+    const handleResize = useCallback(() => {
+        const screenSize = window.innerWidth;
+        if (screenSize < 1200) {
+            setModalWidth(undefined); // use dynamic width of contents
+        }
+        else {
+            setModalWidth(window.innerWidth - 80);
+        }
+        setModalHeight(window.innerHeight - 80);
+    }, []);
+    useEffect(() => {
+        handleResize();
+        window.addEventListener('resize', handleResize);
+        return () => {
+            window.removeEventListener('resize', handleResize);
+        };
+    }, [handleResize]);
+    const dashboardSectionComponent = useMemo(() => {
+        return ({ children }) => (_jsx("div", { style: {
+                display: 'grid',
+                gridTemplateColumns: 'repeat(auto-fill, 300px)',
+                // gridTemplateRows: 'repeat(auto-fill, 130px)',
+                gap: 20,
+                marginTop: -20,
+            }, children: children }));
+    }, []);
+    return (_jsx("div", { ref: parentRef, children: _jsx(ModalComponent, { isOpen: isOpen, setIsOpen: setIsOpen, title: "Saved Queries", width: modalWidth, height: modalHeight, children: _jsx(Dashboard, { name: `quill-saved-queries`, containerStyle: { paddingLeft: 20, paddingRight: 20 }, EmptyDashboardComponent: () => (_jsxs("div", { style: {
+                        border: '1px #e7e7e7 solid',
+                        borderRadius: 6,
+                        gap: 12,
+                        padding: 20,
+                        marginLeft: 20,
+                        display: 'flex',
+                        flexDirection: 'column',
+                        maxWidth: 300,
+                    }, children: [_jsx("div", { style: {
+                                fontSize: 14,
+                                fontWeight: 500,
+                                color: 'rgb(54, 65, 83)',
+                            }, children: "No saved queries yet." }), _jsx(SecondaryButtonPrimitive, { label: "Create saved query \u2197", onClick: () => {
+                                dispatch({
+                                    type: 'SET_ACTIVE_COMPONENT',
+                                    payload: 'SQL Editor',
+                                });
+                            } })] })), DashboardSectionComponent: dashboardSectionComponent, TableComponent: ({ report }) => _jsx(SavedQueryTile, { report: report }) }) }) }));
+}
+function SavedQueryTile({ report }) {
+    const { state, dispatch, getToken } = useAdmin();
+    const [isOpenableByReportBuilder, setIsOpenableByReportBuilder] = useState(false);
+    useEffect(() => {
+        async function getIsOpenableByReportBuilder() {
+            const hello = await parseQuillReportToQuillReportInternal(report, state.client, state.tables, getToken);
+            if (hello.adminError) {
+                return;
+            }
+            setIsOpenableByReportBuilder(true);
+        }
+        getIsOpenableByReportBuilder();
+    }, []);
+    const handleOpenReportInReportBuilder = async () => {
+        dispatch({
+            type: 'SET_ACTIVE_COMPONENT',
+            payload: 'Report Builder',
+        });
+        dispatch({
+            type: 'SET_ACTIVE_SAVED_QUERY_REPORT_ID',
+            payload: report?.id,
+        });
+    };
+    const handleOpenReportInSQLEditor = async () => {
+        dispatch({
+            type: 'SET_ACTIVE_COMPONENT',
+            payload: 'SQL Editor',
+        });
+        dispatch({
+            type: 'SET_ACTIVE_QUERY',
+            payload: report?.queryString,
+        });
+    };
+    if (!report.queryString) {
+        return null;
+    }
+    return (_jsxs("div", { style: {
+            border: '1px #e7e7e7 solid',
+            borderRadius: 6,
+            gap: 12,
+            padding: 20,
+            display: 'flex',
+            flexDirection: 'column',
+        }, children: [_jsx("div", { style: {
+                    fontSize: 16,
+                    fontWeight: 600,
+                    color: 'rgb(54, 65, 83)',
+                }, children: report.name }), _jsx(SavedQuerySQL, { query: report.queryString }), !isOpenableByReportBuilder ? (_jsx(QuillToolTip, { containerStyle: { display: 'contents' }, text: "Query was created in the SQL Editor so it can't be opened in the Report Builder", enabled: true, children: _jsx(SecondaryButtonPrimitive, { label: "Open in Report Builder \u2197", disabled: true, onClick: handleOpenReportInReportBuilder }) })) : (_jsx(SecondaryButtonPrimitive, { label: "Open in Report Builder \u2197", onClick: handleOpenReportInReportBuilder })), _jsx(SecondaryButtonPrimitive, { label: "Open in SQL Editor \u2197", onClick: handleOpenReportInSQLEditor })] }));
+}
+function SavedQuerySQL({ query }) {
+    return (_jsx(Highlight, { theme: themes.nightOwlLight, code: query, language: "tsx", children: ({ className, tokens, style, getLineProps, getTokenProps }) => (_jsx("pre", { className: className, style: {
+                ...style,
+                // textAlign: 'left',
+                padding: '1em',
+                height: 90,
+                // width: '100%',
+                // width: 900,
+                borderRadius: 8,
+                overflow: 'auto',
+                border: '1px solid #e7e7e7',
+            }, children: tokens.map((line, i) => (_createElement("div", { ...getLineProps({ line }), key: i, style: {
+                // wordWrap: 'normal',
+                // whiteSpace: 'normal',
+                } }, line.map((token, key) => (_jsx("span", { ...getTokenProps({ token }) }, key)))))) })) }));
+}

package/dist/esm/modals/index.d.ts

@@ -1,4 +1,3 @@
-export { default as PromoteDashModal } from './PromoteDashModal';
 export { default as PromoteViewModal } from './PromoteViewModal';
 export { default as ReorderDashboardModal } from './ReorderDashboardModal';
 //# sourceMappingURL=index.d.ts.map

package/dist/esm/modals/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/modals/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/modals/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC"}

package/dist/esm/modals/index.js

@@ -1,3 +1,2 @@
-export { default as PromoteDashModal } from './PromoteDashModal';
 export { default as PromoteViewModal } from './PromoteViewModal';
 export { default as ReorderDashboardModal } from './ReorderDashboardModal';

package/dist/esm/primitives/ButtonPrimitive.d.ts

@@ -1,11 +1,13 @@
 import React from 'react';
 import { QuillTheme } from '../Admin';
-type ButtonPrimitiveProps = {
+export type ButtonPrimitiveProps = {
     onClick: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
     label: string;
     theme?: QuillTheme;
     style?: React.CSSProperties;
     variant?: 'primary' | 'secondary' | 'danger';
+    disabled?: boolean;
+    type?: 'submit' | 'button' | 'reset';
 };
 declare const ButtonPrimitive: React.FC<ButtonPrimitiveProps & {
     isLoading?: boolean;

package/dist/esm/primitives/ButtonPrimitive.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonPrimitive.d.ts","sourceRoot":"","sources":["../../../src/primitives/ButtonPrimitive.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAyB,MAAM,UAAU,CAAC;AAG7D,KAAK,oBAAoB,GAAG;IAC1B,OAAO,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAC1E,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,QAAQ,CAAC;CAC9C,CAAC;AAEF,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAC7B,oBAAoB,GAAG;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAoFF,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"ButtonPrimitive.d.ts","sourceRoot":"","sources":["../../../src/primitives/ButtonPrimitive.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAgB,MAAM,UAAU,CAAC;AAGpD,MAAM,MAAM,oBAAoB,GAAG;IACjC,OAAO,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAC1E,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,QAAQ,CAAC;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;CACtC,CAAC;AAEF,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAC7B,oBAAoB,GAAG;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAgGF,CAAC;AAEF,eAAe,eAAe,CAAC"}