@quillsql/admin 1.6.0 → 1.6.2

package/dist/cjs/public_components/SQLViewManager.js

@@ -1,387 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const primitives_1 = require("../primitives");
-const AdminProvider_1 = require("../AdminProvider");
-const components_1 = require("../components");
-const Admin_1 = require("../Admin");
-const CreateEditSqlView_1 = __importDefault(require("../forms/sql_views/CreateEditSqlView"));
-const dataEditor_1 = require("../utils/dataEditor");
-const ConnectionClient_1 = require("../api/ConnectionClient");
-const UiComponents_1 = require("../components/UiComponents");
-const DatabaseMismatchCard_1 = __importDefault(require("../components/DatabaseMismatchCard"));
-function SQLViewManager({ containerStyle, }) {
-    const [tables, setTables] = (0, react_1.useState)(undefined);
-    const [modalIsOpen, setIsOpen] = (0, react_1.useState)(false);
-    const [editModalIsOpen, setEditModalIsOpen] = (0, react_1.useState)(false);
-    const [editQueryView, setEditQueryView] = (0, react_1.useState)(false);
-    const [name, setName] = (0, react_1.useState)('');
-    const [viewQuery, setViewQuery] = (0, react_1.useState)('');
-    const [editViewId, setEditViewId] = (0, react_1.useState)('');
-    const [editName, setEditName] = (0, react_1.useState)('');
-    const [editViewQuery, setEditViewQuery] = (0, react_1.useState)('');
-    const [tableToBeDeleted, setTableToBeDeleted] = (0, react_1.useState)('');
-    const [deleteName, setDeleteName] = (0, react_1.useState)('');
-    const [deleteModalIsOpen, setDeleteModalIsOpen] = (0, react_1.useState)(false);
-    const [isPromoteViewModalOpen, setIsPromoteViewModalOpen] = (0, react_1.useState)(false);
-    const [allTableData, setAllTableData] = (0, react_1.useState)([]);
-    const [referencedTablesMap, setReferencedTablesMap] = (0, react_1.useState)({});
-    const [schemaIsLoading, setSchemaIsLoading] = (0, react_1.useState)(false);
-    const [initialSqlView, setInitialSqlView] = (0, react_1.useState)(undefined);
-    const parentRef = (0, react_1.useRef)(null);
-    const { state, dispatch } = (0, AdminProvider_1.useAdmin)();
-    const closeEditModal = () => {
-        setEditModalIsOpen(false);
-        setEditName('');
-        setEditViewQuery('');
-    };
-    const clickTableCell = (table) => {
-        setEditName(table.name);
-        setEditViewQuery(table.viewQuery);
-        setEditViewId(table._id);
-        setInitialSqlView({
-            id: table._id,
-            name: table.name,
-            query: table.viewQuery,
-        });
-        setEditModalIsOpen(true);
-    };
-    const getTables = async () => {
-        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: 'schema',
-                    databaseType: state.client.databaseType,
-                },
-            }),
-        });
-        if (!response.ok) {
-            throw new Error('Failed to fetch tables data');
-        }
-        const data = await response.json();
-        setTables(data.data.tables);
-    };
-    const getSchemaTableDetails = async () => {
-        setSchemaIsLoading(true);
-        const response = await (0, ConnectionClient_1.getTableColumnsBySchema)(state.client._id, state.client.schemaNames, state.client.databaseType, state.queryEndpoint);
-        setAllTableData(response);
-        setSchemaIsLoading(false);
-    };
-    const getReferencedTablesMap = async () => {
-        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: 'referenced-tables-map',
-                    databaseType: state.client.databaseType,
-                },
-            }),
-        });
-        if (!response.ok) {
-            throw new Error('Failed to fetch tables data');
-        }
-        const data = await response.json();
-        setReferencedTablesMap(data.data.referencedTablesMap);
-    };
-    (0, react_1.useEffect)(() => {
-        let isSubscribed = true;
-        if (isSubscribed && state.client) {
-            getTables();
-            getSchemaTableDetails();
-            getReferencedTablesMap();
-        }
-        return () => {
-            isSubscribed = false;
-        };
-    }, [state.client]);
-    const handleModalSubmit = async (submitRequest, query, name, id, columns) => {
-        try {
-            const prevTableName = tables?.find((table) => table._id === id)?.name;
-            const isPlural = referencedTablesMap &&
-                referencedTablesMap[prevTableName] &&
-                referencedTablesMap[prevTableName].length > 1
-                ? 's'
-                : '';
-            switch (submitRequest) {
-                case 'add':
-                    if (!name) {
-                        alert('No name found');
-                        return;
-                    }
-                    if (tables?.map((table) => table.name).includes(name)) {
-                        alert('Name already exists');
-                        return;
-                    }
-                    if (!/^[a-z0-9_]+$/.test(name)) {
-                        alert('Name must be lowercase with no spaces');
-                        return;
-                    }
-                    await (0, dataEditor_1.addSqlView)(name, query, state);
-                    break;
-                case 'edit':
-                    if (!id) {
-                        return;
-                    }
-                    if (referencedTablesMap && referencedTablesMap[prevTableName]) {
-                        // This condition is for only query edits
-                        if (editQueryView) {
-                            const errorColumns = [];
-                            referencedTablesMap[prevTableName] = referencedTablesMap[prevTableName].forEach((table) => {
-                                table.referencedColumns.forEach((column) => {
-                                    if (!columns?.find((col) => {
-                                        return col.field === column;
-                                    })) {
-                                        errorColumns.push(`'${column}' referenced by ${table.dashboardName} - ${table.reportName}`);
-                                    }
-                                });
-                            });
-                            if (errorColumns.length > 0) {
-                                alert(`Edit Error\n\n${errorColumns.join('\n')} \n\nPlease modify your query to include these columns.`);
-                                return;
-                            }
-                        }
-                        else {
-                            const referencedTableInfo = referencedTablesMap[prevTableName].map((info) => {
-                                return `${info.dashboardName} - ${info.reportName}`;
-                            });
-                            alert(`Edit Error\n\n${referencedTableInfo.join('\n')} \n\nPlease delete those charts before renaming this table.`);
-                            return;
-                        }
-                    }
-                    if (!name) {
-                        alert('No name found');
-                        return;
-                    }
-                    if (!/^[a-z0-9_]+$/.test(name)) {
-                        alert('Names can only include lowercase letters, numbers, and underscores');
-                        return;
-                    }
-                    // check if the tableName is present excluding the table with the same id
-                    if (tables
-                        ?.filter((table) => table._id !== id)
-                        .map((table) => table.name)
-                        .includes(name)) {
-                        alert('Name already exists');
-                        return;
-                    }
-                    await (0, dataEditor_1.editSQLView)(name, query, id, state);
-                    break;
-                case 'delete':
-                    if (!id) {
-                        alert('No id found');
-                        return;
-                    }
-                    // Determine if the table is referenced in other charts
-                    if (referencedTablesMap && referencedTablesMap[prevTableName]) {
-                        alert(`This table is referenced in the following dashboard${isPlural}/chart${isPlural}.\n\n${referencedTablesMap[prevTableName]?.join('\n')} \n\nPlease delete those charts before deleting this table.`);
-                        return;
-                    }
-                    await (0, dataEditor_1.deleteSQLView)(id, state);
-                    break;
-                default:
-                    setEditName('');
-                    setEditViewQuery(query);
-                    setEditViewId('');
-                    setEditModalIsOpen(true);
-                    return;
-            }
-            await getTables();
-            closeEditModal();
-            setEditQueryView(false);
-        }
-        catch (e) {
-            console.error(e);
-        }
-    };
-    const handleEditAddView = async (request, query, name, id, columns) => {
-        switch (request) {
-            case 'edit':
-                await handleModalSubmit('edit', query, name, id, columns);
-                break;
-            default:
-                await handleModalSubmit('final-edit', query);
-                break;
-        }
-    };
-    (0, react_1.useEffect)(() => {
-        getTables();
-    }, [state.client]);
-    return ((0, jsx_runtime_1.jsxs)("div", { style: { ...containerStyle }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
-                    display: 'flex',
-                    flexDirection: 'column',
-                    paddingTop: '0px',
-                    position: 'relative',
-                }, ref: parentRef, children: [(state.databaseTypeMismatch.show || !editQueryView) && ((0, jsx_runtime_1.jsx)("div", { style: {
-                            //   width: 'calc(100vw - 30px)',
-                            display: 'flex',
-                            position: 'sticky',
-                            // position: "fixed",
-                            backgroundColor: 'white',
-                            zIndex: 1,
-                            left: 0,
-                            right: 0,
-                            top: 0,
-                            flexDirection: 'row',
-                            paddingTop: 12,
-                            alignItems: 'center',
-                            justifyContent: 'space-between',
-                            paddingLeft: '30px',
-                            paddingRight: '30px',
-                            borderBottomWidth: 1,
-                            borderTopWidth: 0,
-                            borderLeftWidth: 0,
-                            borderRightWidth: 0,
-                            borderStyle: 'solid',
-                            borderColor: state.theme?.borderColor,
-                            paddingBottom: 20,
-                            //   boxShadow: "0px 1px 4px 0px rgba(0, 0, 0, 0.07)",
-                            //   paddingRight: '50px',
-                            //   position: 'absolute'
-                            //   // zIndex: 10
-                        }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
-                                display: 'flex',
-                                flexDirection: 'row',
-                                alignItems: 'flex-end',
-                                justifyContent: 'space-between',
-                                width: '100%',
-                                // marginLeft: '25px'
-                            }, children: [(0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column' }, children: [(0, jsx_runtime_1.jsx)("h1", { style: {
-                                                fontSize: '14px',
-                                                paddingTop: '0px',
-                                                marginTop: '0px',
-                                                marginBottom: '4px',
-                                                fontWeight: '600',
-                                                color: state.theme.secondaryTextColor,
-                                                fontFamily: state.theme.fontFamily,
-                                                userSelect: 'none',
-                                            }, children: "Environment" }), (0, jsx_runtime_1.jsx)(components_1.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: () => setIsPromoteViewModalOpen(true) })] }), !editQueryView && !state.databaseTypeMismatch.show && ((0, jsx_runtime_1.jsx)(primitives_1.ButtonPrimitive, { onClick: () => {
-                                        setEditName('');
-                                        setEditViewQuery('');
-                                        setEditViewId('');
-                                        setInitialSqlView(undefined);
-                                        setEditQueryView(true);
-                                    }, label: "Add view +" }))] }) })), 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)(jsx_runtime_1.Fragment, { children: !editQueryView ? ((0, jsx_runtime_1.jsx)("div", { style: {
-                                display: 'flex',
-                                flexWrap: 'wrap',
-                                paddingLeft: 25,
-                                paddingRight: 25,
-                                paddingTop: 25,
-                            }, children: tables && tables?.length
-                                ? tables.map((table) => ((0, jsx_runtime_1.jsx)(Admin_1.TableCell, { table: table, clickTableCell: clickTableCell }, table._id)))
-                                : null }, 'edit-view-query')) : ((0, jsx_runtime_1.jsx)(CreateEditSqlView_1.default, { containerStyle: {}, initialSqlView: initialSqlView, closeEditView: () => setEditQueryView(false), addEditView: (request, name, query, id, columns) => {
-                                handleEditAddView(request, name, query, id, columns);
-                            }, allTableData: allTableData, schemaIsLoading: schemaIsLoading })) }))] }), (0, jsx_runtime_1.jsx)(EditAddViewModal, { viewName: editName, viewQuery: editViewQuery, viewId: editViewId, editModalIsOpen: editModalIsOpen, closeEditModal: closeEditModal, submit: handleModalSubmit, state: state, onEditViewClick: () => setEditQueryView(true) })] }));
-}
-exports.default = SQLViewManager;
-function EditAddViewModal({ viewName, viewQuery, viewId, editModalIsOpen, closeEditModal, submit, state, onEditViewClick = () => { }, }) {
-    const [name, setName] = (0, react_1.useState)(viewName);
-    const [query, setQuery] = (0, react_1.useState)(viewQuery);
-    const [id, setId] = (0, react_1.useState)(viewId);
-    (0, react_1.useEffect)(() => {
-        setName(viewName);
-    }, [viewName]);
-    (0, react_1.useEffect)(() => {
-        setQuery(viewQuery);
-    }, [viewQuery]);
-    (0, react_1.useEffect)(() => {
-        setId(viewId);
-    }, [viewId]);
-    return ((0, jsx_runtime_1.jsx)(primitives_1.ModalPrimitive, { isOpen: editModalIsOpen, close: closeEditModal, children: (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col p-[6px]", children: [(0, jsx_runtime_1.jsxs)("div", { style: {
-                        display: 'flex',
-                        flexDirection: 'row',
-                        alignItems: 'center',
-                        justifyContent: 'space-between',
-                        paddingBottom: '20px',
-                        // width: '100%'
-                    }, children: [(0, jsx_runtime_1.jsx)("h1", { style: {
-                                fontSize: '24px',
-                                paddingTop: '0px',
-                                marginTop: '0px',
-                                marginBottom: '0px',
-                                fontWeight: 'bold',
-                                color: '#384151',
-                            }, children: viewName ? 'Edit SQL View' : 'Add SQL View' }), (0, jsx_runtime_1.jsx)(UiComponents_1.MemoizedDeleteButton, { onClick: closeEditModal, style: undefined })] }), (0, jsx_runtime_1.jsx)("h3", { style: {
-                        fontWeight: '600',
-                        fontSize: '14px',
-                        marginBottom: '6px',
-                        color: '#212121',
-                    }, children: "Name" }), (0, jsx_runtime_1.jsx)(primitives_1.TextInputPrimitive, { placeholder: "Enter view display name...", onChange: (e) => setName(e.target.value), value: name ? name : '' }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("h3", { style: {
-                        fontWeight: '600',
-                        fontSize: '14px',
-                        marginBottom: '6px',
-                        color: '#212121',
-                    }, children: "Query" }), (0, jsx_runtime_1.jsxs)("div", { style: {
-                        display: 'flex',
-                        flexDirection: 'row',
-                        alignItems: 'center',
-                        paddingLeft: '12px',
-                        paddingRight: '12px',
-                        fontWeight: 'medium',
-                        height: '120px',
-                        boxShadow: '0 1px 2px 0 rgba(0,0,0,.05)',
-                        width: '500px',
-                        background: 'linear-gradient(white 50%, transparent)',
-                        color: state.theme?.primaryTextColor,
-                        borderWidth: '1px',
-                        borderColor: state.theme?.borderColor || '#E7E7E7',
-                        borderStyle: 'solid',
-                        borderRadius: '6px',
-                        fontSize: 14,
-                        position: 'relative',
-                        overflow: 'hidden',
-                    }, children: [(0, jsx_runtime_1.jsx)("textarea", { style: {
-                                width: '100%',
-                                height: '100%',
-                                resize: 'none',
-                                opacity: '1',
-                                background: 'transparent',
-                                color: '#000',
-                                fontFamily: 'inherit',
-                                fontSize: 'inherit',
-                                border: 'none',
-                                overflow: 'hidden',
-                                paddingTop: '12px',
-                                paddingLeft: '8px',
-                            }, value: viewQuery, disabled: true }), (0, jsx_runtime_1.jsx)("div", { style: {
-                                position: 'absolute',
-                                bottom: 0,
-                                left: 0,
-                                right: 0,
-                                height: '90%',
-                                background: 'linear-gradient(transparent, white)',
-                                pointerEvents: 'none',
-                            } }), viewName && ((0, jsx_runtime_1.jsx)("div", { style: { position: 'absolute', bottom: '10px', right: '10px' }, children: (0, jsx_runtime_1.jsx)(UiComponents_1.MemoizedSecondaryButton, { label: 'Edit Query   ↗', onClick: () => {
-                                    closeEditModal();
-                                    onEditViewClick();
-                                } }) }))] }), (0, jsx_runtime_1.jsxs)("div", { style: {
-                        display: 'flex',
-                        flexDirection: 'row',
-                        alignItems: 'center',
-                        justifyContent: 'flex-end',
-                        marginTop: 20,
-                        gap: 8,
-                    }, children: [viewName && ((0, jsx_runtime_1.jsx)(UiComponents_1.MemoizedButton, { onClick: () => submit('delete', query, name, id), label: "Delete", style: { color: 'red', backgroundColor: 'white' } })), (0, jsx_runtime_1.jsx)(UiComponents_1.MemoizedButton, { onClick: () => {
-                                if (!name) {
-                                    alert('Please enter a name');
-                                    return;
-                                }
-                                submit(viewName ? 'edit' : 'add', query, name, id);
-                            }, label: viewName ? 'Save changes' : 'Create view' })] })] }) }));
-}

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

