@quillsql/admin 1.5.2 → 1.6.1

package/dist/cjs/public_components/DashboardBuilder.js

@@ -6,35 +6,18 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const AdminProvider_1 = require("../AdminProvider");
-const Admin_1 = require("../Admin");
 const components_1 = require("../components");
 const react_2 = require("@quillsql/react");
-const constants_1 = require("../utils/constants");
 const Banner_1 = __importDefault(require("../components/Banner"));
 const DatabaseMismatchCard_1 = __importDefault(require("../components/DatabaseMismatchCard"));
-const primitives_1 = require("../primitives");
 const modeToggleOptions = ['SQL Editor', 'Report Builder'];
 function DashboardBuilder({ navigateToDashboardManager, containerStyle, sqlEditor = true, }) {
     const parentRef = (0, react_1.useRef)(null);
     const { state, dispatch } = (0, AdminProvider_1.useAdmin)();
-    const [customerId, setCustomerId] = (0, react_1.useState)('');
     const [isEditActive, setIsEditActive] = (0, react_1.useState)(false);
-    const [checked, setChecked] = (0, react_1.useState)(false);
-    const [selected, setSelected] = (0, react_1.useState)('');
-    const [userTyping, setUserTyping] = (0, react_1.useState)(false);
-    const inputRef = (0, react_1.useRef)(null);
-    const [filteredOptions, setFilteredOptions] = (0, react_1.useState)([]);
-    const [sqlPrompt, setSqlPrompt] = (0, react_1.useState)('');
-    const [dashboardNames, setDashboardNames] = (0, react_1.useState)([]);
-    const [selectedDashboardName, setSelectedDashboardName] = (0, react_1.useState)('');
-    const [isOpen, setIsOpen] = (0, react_1.useState)(false);
     const [query, setQuery] = (0, react_1.useState)(state.activeQuery);
-    const [rows, setRows] = (0, react_1.useState)([]);
-    const [columns, setColumns] = (0, react_1.useState)([]);
-    const [fields, setFields] = (0, react_1.useState)([]);
-    const [errorMessage, setErrorMessage] = (0, react_1.useState)('');
-    const [sqlResponseLoading, setSqlResponseLoading] = (0, react_1.useState)(false);
     const [toggleMode, setToggleMode] = (0, react_1.useState)('SQL Editor');
+    const [selectedOrgName, setSelectedOrgName] = (0, react_1.useState)('');
     (0, react_1.useEffect)(() => {
         if (state.activeQuery) {
             setIsEditActive(true);
@@ -58,75 +41,14 @@ function DashboardBuilder({ navigateToDashboardManager, containerStyle, sqlEdito
         setQuery(state.activeQuery);
     }, [state.activeQuery]);
     (0, react_1.useEffect)(() => {
-        let isSubscribed = true;
-        async function getDashNames() {
-            // If you need to retrieve the JSON data from the response:
-            const response = await fetch(`${state.queryEndpoint}`, {
-                method: 'POST',
-                headers: {
-                    ...state.queryHeaders,
-                    'Content-Type': 'application/json',
-                },
-                body: JSON.stringify({
-                    metadata: {
-                        clientId: state.client._id,
-                        publicKey: state.client._id,
-                        task: 'dashboards',
-                        databaseType: state.client.databaseType,
-                    },
-                }),
-            });
-            const data = await response.json();
-            const dashNames = data.data.dashboardNames.filter((elem) => elem !== null);
-            setDashboardNames(dashNames);
-            setSelectedDashboardName(dashNames[0]);
-        }
-        if (isSubscribed) {
-            getDashNames();
-        }
-        return () => {
-            isSubscribed = false;
-        };
-    }, [state.environment]);
-    // const navigate = useNavigate();
-    const handleRunQuery = async () => {
-        const { _id } = state.client;
-        try {
-            const response = await fetch(`${constants_1.QUILL_SERVER}/dashquery?orgId=${state.organizationId || ''}&publicKey=${_id}`, {
-                method: 'POST',
-                headers: {
-                    Authorization: `Bearer `,
-                    environment: state.environment,
-                    'Content-Type': 'application/json', // Important when sending JSON
-                },
-                body: JSON.stringify({
-                    query,
-                }),
-            });
-            const responseData = await response.json();
-            if (responseData && responseData.errorMessage) {
-                setErrorMessage('Failed to run SQL query: ' + responseData.errorMessage);
-                setRows([]);
-                setColumns([]);
-                setFields([]);
-                return;
-            }
-            setErrorMessage('');
-            setRows(responseData.rows);
-            setColumns(responseData.fields.map((elem) => (0, Admin_1.convertPostgresColumn)(elem)));
-            setFields(responseData.fields);
-        }
-        catch (e) {
-            console.log('ERROR: ', e);
-            return;
+        const selectedOrg = state.organizations.find((org) => {
+            const orgId = org.id ? org.id : org.ID;
+            return orgId && String(orgId) === String(state.organizationId);
+        });
+        if (selectedOrg) {
+            setSelectedOrgName(selectedOrg.name ? selectedOrg.name : selectedOrg.NAME);
         }
-    };
-    const handleAddToDashboard = () => {
-        setIsOpen(true);
-    };
-    const newRows = (0, react_1.useMemo)(() => {
-        return JSON.parse(JSON.stringify(rows));
-    }, [rows]);
+    }, [state.organizations, state.organizationId]);
     /* all your useState and useContext calls and your useEffect hooks */
     // MMTODO: idk if this is needed
     // const handleSetOrganization = (org) => {
@@ -160,7 +82,7 @@ function DashboardBuilder({ navigateToDashboardManager, containerStyle, sqlEdito
                         borderLeftWidth: 0,
                         borderRightWidth: 0,
                         borderStyle: 'solid',
-                        borderColor: state.theme.borderColor,
+                        borderColor: state.theme?.borderColor,
                         paddingBottom: 20,
                         // boxShadow: "0px 1px 4px 0px rgba(0, 0, 0, 0.07)",
                         //   paddingRight: '50px',
@@ -232,43 +154,67 @@ function DashboardBuilder({ navigateToDashboardManager, containerStyle, sqlEdito
                             return;
                         dispatch({ type: 'SET_ACTIVE_QUERY', payload: '' });
                         dispatch({ type: 'SET_ACTIVE_EDIT_ITEM', payload: null });
-                    } })), state.databaseTypeMismatch.show && ((0, jsx_runtime_1.jsx)(DatabaseMismatchCard_1.default, { environemntName: state.client.name, environemntDatabaseType: state.client.databaseType, backendDatabaseType: state.databaseTypeMismatch.backendDatabaseType })), (0, jsx_runtime_1.jsx)("div", { style: {
-                        // Toggle the height of the container so they both stay in the DOM
-                        // and don't refetch when switching back and forth.
-                        height: toggleMode === 'Report Builder' ? '100%' : 0,
-                        overflow: 'hidden',
-                    }, children: (0, jsx_runtime_1.jsx)(react_2.ReportBuilder, { admin: true, initialTableName: state.tables.length > 0 && state.tables[0].name, onAddToDashboardComplete: () => {
-                            dispatch({ type: 'SET_ACTIVE_QUERY', payload: '' });
-                            dispatch({ type: 'SET_ACTIVE_EDIT_ITEM', payload: null });
-                            if (state.navigateToDashboardManager) {
-                                dispatch({
-                                    type: 'SET_ACTIVE_COMPONENT',
-                                    payload: 'Dashboards',
-                                });
-                                state.navigateToDashboardManager();
-                            }
-                        }, organizationName: state.organizations.find((org) => {
-                            return (org.id && String(org.id) === String(state.organizationId));
-                        })?.name }) }), sqlEditor && !state.databaseTypeMismatch.show && ((0, jsx_runtime_1.jsx)("div", { style: {
-                        height: toggleMode === 'SQL Editor' ? '100%' : 0,
-                        overflow: 'hidden',
-                    }, children: (0, jsx_runtime_1.jsx)(react_2.SQLEditor, { chartBuilderEnabled: true, showAccessControlOptions: true, showDateFieldOptions: true, showTableFormatOptions: true, defaultQuery: query, isEditMode: !!state.activeQuery, addToDashboardButtonLabel: state.activeQuery ? 'Save changes' : 'Add to dashboard', chartBuilderTitle: state.activeQuery ? 'Save changes' : 'Add to dashboard', dashboardItem: state.activeQuery ? state.activeEditItem : undefined, onAddToDashboardComplete: () => {
-                            dispatch({ type: 'SET_ACTIVE_QUERY', payload: '' });
-                            dispatch({ type: 'SET_ACTIVE_EDIT_ITEM', payload: null });
-                            if (state.navigateToDashboardManager) {
-                                dispatch({
-                                    type: 'SET_ACTIVE_COMPONENT',
-                                    payload: 'Dashboards',
-                                });
-                                state.navigateToDashboardManager();
-                            }
-                        }, containerStyle: {
-                            height: '100%',
-                            width: '100%',
-                            // paddingRight: 25,
-                            // paddingTop: 25,
-                        }, organizationName: state.organizations.find((org) => {
-                            return (org.id && String(org.id) === String(state.organizationId));
-                        })?.name, ButtonComponent: primitives_1.ButtonPrimitive }) }))] }) }));
+                    } })), state.databaseTypeMismatch.show && ((0, jsx_runtime_1.jsx)(DatabaseMismatchCard_1.default, { environemntName: state.client.name, environemntDatabaseType: state.client.databaseType, backendDatabaseType: state.databaseTypeMismatch.backendDatabaseType })), toggleMode === 'Report Builder' ? ((0, jsx_runtime_1.jsx)(react_2.ReportBuilder, { isAdminEnabled: true, 
+                    // initialTableName={state.tables.length > 0 && state.tables[0]!.name}
+                    onSubmitCreateReport: (report) => {
+                        const dashboard = state.dashboards.find((dash) => {
+                            return dash.name === report.dashboardName;
+                        });
+                        dispatch({ type: 'SET_ACTIVE_QUERY', payload: '' });
+                        dispatch({ type: 'SET_ACTIVE_EDIT_ITEM', payload: null });
+                        if (state.navigateToDashboardManager) {
+                            dispatch({
+                                type: 'SET_ACTIVE_COMPONENT',
+                                payload: 'Dashboards',
+                            });
+                            dispatch({
+                                type: 'SET_SELECTED_DASHBOARD',
+                                payload: dashboard,
+                            });
+                            state.navigateToDashboardManager();
+                        }
+                    }, onSubmitEditReport: (report) => {
+                        const dashboard = state.dashboards.find((dash) => {
+                            return dash.name === report.dashboardName;
+                        });
+                        dispatch({ type: 'SET_ACTIVE_QUERY', payload: '' });
+                        dispatch({ type: 'SET_ACTIVE_EDIT_ITEM', payload: null });
+                        if (state.navigateToDashboardManager) {
+                            dispatch({
+                                type: 'SET_ACTIVE_COMPONENT',
+                                payload: 'Dashboards',
+                            });
+                            dispatch({
+                                type: 'SET_SELECTED_DASHBOARD',
+                                payload: dashboard,
+                            });
+                            state.navigateToDashboardManager();
+                        }
+                    }, organizationName: selectedOrgName, containerStyle: {
+                        height: '100%',
+                        width: '100%',
+                    } })) : ((0, jsx_runtime_1.jsx)(react_2.SQLEditor, { isChartBuilderEnabled: true, showAccessControlOptions: true, showDateFieldOptions: true, showTableFormatOptions: true, defaultQuery: query, addToDashboardButtonLabel: state.activeQuery ? 'Save changes' : 'Add to dashboard', chartBuilderTitle: state.activeQuery ? 'Save changes' : 'Add to dashboard', report: state.activeQuery ? state.activeEditItem : undefined, onAddToDashboardComplete: (report) => {
+                        const dashboard = state.dashboards.find((dash) => {
+                            return dash.name === report.dashboardName;
+                        });
+                        dispatch({ type: 'SET_ACTIVE_QUERY', payload: '' });
+                        dispatch({ type: 'SET_ACTIVE_EDIT_ITEM', payload: null });
+                        if (state.navigateToDashboardManager) {
+                            dispatch({
+                                type: 'SET_ACTIVE_COMPONENT',
+                                payload: 'Dashboards',
+                            });
+                            dispatch({
+                                type: 'SET_SELECTED_DASHBOARD',
+                                payload: dashboard,
+                            });
+                            state.navigateToDashboardManager();
+                        }
+                    }, containerStyle: {
+                        height: '100%',
+                        width: '100%',
+                        // paddingRight: 25,
+                        // paddingTop: 25,
+                    }, organizationName: selectedOrgName }))] }) }));
 }
 exports.default = DashboardBuilder;

package/dist/cjs/public_components/DashboardManager.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardManager.d.ts","sourceRoot":"","sources":["../../../src/public_components/DashboardManager.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAA+B,MAAM,OAAO,CAAC;AAiCnE,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,0BAA0B,EAC1B,cAAc,GACf,EAAE;IACD,0BAA0B,CAAC,EAAE,MAAM,IAAI,CAAC;IACxC,cAAc,CAAC,EAAE,aAAa,CAAC;CAChC,2CAukBA"}
+{"version":3,"file":"DashboardManager.d.ts","sourceRoot":"","sources":["../../../src/public_components/DashboardManager.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAA+B,MAAM,OAAO,CAAC;AA2BnE,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,0BAA0B,EAC1B,cAAc,GACf,EAAE;IACD,0BAA0B,CAAC,EAAE,MAAM,IAAI,CAAC;IACxC,cAAc,CAAC,EAAE,aAAa,CAAC;CAChC,2CA+hBA"}