@quillsql/admin 1.6.0 → 1.6.1

package/dist/esm/public_components/DashboardManager.js

@@ -7,24 +7,22 @@ import { Dashboard, useDashboard } from '@quillsql/react';
 import { ReportWrapper } from '../Admin';
 import { ButtonPrimitive, HeaderPrimitive, ModalPrimitive, SecondaryButtonPrimitive, SelectPrimitive, TextInputPrimitive, } from '../primitives';
 import { NewDashboardModal } from '../modals/NewDashboardModal';
-import { QUILL_SERVER } from '../utils/constants';
 import EmptyDashboardComponent from '../components/EmptyDashboardComponent';
 import DatabaseMismatchCard from '../components/DatabaseMismatchCard';
-import { MemoizedModal } from '../components/UiComponents';
+import { MemoizedButton, MemoizedModal } from '../components/UiComponents';
 import { QuillSelectComponent } from '../components/QuillSelect';
 import { EditFiltersModal } from '../modals/EditFiltersModal';
 export default function DashboardManager({ navigateToDashboardBuilder, containerStyle, }) {
     const { state, dispatch } = useAdmin();
     const parentRef = useRef(null);
+    const [copied, setCopied] = useState(false);
     const [initialLoad, setInitialLoad] = useState(true);
-    const [dashboards, setDashboards] = useState([]);
     const [reloadFlag, setReloadFlag] = useState(false);
     const [selectedReorderDashboard, setSelectedReorderDashboard] = useState('');
     const [newDashboardModalIsOpen, setNewDashboardModalIsOpen] = useState(false);
     const [editFilterModalIsOpen, setEditFilterModalIsOpen] = useState(false);
     const { reload: reloadDashboard } = useDashboard(state.selectedDashboard?.name);
     const [isReorderDashboardModalOpen, setIsReorderDashboardModalOpen] = useState(false);
-    const [dashboardData, setDashboardData] = useState(null);
     const [isPromoteDashModalOpen, setIsPromoteDashModalOpen] = useState(false);
     // A useless flag that just turns itself off.
     useEffect(() => {
@@ -87,59 +85,6 @@ export default function DashboardManager({ navigateToDashboardBuilder, container
             isSubscribed = false;
         };
     }, [state.environment, state.client]);
-    // MMTODO: Idk if this is needed
-    // const handleSetOrganization = (org) => {
-    //     setOrganization(null);
-    //     setTimeout(() => setOrganization(org), 50);
-    // };
-    // MMTODO: Not sure if this actually does anything
-    useEffect(() => {
-        async function getDashboardData(dashboard, setData) {
-            let responseData;
-            if (state.queryEndpoint) {
-                const response = await fetch(state.queryEndpoint, {
-                    method: 'POST',
-                    headers: {
-                        ...state.queryHeaders,
-                        'Content-Type': 'application/json',
-                    },
-                    body: JSON.stringify({
-                        metadata: {
-                            orgId: state.organizationId || '*',
-                            task: 'config',
-                            name: dashboard,
-                            clientId: state.client._id,
-                            databaseType: state.client.databaseType,
-                        },
-                    }),
-                    credentials: state.withCredentials ? 'include' : 'omit', // If withCredentials is true, set to 'include'. Otherwise, set to 'omit'.
-                });
-                responseData = (await response.json()).data;
-            }
-            else {
-                const url = new URL(`${QUILL_SERVER}/dashconfig`);
-                // Setting the search parameters for the URL
-                url.search = new URLSearchParams({
-                    orgId: state.organizationId,
-                    publicKey: state.client._id,
-                    name: dashboard,
-                }).toString();
-                const response2 = await fetch(url, {
-                    method: 'GET',
-                    headers: {
-                        Authorization: 'Bearer ', // Ensure you append your token after 'Bearer ' if needed
-                        environment: state.environment,
-                    },
-                });
-                // If you need to retrieve the JSON data from the response:
-                responseData = await response2.json();
-            }
-            setData(responseData);
-        }
-        if (state.selectedDashboard && state.client) {
-            getDashboardData(state.selectedDashboard.name, setDashboardData);
-        }
-    }, [state.selectedDashboard, state.organizationId, state.client]);
     return (_jsxs("div", { style: containerStyle, children: [_jsxs("div", { style: {
                     display: 'flex',
                     flexDirection: 'column',
@@ -177,7 +122,12 @@ export default function DashboardManager({ navigateToDashboardBuilder, container
                                 flexDirection: 'row',
                                 alignItems: 'flex-end',
                                 justifyContent: 'space-between',
-                            }, children: [_jsxs("div", { style: { gap: 16, display: 'flex', flexDirection: 'row' }, children: [!!state.dashboards.length && (_jsxs("div", { style: { display: 'flex', flexDirection: 'column' }, children: [_jsx("h1", { style: {
+                            }, children: [_jsxs("div", { style: {
+                                        gap: 16,
+                                        display: 'flex',
+                                        flexDirection: 'row',
+                                        alignItems: 'flex-end',
+                                    }, children: [!!state.dashboards.length && (_jsxs("div", { style: { display: 'flex', flexDirection: 'column' }, children: [_jsx("h1", { style: {
                                                         fontSize: '14px',
                                                         paddingTop: '0px',
                                                         marginTop: '0px',
@@ -190,6 +140,7 @@ export default function DashboardManager({ navigateToDashboardBuilder, container
                                                             return { value: elem.name, label: elem.name };
                                                         })
                                                         : [], setDashboard: (dashboard) => {
+                                                        setReloadFlag(true);
                                                         const selectedDashboard = state.dashboards.find((dash) => {
                                                             return dash.name === dashboard;
                                                         });
@@ -212,14 +163,59 @@ export default function DashboardManager({ navigateToDashboardBuilder, container
                                                         color: state.theme.secondaryTextColor,
                                                         fontFamily: state.theme.fontFamily,
                                                         userSelect: 'none',
-                                                    }, children: "Environment" }), _jsx(EnvSelectPopover, { setEnvironment: (env) => dispatch({ type: 'SET_ENVIRONMENT', payload: env }), environment: state.environment, clients: state.clients, client: state.client, setClient: (client) => dispatch({ type: 'SET_CLIENT', payload: client }), theme: state.theme, showPromote: true, handlePromote: () => setIsPromoteDashModalOpen(true) })] })] }), !!state.dashboards.length && !state.databaseTypeMismatch.show && (_jsx(OrgSelect, { parentRef: parentRef, environment: state.environment, setEnvironment: (env) => dispatch({ type: 'SET_ENVIRONMENT', payload: env }), organizations: state.organizations, theme: state.theme, organizationId: state.organizationId, setOrganizationId: (id) => dispatch({ type: 'SET_ORGANIZATION_ID', payload: id }) }))] }) }), state.databaseTypeMismatch.show ? (_jsx(DatabaseMismatchCard, { environemntName: state.client.name, environemntDatabaseType: state.client.databaseType, backendDatabaseType: state.databaseTypeMismatch.backendDatabaseType })) : (_jsxs(_Fragment, { children: [_jsxs("div", { style: { display: 'inline-block' }, children: [!state.dashboards.length && !initialLoad && (_jsx("div", { style: {
+                                                    }, children: "Environment" }), _jsx(EnvSelectPopover, { setEnvironment: (env) => dispatch({ type: 'SET_ENVIRONMENT', payload: env }), environment: state.environment, clients: state.clients, client: state.client, setClient: (client) => dispatch({ type: 'SET_CLIENT', payload: client }), theme: state.theme, showPromote: true, handlePromote: () => setIsPromoteDashModalOpen(true) })] }), _jsxs("div", { style: {
+                                                display: 'flex',
+                                                flexDirection: 'row',
+                                                alignItems: 'center',
+                                            }, children: [_jsxs("div", { style: {
+                                                        // width: '100%',
+                                                        maxWidth: 330,
+                                                        display: 'flex',
+                                                        flexDirection: 'row',
+                                                        justifyContent: 'space-between',
+                                                        alignItems: 'center',
+                                                        padding: '6px 12px',
+                                                        borderRadius: 6,
+                                                        height: 37,
+                                                        cursor: 'pointer',
+                                                    }, onClick: () => {
+                                                        navigator.clipboard.writeText(state.client._id);
+                                                        setCopied(true);
+                                                        setTimeout(() => setCopied(false), 1500);
+                                                    }, className: "quill-active", children: [_jsx("style", { children: `.quill-active { background: #fff; border: 1px solid #e7e7e7; } 
+        .quill-active:hover { background: #fff; box-shadow: 0px 1px 12px rgba(0, 0, 0, 0.07); border: 1px solid #e7e7e7 }
+        .quill-active:active { background: #fff; box-shadow: 0px 1px 12px rgba(0, 0, 0, 0.07); border: 1px solid #9DC4F8; outline: 2px solid #9DC4F8; }
+        ` }), _jsx("div", { style: {
+                                                                color: '#212121',
+                                                                marginBottom: '0px',
+                                                            }, children: _jsx("h1", { style: {
+                                                                    fontSize: '14px',
+                                                                    fontWeight: '600',
+                                                                    color: state.theme.secondaryTextColor,
+                                                                    fontFamily: state.theme.fontFamily,
+                                                                    userSelect: 'none',
+                                                                }, children: "Copy Public Key" }) }), _jsx("div", { style: {
+                                                                display: 'flex',
+                                                                flexDirection: 'row',
+                                                                alignItems: 'center',
+                                                                gap: '6px',
+                                                                cursor: 'pointer',
+                                                                marginLeft: '12px',
+                                                            }, children: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: "#212121", width: 18, height: 18, children: [_jsx("path", { d: "M7 3.5A1.5 1.5 0 0 1 8.5 2h3.879a1.5 1.5 0 0 1 1.06.44l3.122 3.12A1.5 1.5 0 0 1 17 6.622V12.5a1.5 1.5 0 0 1-1.5 1.5h-1v-3.379a3 3 0 0 0-.879-2.121L10.5 5.379A3 3 0 0 0 8.379 4.5H7v-1Z" }), _jsx("path", { d: "M4.5 6A1.5 1.5 0 0 0 3 7.5v9A1.5 1.5 0 0 0 4.5 18h7a1.5 1.5 0 0 0 1.5-1.5v-5.879a1.5 1.5 0 0 0-.44-1.06L9.44 6.439A1.5 1.5 0 0 0 8.378 6H4.5Z" })] }) })] }), copied && (_jsxs("div", { style: {
+                                                        fontSize: 13,
+                                                        fontWeight: 600,
+                                                        color: '#565656',
+                                                        marginLeft: 16,
+                                                        display: 'flex',
+                                                        flexDirection: 'row',
+                                                        alignItems: 'center',
+                                                        gap: 6,
+                                                    }, children: [_jsx("div", { children: "\u2705" }), " ", _jsx("div", { children: "Copied" })] }))] })] }), !!state.dashboards.length && !state.databaseTypeMismatch.show && (_jsx(OrgSelect, { parentRef: parentRef, environment: state.environment, setEnvironment: (env) => dispatch({ type: 'SET_ENVIRONMENT', payload: env }), organizations: state.organizations, theme: state.theme, organizationId: state.organizationId, setOrganizationId: (id) => dispatch({ type: 'SET_ORGANIZATION_ID', payload: id }) }))] }) }), state.databaseTypeMismatch.show ? (_jsx(DatabaseMismatchCard, { environemntName: state.client.name, environemntDatabaseType: state.client.databaseType, backendDatabaseType: state.databaseTypeMismatch.backendDatabaseType })) : (_jsxs(_Fragment, { children: [_jsxs("div", { style: { display: 'inline-block' }, children: [!state.dashboards.length && !initialLoad && (_jsx("div", { style: {
                                             width: '100%',
                                             display: 'flex',
                                             flexDirection: 'column',
                                             alignItems: 'center',
                                         }, children: _jsxs("div", { style: {
-                                                height: 80,
-                                                width: 260,
                                                 borderRadius: 6,
                                                 marginTop: 100,
                                                 display: 'flex',
@@ -227,16 +223,17 @@ export default function DashboardManager({ navigateToDashboardBuilder, container
                                                 alignItems: 'center',
                                                 justifyContent: 'center',
                                                 gap: 20,
-                                            }, className: "hover-dash-rect", onClick: () => {
-                                                setNewDashboardModalIsOpen(true);
-                                            }, children: [_jsx("style", { children: ` .hover-dash-rect { background: white; border: 1px dashed #e7e7e7; } .hover-dash-rect:hover { background: white; box-shadow: 0px 1px 24px 0px rgba(0, 0, 0, 0.07); border: 1px solid #e7e7e7; } ` }), _jsxs("div", { style: {
+                                                padding: 16,
+                                                border: '1px solid #e7e7e7',
+                                                boxShadow: '0px 1px 12px rgba(0, 0, 0, 0.07)',
+                                            }, children: [_jsxs("div", { style: {
                                                         display: 'flex',
                                                         flexDirection: 'row',
                                                         alignItems: 'center',
                                                         justifyContent: 'center',
                                                         width: 260,
                                                     }, children: [_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "#565656", height: 26, width: 26, children: [_jsx("path", { fillRule: "evenodd", d: "M2.25 13.5a8.25 8.25 0 0 1 8.25-8.25.75.75 0 0 1 .75.75v6.75H18a.75.75 0 0 1 .75.75 8.25 8.25 0 0 1-16.5 0Z", clipRule: "evenodd" }), _jsx("path", { fillRule: "evenodd", d: "M12.75 3a.75.75 0 0 1 .75-.75 8.25 8.25 0 0 1 8.25 8.25.75.75 0 0 1-.75.75h-7.5a.75.75 0 0 1-.75-.75V3Z", clipRule: "evenodd" })] }), _jsx("div", { style: {
-                                                                fontSize: 14,
+                                                                fontSize: 16,
                                                                 fontWeight: 500,
                                                                 color: '#565656',
                                                                 // border: '1px solid #e7e7e7',
@@ -246,10 +243,12 @@ export default function DashboardManager({ navigateToDashboardBuilder, container
                                                                 paddingLeft: 12,
                                                                 borderRadius: 4,
                                                                 cursor: 'pointer',
-                                                            }, className: "quill-hover-button", children: "Create new dashboard" })] })] }) })), reloadFlag
+                                                            }, className: "quill-hover-button", children: "No dashboards created yet." })] }), _jsx("div", { style: { paddingBottom: 8 }, children: _jsx(MemoizedButton, { label: 'Create dashboard', style: { fontSize: 14 }, onClick: () => {
+                                                            setNewDashboardModalIsOpen(true);
+                                                        } }) })] }) })), reloadFlag
                                         ? null
                                         : (state.dashboards.length || initialLoad) && (_jsx(Dashboard, { name: state.selectedDashboard?.name, containerStyle: { padding: 25 }, onClickReport: (elem) => {
-                                                dispatch({ type: 'SET_REPORT_ID', payload: elem._id });
+                                                dispatch({ type: 'SET_REPORT_ID', payload: elem.id });
                                                 dispatch({
                                                     type: 'SET_ACTIVE_COMPONENT',
                                                     payload: 'Report',
@@ -259,12 +258,12 @@ export default function DashboardManager({ navigateToDashboardBuilder, container
                                     setIsReorderDashboardModalOpen(true);
                                 }, onSave: async (dashName) => {
                                     await getDashNames(dashName);
+                                    await reloadDashboard(dashName, true);
                                     setReloadFlag(true);
-                                    reloadDashboard(dashName);
                                 }, client: state.client, ModalComponent: ModalPrimitive, ButtonComponent: ButtonPrimitive, SecondaryButtonComponent: SecondaryButtonPrimitive, TextInputComponent: TextInputPrimitive, HeaderComponent: HeaderPrimitive, SelectComponent: QuillSelectComponent, dashNames: state.dashboards })), _jsx(NewDashboardModal, { isOpen: newDashboardModalIsOpen, setIsOpen: setNewDashboardModalIsOpen, openEditOrderModal: (dashboardName) => {
                                     setSelectedReorderDashboard(dashboardName);
                                     setIsReorderDashboardModalOpen(true);
-                                }, onSave: (dashboard) => {
+                                }, onSave: async (dashboard) => {
                                     dispatch({
                                         type: 'SET_SELECTED_DASHBOARD',
                                         payload: dashboard,
@@ -273,18 +272,18 @@ export default function DashboardManager({ navigateToDashboardBuilder, container
                                         type: 'SET_DASHBOARDS',
                                         payload: [...state.dashboards, { ...dashboard }],
                                     });
+                                    await reloadDashboard(state.selectedDashboard?.name, true);
                                     setReloadFlag(true);
-                                    reloadDashboard(state.selectedDashboard?.name);
-                                }, client: state.client, ModalComponent: ModalPrimitive, ButtonComponent: ButtonPrimitive, SecondaryButtonComponent: SecondaryButtonPrimitive, TextInputComponent: TextInputPrimitive, HeaderComponent: HeaderPrimitive, SelectComponent: QuillSelectComponent, dashNames: state.dashboards }), _jsx(ReorderDashboardModal, { organizationId: state.organizationId, isOpen: isReorderDashboardModalOpen, client: state.client, onSave: () => {
+                                }, client: state.client, ModalComponent: ModalPrimitive, ButtonComponent: ButtonPrimitive, SecondaryButtonComponent: SecondaryButtonPrimitive, TextInputComponent: TextInputPrimitive, HeaderComponent: HeaderPrimitive, SelectComponent: QuillSelectComponent, dashNames: state.dashboards }), _jsx(ReorderDashboardModal, { organizationId: state.organizationId, isOpen: isReorderDashboardModalOpen, client: state.client, onSave: async () => {
+                                    await reloadDashboard(state.selectedDashboard?.name, true);
                                     setReloadFlag(true);
-                                    reloadDashboard(state.selectedDashboard?.name);
                                 }, setIsOpen: setIsReorderDashboardModalOpen, ModalComponent: ModalPrimitive, ButtonComponent: ButtonPrimitive, selectedDashboard: selectedReorderDashboard })] }))] }), _jsx(ReportWrapper, { isOpen: state.activeComponent === 'Report', setIsOpen: (isOpen) => {
                     dispatch({
                         type: 'SET_ACTIVE_COMPONENT',
                         payload: isOpen ? 'Report' : 'Dashboards',
                     });
-                }, ButtonComponent: ButtonPrimitive, SecondaryButtonComponent: SecondaryButtonPrimitive, ModalComponent: MemoizedModal, SelectComponent: SelectPrimitive, OrganizationSelectComponent: OrgSelect, organizationId: state.organizationId, queryEndpoint: state.queryEndpoint, queryHeaders: state.queryHeaders, withCredentials: state.withCredentials, reloadDashboard: () => {
+                }, ButtonComponent: ButtonPrimitive, SecondaryButtonComponent: SecondaryButtonPrimitive, ModalComponent: MemoizedModal, SelectComponent: SelectPrimitive, OrganizationSelectComponent: OrgSelect, organizationId: state.organizationId, queryEndpoint: state.queryEndpoint, queryHeaders: state.queryHeaders, withCredentials: state.withCredentials, reloadDashboard: async () => {
+                    await reloadDashboard(state.selectedDashboard?.name);
                     setReloadFlag(true);
-                    reloadDashboard(state.selectedDashboard?.name);
                 } })] }));
 }

package/dist/esm/public_components/SQLViewManager.d.ts

@@ -1,4 +1,5 @@
 import { CSSProperties } from 'react';
+export declare const getDuplicateColumns: (columns?: any[]) => string[];
 export default function SQLViewManager({ containerStyle, }: {
     containerStyle?: CSSProperties;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/esm/public_components/SQLViewManager.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SQLViewManager.d.ts","sourceRoot":"","sources":["../../../src/public_components/SQLViewManager.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAA+B,MAAM,OAAO,CAAC;AAyBnE,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,cAAc,GACf,EAAE;IACD,cAAc,CAAC,EAAE,aAAa,CAAC;CAChC,2CAgaA"}
+{"version":3,"file":"SQLViewManager.d.ts","sourceRoot":"","sources":["../../../src/public_components/SQLViewManager.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAA+B,MAAM,OAAO,CAAC;AAmCnE,eAAO,MAAM,mBAAmB,aAAc,GAAG,EAAE,aAalD,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,cAAc,GACf,EAAE;IACD,cAAc,CAAC,EAAE,aAAa,CAAC;CAChC,2CA8eA"}