@@ -1,13 +0,0 @@
-interface EnvSelectPopoverProps {
-    clients: any[];
-    setClient: (client: any) => void;
-    client: any;
-    theme: any;
-    environment: string;
-    setEnvironment: (environment: string) => void;
-    handlePromote?: (client: any) => void;
-    showPromote?: boolean;
-}
-export default function EnvSelectPopover({ clients, setClient, client, theme, environment, setEnvironment, handlePromote, showPromote, }: EnvSelectPopoverProps): import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=EnvSelectPopover.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"EnvSelectPopover.d.ts","sourceRoot":"","sources":["../../../src/components/EnvSelectPopover.tsx"],"names":[],"mappings":"AAIA,UAAU,qBAAqB;IAC7B,OAAO,EAAE,GAAG,EAAE,CAAC;IACf,SAAS,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,IAAI,CAAC;IACjC,MAAM,EAAE,GAAG,CAAC;IACZ,KAAK,EAAE,GAAG,CAAC;IACX,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,IAAI,CAAC;IACtC,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,OAAO,EACP,SAAS,EACT,MAAM,EACN,KAAK,EACL,WAAW,EACX,cAAc,EACd,aAAa,EACb,WAAW,GACZ,EAAE,qBAAqB,2CAqTvB"}

package/dist/esm/components/EnvSelectPopover.js

@@ -1,221 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useRef, useEffect } from 'react';
-import { ArrowDownHeadIcon } from '../icons';
-import { useAdmin } from '../AdminProvider';
-export default function EnvSelectPopover({ clients, setClient, client, theme, environment, setEnvironment, handlePromote, showPromote, }) {
-    const { state, dispatch } = useAdmin();
-    const [isOpen, setIsOpen] = useState(false);
-    const [hoveredItemId, setHoveredItemId] = useState(null);
-    const [isPromoteHovered, setIsPromoteHovered] = useState(false);
-    const handleItemClick = (selectedClient) => {
-        if (state.activeQuery) {
-            const message = 'Are you sure? Changing environment will exit edit mode and your changes will not be saved.';
-            if (!confirm(message))
-                return;
-            dispatch({ type: 'SET_ACTIVE_QUERY', payload: '' });
-            dispatch({ type: 'SET_ACTIVE_EDIT_ITEM', payload: null });
-        }
-        setClient(selectedClient);
-        setIsOpen(false);
-    };
-    const handlePromoteClick = (e, client) => {
-        e.preventDefault();
-        if (handlePromote) {
-            handlePromote(client);
-        }
-    };
-    const popoverRef = useRef(null);
-    const handleOutsideClick = (event) => {
-        if (popoverRef.current && !popoverRef.current.contains(event.target)) {
-            setIsOpen(false);
-        }
-    };
-    useEffect(() => {
-        if (isOpen) {
-            document.addEventListener('mousedown', handleOutsideClick);
-        }
-        else {
-            document.removeEventListener('mousedown', handleOutsideClick);
-        }
-        return () => {
-            document.removeEventListener('mousedown', handleOutsideClick); // Cleanup
-        };
-    }, [isOpen]);
-    const dropdownStyles = {
-        position: 'relative',
-        display: 'inline-block',
-        fontFamily: theme.fontFamily,
-        fontSize: 14,
-    };
-    const separatorStyle = {
-        borderBottom: '1px solid #e7e7e7',
-    };
-    const triggerButtonStyles = {
-        width: '100%',
-        minWidth: 230,
-        maxWidth: 230,
-        outline: 'none',
-        textAlign: 'left',
-        whiteSpace: 'nowrap',
-        overflow: 'hidden',
-        textOverflow: 'ellipsis',
-        borderRadius: 6,
-        WebkitAppearance: 'none',
-        paddingLeft: 12,
-        paddingRight: 12,
-        height: 38,
-        borderTop: '1px solid #e7e7e7',
-        borderLeft: '1px solid #e7e7e7',
-        borderRight: '1px solid #e7e7e7',
-        borderBottom: '1px solid #e7e7e7',
-        background: theme.backgroundColor,
-        color: theme.primaryTextColor,
-        // boxShadow: "0 1px 2px 0 rgba(0,0,0,.05)",
-        fontFamily: theme.fontFamily,
-        fontWeight: 500,
-    };
-    const dropdownContentStyles = {
-        display: isOpen ? 'flex' : 'none',
-        flexDirection: 'column',
-        background: '#FFFFFF',
-        // background: "#F7F8FA",
-        position: 'absolute',
-        boxShadow: '0px 1px 12px 0px rgba(56, 65, 81, 0.1)',
-        border: '1px solid #e7e7e7',
-        boxSizing: 'border-box',
-        zIndex: 1,
-        borderRadius: 6,
-        padding: 8,
-        maxHeight: 420,
-        width: 230,
-        marginTop: 8,
-        gap: 5,
-        overflowY: 'scroll',
-    };
-    const itemStyles = {
-        // padding: "10px",
-        height: 42,
-        paddingLeft: 10,
-        paddingRight: 4,
-        paddingTop: 6,
-        paddingBottom: 6,
-        cursor: 'pointer',
-        fontSize: '14px',
-        color: theme.primaryTextColor,
-        display: 'flex',
-        flexDirection: 'row',
-        alignItems: 'center',
-        justifyContent: 'space-between',
-        fontWeight: '500',
-    };
-    const itemHoverStyles = {
-        backgroundColor: 'rgba(56, 65, 81, 0.04)',
-        borderRadius: 6,
-    };
-    const selectedItemStyles = {
-        backgroundColor: 'rgba(56, 65, 81, 0.04)',
-        borderRadius: 6,
-        // boxShadow: "0 1px 6px 0 rgba(56, 65, 81, 0.09)",
-        fontWeight: '500',
-        // border: "1px solid #e7e7e7",
-    };
-    const promoteStyles = {
-        color: theme.primaryTextColor,
-        cursor: 'pointer',
-        fontSize: '13px',
-        border: isPromoteHovered ? '1px solid #e7e7e7' : '1px solid transparent',
-        backgroundColor: isPromoteHovered ? 'white' : undefined,
-        boxShadow: isPromoteHovered
-            ? '0px 1px 12px 0px rgba(56, 65, 81, 0.1)'
-            : undefined,
-        display: 'flex',
-        flexDirection: 'row',
-        alignItems: 'center',
-        paddingLeft: 7,
-        paddingRight: 9,
-        paddingTop: 6,
-        paddingBottom: 6,
-        borderRadius: 4,
-        gap: 3,
-    };
-    const clientStyles = {
-        color: theme.primaryTextColor,
-        cursor: 'pointer',
-        fontSize: '13px',
-        border: '1px solid transparent',
-        display: 'flex',
-        flexDirection: 'row',
-        alignItems: 'center',
-        paddingLeft: 7,
-        paddingRight: 9,
-        paddingTop: 6,
-        paddingBottom: 6,
-        borderRadius: 4,
-        gap: 3,
-    };
-    const itemTextStyles = {
-        // marginRight: "30px",
-        whiteSpace: 'nowrap',
-        overflow: 'hidden',
-        textOverflow: 'ellipsis',
-    };
-    if (client && client._id === '642ee580e45ecb91213b44aa') {
-        return (_jsxs("div", { style: {
-                background: '#f7f7f7',
-                borderRadius: 6,
-                height: 38,
-                display: 'flex',
-                flexDirection: 'row',
-                alignItems: 'center',
-                paddingLeft: 4,
-                paddingRight: 4,
-            }, children: [_jsx("button", { style: {
-                        background: environment === 'PRODUCTION' ? 'white' : undefined,
-                        color: environment === 'PRODUCTION' ? '#384151' : '#677389',
-                        fontWeight: environment === 'PRODUCTION' ? '600' : '500',
-                        borderRadius: 4,
-                        paddingLeft: 6,
-                        paddingRight: 6,
-                        paddingTop: 3,
-                        paddingBottom: 3,
-                        fontSize: 16,
-                    }, onClick: () => setEnvironment('PRODUCTION'), children: "Production" }), _jsx("button", { style: {
-                        background: environment === 'STAGING' ? 'white' : undefined,
-                        color: environment === 'STAGING' ? '#384151' : '#677389',
-                        fontWeight: environment === 'STAGING' ? '600' : '500',
-                        borderRadius: 4,
-                        paddingLeft: 6,
-                        paddingRight: 6,
-                        paddingTop: 3,
-                        paddingBottom: 3,
-                        fontSize: 16,
-                    }, onClick: () => setEnvironment('STAGING'), children: "Staging" })] }));
-    }
-    return (_jsxs("div", { style: dropdownStyles, ref: popoverRef, children: [_jsx("button", { 
-                // onMouseEnter={() => setIsOpen(true)}
-                onClick: () => setIsOpen((isOpen) => !isOpen), style: triggerButtonStyles, children: client ? client.name : 'Select environment' }), _jsx("div", { style: dropdownContentStyles, children: !!clients.length &&
-                    clients.map((item) => (_jsxs("div", { onClick: client && client._id !== item._id
-                            ? () => handleItemClick(item)
-                            : undefined, style: {
-                            ...itemStyles,
-                            ...(hoveredItemId === item._id ? itemHoverStyles : {}),
-                            ...(client && client._id === item._id
-                                ? selectedItemStyles
-                                : {}),
-                        }, onMouseEnter: () => setHoveredItemId(item._id), onMouseLeave: () => setHoveredItemId(null), children: [_jsx("span", { onClick: client && client._id === item._id
-                                    ? () => handleItemClick(item)
-                                    : undefined, style: {
-                                    ...clientStyles,
-                                }, children: item.name }), client && client._id === item._id && (_jsxs("div", { onClick: (e) => handlePromoteClick(e, item), style: {
-                                    ...promoteStyles,
-                                    visibility: showPromote ? 'visible' : 'hidden',
-                                }, onMouseEnter: () => setIsPromoteHovered(true), onMouseLeave: () => setIsPromoteHovered(false), children: [_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", fill: "currentColor", height: "16px", width: "16px", children: [_jsx("path", { d: "M7.25 10.25a.75.75 0 0 0 1.5 0V4.56l2.22 2.22a.75.75 0 1 0 1.06-1.06l-3.5-3.5a.75.75 0 0 0-1.06 0l-3.5 3.5a.75.75 0 0 0 1.06 1.06l2.22-2.22v5.69Z" }), _jsx("path", { d: "M3.5 9.75a.75.75 0 0 0-1.5 0v1.5A2.75 2.75 0 0 0 4.75 14h6.5A2.75 2.75 0 0 0 14 11.25v-1.5a.75.75 0 0 0-1.5 0v1.5c0 .69-.56 1.25-1.25 1.25h-6.5c-.69 0-1.25-.56-1.25-1.25v-1.5Z" })] }), "Promote"] }))] }, item._id))) }), _jsx(ArrowDownHeadIcon, { style: {
-                    height: '20px',
-                    width: '20px',
-                    flex: 'none',
-                    position: 'absolute',
-                    right: 8,
-                    top: 9.5,
-                    color: '#6C727F',
-                }, "aria-hidden": "true" })] }));
-}

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

@@ -1,8 +0,0 @@
-import { CSSProperties } from 'react';
-export default function SqlViewTile({ query, name, header2Style, header1Style, }: {
-    query: string;
-    name: string;
-    header1Style?: CSSProperties;
-    header2Style?: CSSProperties;
-}): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=SqlViewTile.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"SqlViewTile.d.ts","sourceRoot":"","sources":["../../../src/components/SqlViewTile.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAI7C,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,KAAK,EACL,IAAI,EACJ,YAAY,EACZ,YAAY,GACb,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,YAAY,CAAC,EAAE,aAAa,CAAC;CAC9B,2CAuEA"}