@quillsql/admin 1.6.3 → 1.7.0

package/dist/cjs/forms/client_onboard/ConnectDatabase.js

@@ -17,10 +17,16 @@ const QuillMultiSelectWithCombo_1 = require("../../components/QuillMultiSelectWi
 const CardSection_1 = __importDefault(require("../../components/CardSection"));
 // import InputLabel from '../../components/InputLabel';
 const AdminProvider_1 = require("../../AdminProvider");
+const dataFetcher_1 = require("../../utils/dataFetcher");
+const useLongLoading_1 = require("../../hooks/useLongLoading");
 function ConnectDatabase({ containerStyle, header1Style, header2Style, environmentDetails, setEnvironmentDetails, fetchSchemasLoading, onConnectDatabase, }) {
-    const { state, getToken } = (0, AdminProvider_1.useAdmin)();
+    const { state, getToken, eventTracking } = (0, AdminProvider_1.useAdmin)();
     const [error, setError] = (0, react_1.useState)(undefined);
     const [isConnecting, setIsConnecting] = (0, react_1.useState)(false);
+    (0, useLongLoading_1.useLongLoading)(isConnecting, {
+        origin: 'ConnectDatabase',
+        loadDescription: 'Connecting to database',
+    });
     const [clientId, setClientId] = (0, react_1.useState)(environmentDetails.client.clientId);
     const [fileLabel, setFileLabel] = (0, react_1.useState)('No file chosen');
     const [allSchemas, setAllSchemas] = (0, react_1.useState)([]);
@@ -54,7 +60,12 @@ function ConnectDatabase({ containerStyle, header1Style, header2Style, environme
         // Redact sensitive information
         const savedConnectionDetails = { ...databaseConnectionDetails };
         savedConnectionDetails.connectionString = '';
-        savedConnectionDetails.password = '';
+        if (databaseConnectionDetails.type === 'Databricks') {
+            savedConnectionDetails.token = '';
+        }
+        else {
+            savedConnectionDetails.password = '';
+        }
         sessionStorage.setItem('connectionDetails', JSON.stringify(savedConnectionDetails));
     }, [databaseConnectionDetails]);
     const handleFileChange = (e) => {
@@ -76,6 +87,17 @@ function ConnectDatabase({ containerStyle, header1Style, header2Style, environme
             }
             catch (err) {
                 console.log('Error parsing JSON file', err);
+                eventTracking?.logError?.({
+                    type: 'bug', // TODO: determine type
+                    severity: 'high',
+                    message: 'Error parsing JSON file',
+                    errorMessage: err.message,
+                    errorStack: err.stack,
+                    errorData: {
+                        caller: 'ConnectDatabase',
+                        function: 'handleFileChange',
+                    },
+                });
                 setFileLabel('Error parsing JSON file');
             }
         };
@@ -86,6 +108,7 @@ function ConnectDatabase({ containerStyle, header1Style, header2Style, environme
             return false;
         }
         const typedDetails = databaseConnectionDetails;
+        const databricksDetails = databaseConnectionDetails;
         switch (databaseConnectionDetails.type) {
             case 'PostgreSQL':
             case 'MySQL':
@@ -100,6 +123,10 @@ function ConnectDatabase({ containerStyle, header1Style, header2Style, environme
                     !(typedDetails.port ||
                         (typedDetails.warehouse &&
                             typedDetails.type === 'Snowflake')));
+            case 'Databricks':
+                return (!databricksDetails.host ||
+                    !databricksDetails.path ||
+                    !databricksDetails.token);
             case 'BigQuery':
                 return !databaseConnectionDetails.jsonString;
             default:
@@ -126,11 +153,22 @@ function ConnectDatabase({ containerStyle, header1Style, header2Style, environme
         }
         try {
             setIsConnecting(true);
-            await (0, ConnectionClient_1.setSchemaNames)(state.queryEndpoint, clientId, selectedSchemas, getToken);
-            const databaseSchema = await (0, ConnectionClient_1.getTableColumnsBySchema)(state.queryEndpoint, clientId, getToken, selectedSchemas).then((res) => res.columnsByTable);
+            await (0, ConnectionClient_1.setSchemaNames)(state.queryEndpoint, clientId, selectedSchemas, getToken, state.queryHeaders);
+            const databaseSchema = await (0, ConnectionClient_1.getTableColumnsBySchema)(state.isSelfHosted, state.queryEndpoint, clientId, databaseConnectionDetails.type, getToken, selectedSchemas, state.queryHeaders).then((res) => res.columnsByTable);
             setEnvironmentDetails(databaseConnectionDetails, databaseSchema, selectedSchemas, clientId);
         }
         catch (e) {
+            eventTracking?.logError?.({
+                type: 'bug', // TODO: determine type
+                severity: 'high',
+                message: 'Error setting up database',
+                errorMessage: e.message,
+                errorStack: e.stack,
+                errorData: {
+                    caller: 'ConnectDatabase',
+                    function: 'nextStep',
+                },
+            });
             setError(e.message);
         }
         finally {
@@ -139,11 +177,38 @@ function ConnectDatabase({ containerStyle, header1Style, header2Style, environme
             }, 1000);
         }
     };
+    const getSchemaNames = async () => {
+        setIsConnecting(true);
+        const tempClientId = clientId ?? state.client?.clientId;
+        const { data, status, queries } = await (0, dataFetcher_1.quillFetch)({
+            client: {
+                queryEndpoint: state.queryEndpoint,
+                queryHeaders: state.queryHeaders,
+                withCredentials: !!state.withCredentials,
+                clientId: tempClientId,
+            },
+            task: 'get-schema-names',
+            metadata: {
+                databaseType: databaseConnectionDetails.type,
+                newClientId: clientId,
+            },
+            getToken: getToken,
+        });
+        if (status !== 'success') {
+            setIsConnecting(false);
+            setError('Error fetching schemas');
+            return;
+        }
+        const schemas = queries?.queryResults?.[0]?.rows?.map((row) => row['schema_name'] || row['SCHEMA_NAME']);
+        setClientId(data?.clientId);
+        setAllSchemas(schemas);
+        setIsConnecting(false);
+    };
     const testConnectionAndFormClient = async () => {
         setError(undefined);
         const connectionString = (0, databases_1.formConnectionString)(databaseConnectionDetails);
         setIsConnecting(true);
-        const result = await (0, ConnectionClient_1.testConnectionString)(state.queryEndpoint, connectionString, databaseConnectionDetails.type, getToken, clientId);
+        const result = await (0, ConnectionClient_1.testConnectionString)(state.queryEndpoint, connectionString, databaseConnectionDetails.type, getToken, clientId, state.queryHeaders);
         if (result.success) {
             try {
                 setConnectionDetails({
@@ -161,6 +226,17 @@ function ConnectDatabase({ containerStyle, header1Style, header2Style, environme
                 onConnectDatabase?.(result.clientId);
             }
             catch (e) {
+                eventTracking?.logError?.({
+                    type: 'bug', // TODO: determine type
+                    severity: 'high',
+                    message: 'Error connecting to database',
+                    errorMessage: e.message,
+                    errorStack: e.stack,
+                    errorData: {
+                        caller: 'ConnectDatabase',
+                        function: 'testConnectionAndFormClient',
+                    },
+                });
                 setError("Couldn't connect to database");
             }
             finally {
@@ -176,50 +252,75 @@ function ConnectDatabase({ containerStyle, header1Style, header2Style, environme
                     display: 'flex',
                     flexDirection: 'row',
                     justifyContent: 'space-between',
-                }, children: [(0, jsx_runtime_1.jsx)("h1", { style: header1Style, children: "Connect Database" }), clientId && !!selectedSchemas?.length && ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: "currentColor", width: "24px", height: "24px", children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Zm3.857-9.809a.75.75 0 0 0-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 1 0-1.06 1.061l2.5 2.5a.75.75 0 0 0 1.137-.089l4-5.5Z", clipRule: "evenodd" }) }))] }), (0, jsx_runtime_1.jsxs)("div", { style: { marginTop: 12 }, children: [(0, jsx_runtime_1.jsx)("h2", { style: { ...header2Style, fontWeight: 600, color: '#565656' }, children: "Database type" }), (0, jsx_runtime_1.jsx)("div", { style: { display: 'flex', gap: 10, userSelect: 'none' }, children: databases_1.DATABASE_DEFAULT_INFO.map((database) => {
-                            return ((0, jsx_runtime_1.jsx)(DatabaseSelector_1.default, { onDatabaseSelect: onDatabaseSelect, databaseType: databaseConnectionDetails?.type || '', containerStyle: { marginBottom: '12px' }, label: database.label, value: database.value, imageUrl: database.imageUrl }, database.label));
-                        }) })] }), databaseConnectionDetails && ((0, jsx_runtime_1.jsxs)("div", { children: [databaseConnectionDetails.type !== 'BigQuery' ? ((0, jsx_runtime_1.jsxs)("div", { children: [['MySQL', 'PostgreSQL'].includes(databaseConnectionDetails.type) && ((0, jsx_runtime_1.jsxs)("div", { style: { marginTop: 16, marginBottom: 24 }, children: [(0, jsx_runtime_1.jsx)("h2", { style: {
-                                            ...header2Style,
-                                            fontWeight: 600,
-                                            marginBottom: 8,
-                                        }, children: "Connection Method" }), (0, jsx_runtime_1.jsx)(QuillTab_1.default, { width: "486px", modeToggleOptions: credentialTabOptions, toggleMode: credentialTab, setToggleMode: setCredentialTab })] })), credentialTab === 'Database Credentials' ? ((0, jsx_runtime_1.jsx)("div", { id: "database-details-form", children: (0, jsx_runtime_1.jsx)("div", { style: {
-                                        display: 'grid',
-                                        gridTemplateColumns: 'repeat(3, 1fr)',
-                                        gap: '20px',
-                                        justifyContent: 'space-between',
-                                        marginTop: '16px',
-                                    }, children: 
-                                    // get a list of types in the databaseConnectionDetails object and create a form for each
-                                    Object.entries(databaseConnectionDetails).map(([key, value]) => {
-                                        if (key !== 'connectionString' && key !== 'type')
-                                            return ((0, jsx_runtime_1.jsxs)("div", { "data-testid": `quill-input-${key}`, children: [(0, jsx_runtime_1.jsx)("h2", { style: {
-                                                            ...header2Style,
-                                                            fontWeight: '600',
-                                                        }, children: key
-                                                            .split(/(?=[A-Z])/)
-                                                            .map((word) => word.charAt(0).toUpperCase() +
-                                                            word.slice(1))
-                                                            .join(' ') }), (0, jsx_runtime_1.jsx)(primitives_1.TextInputPrimitive, { onChange: (e) => {
-                                                            setConnectionDetails({
-                                                                ...databaseConnectionDetails,
-                                                                [key]: e.target.value,
-                                                                connectionString: '',
-                                                            });
-                                                        }, value: value, disabled: key === 'type', password: key === 'password' ? true : false })] }, key));
-                                    }) }) })) : ((0, jsx_runtime_1.jsxs)("div", { "data-testid": "quill-input-connectionString", children: [(0, jsx_runtime_1.jsx)("h2", { style: { ...header2Style, fontWeight: 600 }, children: "Connection String" }), (0, jsx_runtime_1.jsx)(primitives_1.TextInputPrimitive, { onChange: (e) => {
-                                            updateConnectionString(e.target.value);
-                                        }, value: databaseConnectionDetails.connectionString })] }))] })) : ((0, jsx_runtime_1.jsx)("div", { style: { minWidth: 790 }, children: (0, jsx_runtime_1.jsx)("div", { id: "database-details-form-bq", style: {
-                                display: 'grid',
-                                gridTemplateColumns: 'repeat(1, 1fr)',
-                                gap: '20px',
-                                justifyContent: 'space-between',
-                                marginTop: '16px',
-                            }, children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h2", { style: { ...header2Style, fontWeight: '600' }, children: "Service Account Json" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("input", { title: "Upload JSON", type: "file", accept: ".json", onChange: handleFileChange, style: { display: 'none' }, id: "fileInput", "data-testid": "quill-input-fileInput", ref: myInputRef }), (0, jsx_runtime_1.jsxs)("div", { style: {
-                                                    display: 'flex',
-                                                    flexDirection: 'row',
-                                                    gap: 12,
-                                                    alignItems: 'center',
-                                                }, children: [(0, jsx_runtime_1.jsx)(primitives_1.ButtonPrimitive, { onClick: handleButtonClick, label: 'Upload JSON' }), (0, jsx_runtime_1.jsx)("span", { "data-testid": "quill-file-label", style: { ...header2Style, fontWeight: '600' }, children: fileLabel })] })] })] }) }) })), (0, jsx_runtime_1.jsxs)("div", { style: {
+                }, children: [(0, jsx_runtime_1.jsx)("h1", { style: header1Style, children: "Connect Database" }), clientId && !!selectedSchemas?.length && ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: "currentColor", width: "24px", height: "24px", children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Zm3.857-9.809a.75.75 0 0 0-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 1 0-1.06 1.061l2.5 2.5a.75.75 0 0 0 1.137-.089l4-5.5Z", clipRule: "evenodd" }) }))] }), !state.isSelfHosted && ((0, jsx_runtime_1.jsxs)("div", { style: { marginTop: 12 }, children: [(0, jsx_runtime_1.jsx)("h2", { style: { ...header2Style, fontWeight: 600 }, children: "Database type" }), (0, jsx_runtime_1.jsx)("div", { style: { display: 'flex', gap: 10, userSelect: 'none' }, children: databases_1.DATABASE_DEFAULT_INFO.map((database) => {
+                            return ((0, jsx_runtime_1.jsx)(DatabaseSelector_1.default, { onDatabaseSelect: onDatabaseSelect, databaseType: databaseConnectionDetails?.type || '', containerStyle: {
+                                    marginBottom: '12px',
+                                    ...(state.isSelfHosted && {
+                                        cursor: 'not-allowed',
+                                        pointerEvents: 'none',
+                                    }),
+                                    ...(state.isSelfHosted &&
+                                        database.value.toLowerCase() !==
+                                            environmentDetails.connection.type.toLowerCase() && {
+                                        backgroundColor: '#f5f5f5',
+                                    }),
+                                }, label: database.label, value: database.value, imageUrl: database.imageUrl, theme: state.theme }, database.label));
+                        }) })] })), databaseConnectionDetails && ((0, jsx_runtime_1.jsxs)("div", { children: [!state.isSelfHosted && ((0, jsx_runtime_1.jsx)("div", { children: databaseConnectionDetails.type !== 'BigQuery' ? ((0, jsx_runtime_1.jsxs)("div", { children: [['MySQL', 'PostgreSQL'].includes(databaseConnectionDetails.type) && ((0, jsx_runtime_1.jsxs)("div", { style: { marginTop: 16, marginBottom: 24 }, children: [(0, jsx_runtime_1.jsx)("h2", { style: {
+                                                ...header2Style,
+                                                fontWeight: 600,
+                                                marginBottom: 8,
+                                            }, children: "Connection Method" }), (0, jsx_runtime_1.jsx)(QuillTab_1.default, { width: "486px", modeToggleOptions: credentialTabOptions, toggleMode: credentialTab, setToggleMode: setCredentialTab })] })), credentialTab === 'Database Credentials' ? ((0, jsx_runtime_1.jsx)("div", { id: "database-details-form", children: (0, jsx_runtime_1.jsx)("div", { style: {
+                                            display: 'grid',
+                                            gridTemplateColumns: 'repeat(3, 1fr)',
+                                            gap: '20px',
+                                            justifyContent: 'space-between',
+                                            marginTop: '16px',
+                                        }, children: 
+                                        // get a list of types in the databaseConnectionDetails object and create a form for each
+                                        Object.entries(databaseConnectionDetails).map(([key, value]) => {
+                                            if (key !== 'connectionString' && key !== 'type')
+                                                return ((0, jsx_runtime_1.jsxs)("div", { "data-testid": `quill-input-${key}`, children: [(0, jsx_runtime_1.jsx)("h2", { style: {
+                                                                ...header2Style,
+                                                                fontWeight: '600',
+                                                            }, children: key
+                                                                .split(/(?=[A-Z])/)
+                                                                .map((word) => word.charAt(0).toUpperCase() +
+                                                                word.slice(1))
+                                                                .join(' ') }), (0, jsx_runtime_1.jsx)(primitives_1.TextInputPrimitive, { onChange: (e) => {
+                                                                setConnectionDetails({
+                                                                    ...databaseConnectionDetails,
+                                                                    [key]: e.target.value,
+                                                                    connectionString: '',
+                                                                });
+                                                            }, value: value, disabled: key === 'type', password: key === 'password' ? true : false })] }, key));
+                                        }) }) })) : ((0, jsx_runtime_1.jsxs)("div", { "data-testid": "quill-input-connectionString", children: [(0, jsx_runtime_1.jsx)("h2", { style: { ...header2Style, fontWeight: 600 }, children: "Connection String" }), (0, jsx_runtime_1.jsx)(primitives_1.TextInputPrimitive, { onChange: (e) => {
+                                                updateConnectionString(e.target.value);
+                                            }, value: databaseConnectionDetails.connectionString })] }))] })) : ((0, jsx_runtime_1.jsx)("div", { style: { minWidth: 790 }, children: (0, jsx_runtime_1.jsx)("div", { id: "database-details-form-bq", style: {
+                                    display: 'grid',
+                                    gridTemplateColumns: 'repeat(1, 1fr)',
+                                    gap: '20px',
+                                    justifyContent: 'space-between',
+                                    marginTop: '16px',
+                                }, children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h2", { style: { ...header2Style, fontWeight: '600' }, children: "Service Account Json" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("input", { title: "Upload JSON", type: "file", accept: ".json", onChange: handleFileChange, style: { display: 'none' }, id: "fileInput", "data-testid": "quill-input-fileInput", ref: myInputRef }), (0, jsx_runtime_1.jsxs)("div", { style: {
+                                                        display: 'flex',
+                                                        flexDirection: 'row',
+                                                        gap: 12,
+                                                        alignItems: 'center',
+                                                    }, children: [(0, jsx_runtime_1.jsx)(primitives_1.ButtonPrimitive, { onClick: handleButtonClick, label: 'Upload JSON' }), (0, jsx_runtime_1.jsx)("span", { "data-testid": "quill-file-label", style: { ...header2Style, fontWeight: '600' }, children: fileLabel })] })] })] }) }) })) })), state.isSelfHosted ? ((0, jsx_runtime_1.jsxs)("div", { style: {
+                            borderRadius: 6,
+                            padding: 12,
+                            background: '#f5f5f5',
+                            marginBottom: 18,
+                            marginTop: 18,
+                            fontSize: 14,
+                        }, children: [(0, jsx_runtime_1.jsx)("h2", { style: { ...header2Style, fontWeight: 600 }, children: "Self-hosted Database Connection" }), (0, jsx_runtime_1.jsx)("div", { style: {
+                                    display: 'flex',
+                                    flexDirection: 'row',
+                                    alignItems: 'center',
+                                    gap: 4,
+                                    color: state.theme?.secondaryTextColor,
+                                    fontFamily: state.theme?.fontFamily,
+                                }, children: `Using the database credentials passed into the Quill Server SDK at this endpoint: ${state.queryEndpoint}.` })] })) : ((0, jsx_runtime_1.jsxs)("div", { style: {
                             borderRadius: 6,
                             padding: 12,
                             background: '#f5f5f5',
@@ -231,6 +332,8 @@ function ConnectDatabase({ containerStyle, header1Style, header2Style, environme
                                     flexDirection: 'row',
                                     alignItems: 'center',
                                     gap: 4,
+                                    color: state.theme?.secondaryTextColor,
+                                    fontFamily: state.theme?.fontFamily,
                                 }, children: ["Ensure Quill's IP is allowed to connect to your database", ' ', (0, jsx_runtime_1.jsx)(ExternalLink_1.default, { href: databaseConnectionDetails.type.toLowerCase() === 'bigquery'
                                             ? 'https://cloud.google.com/access-context-manager/docs/overview#ip-address'
                                             : databaseConnectionDetails.type.toLowerCase() === 'mysql'
@@ -246,18 +349,26 @@ function ConnectDatabase({ containerStyle, header1Style, header2Style, environme
                                                             ? 'https://clickhouse.com/docs/cloud/security/setting-ip-filters/'
                                                             : 'https://www.postgresql.org/docs/current/auth-pg-hba-conf.html' })] }), (0, jsx_runtime_1.jsx)(ClipboardButton_1.default, { text: "34.133.137.225", containerStyle: {
                                     marginTop: 12,
-                                } })] }), (0, jsx_runtime_1.jsx)("div", { style: {
+                                } })] })), (0, jsx_runtime_1.jsx)("div", { style: {
                             width: '100%',
                             display: 'flex',
                             justifyContent: 'space-between',
                             alignItems: 'center',
                             marginTop: '24px',
-                        }, "data-testid": "quill-connect-button", children: (0, jsx_runtime_1.jsx)(primitives_1.ButtonPrimitive, { label: 'Connect', onClick: testConnectionAndFormClient, disabled: isButtonDisabled, isLoading: isConnecting }) })] })), (0, jsx_runtime_1.jsx)(primitives_1.ModalPrimitive, { isOpen: !!error, onClose: () => setError(undefined), style: {
+                        }, "data-testid": "quill-connect-button", children: (0, jsx_runtime_1.jsx)(primitives_1.ButtonPrimitive, { label: 'Connect', onClick: () => {
+                                if (state.isSelfHosted) {
+                                    getSchemaNames();
+                                }
+                                else {
+                                    testConnectionAndFormClient();
+                                }
+                            }, disabled: isButtonDisabled && !state.isSelfHosted, isLoading: isConnecting }) })] })), (0, jsx_runtime_1.jsx)(primitives_1.ModalPrimitive, { isOpen: !!error, onClose: () => setError(undefined), style: {
                     width: 420,
                 }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
                         display: 'flex',
                         flexDirection: 'column',
                         gap: 20,
+                        fontFamily: state.theme?.fontFamily,
                         width: '100%',
                     }, children: [(0, jsx_runtime_1.jsx)(CardSection_1.default, { children: "Failed to Connect" }), (0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column', gap: 5 }, children: [(0, jsx_runtime_1.jsx)("div", { style: {
                                         color: 'red',
@@ -286,6 +397,7 @@ function ConnectDatabase({ containerStyle, header1Style, header2Style, environme
                         flexDirection: 'column',
                         gap: 20,
                         width: '100%',
+                        fontFamily: state.theme?.fontFamily,
                     }, children: [(0, jsx_runtime_1.jsx)(CardSection_1.default, { children: "Connection Successful" }), (0, jsx_runtime_1.jsx)("h2", { style: {
                                 fontSize: 15,
                                 fontWeight: 500,

package/dist/cjs/forms/client_onboard/ConnectSchema.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConnectSchema.d.ts","sourceRoot":"","sources":["../../../../src/forms/client_onboard/ConnectSchema.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAgC,MAAM,OAAO,CAAC;AAOpE,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,KAAK,EAAY,MAAM,qBAAqB,CAAC;AAEtD,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAMhD,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,cAAc,EACd,YAAY,EAEZ,cAAc,EACd,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,QAAQ,EACR,eAAe,EACf,KAAK,EACL,KAAK,EACL,uBAAuB,GACxB,EAAE;IACD,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,cAAc,EAAE,cAAc,EAAE,CAAC;IACjC,UAAU,EAAE,cAAc,CAAC;IAC3B,UAAU,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IAChC,gBAAgB,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;IACnD,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,MAAM,EAAE,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,uBAAuB,EAAE,MAAM,IAAI,CAAC;CACrC,2CA0SA"}
+{"version":3,"file":"ConnectSchema.d.ts","sourceRoot":"","sources":["../../../../src/forms/client_onboard/ConnectSchema.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAgC,MAAM,OAAO,CAAC;AAOpE,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,KAAK,EAAY,MAAM,qBAAqB,CAAC;AAEtD,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAOhD,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,cAAc,EACd,YAAY,EAEZ,cAAc,EACd,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,QAAQ,EACR,eAAe,EACf,KAAK,EACL,KAAK,EACL,uBAAuB,GACxB,EAAE;IACD,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,cAAc,EAAE,cAAc,EAAE,CAAC;IACjC,UAAU,EAAE,cAAc,CAAC;IAC3B,UAAU,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IAChC,gBAAgB,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;IACnD,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,MAAM,EAAE,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,uBAAuB,EAAE,MAAM,IAAI,CAAC;CACrC,2CA6UA"}

package/dist/cjs/forms/client_onboard/ConnectSchema.js

@@ -12,15 +12,20 @@ const EditTenant_1 = require("../../components/Tenants/EditTenant");
 const CardSection_1 = __importDefault(require("../../components/CardSection"));
 const useDatabaseSchema_1 = require("../../hooks/useDatabaseSchema");
 const UiComponents_1 = require("../../components/UiComponents");
+const useLongLoading_1 = require("../../hooks/useLongLoading");
 function ConnectSchema({ containerStyle, header1Style, 
 // header2Style,
 databaseSchema, connection, tenantInit, onTenantCreation, clientId, selectedSchemas, state, label, returnToConnectDatabase, }) {
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     const [formError, setFormError] = (0, react_1.useState)(undefined);
     const [isSubmitTenantLoading, setSubmitTenantLoading] = (0, react_1.useState)(false);
+    (0, useLongLoading_1.useLongLoading)(isSubmitTenantLoading, {
+        origin: 'ConnectSchema',
+        loadDescription: 'Submitting tenant',
+    });
     const [tenantToEdit, setTenantToEdit] = (0, react_1.useState)(tenantInit?.ownerTenant);
     const { schema, isLoading } = (0, useDatabaseSchema_1.useDatabaseSchema)();
-    const { quillFetchWithToken } = (0, AdminProvider_1.useAdmin)();
+    const { quillFetchWithToken, eventTracking } = (0, AdminProvider_1.useAdmin)();
     const tenantRequest = async (tenant, mode, isOnboarding) => {
         return await quillFetchWithToken({
             client: {
@@ -76,6 +81,17 @@ databaseSchema, connection, tenantInit, onTenantCreation, clientId, selectedSche
         }
         catch (e) {
             console.log('error', e);
+            eventTracking?.logError?.({
+                type: 'bug', // TODO: determine type
+                severity: 'high',
+                message: 'Error updating tenant',
+                errorMessage: e.message,
+                errorStack: e.stack,
+                errorData: {
+                    caller: 'ConnectSchema',
+                    function: 'onSubmitEditTenant',
+                },
+            });
             setFormError('Error updating tenant');
         }
         finally {
@@ -105,11 +121,27 @@ databaseSchema, connection, tenantInit, onTenantCreation, clientId, selectedSche
                 if (!results?.length) {
                     setFormError(`No rows were returned from this ${tenant.tenantTableQuery ? 'query' : 'table'}`);
                 }
+                const uniqueIds = new Set(results?.map((r) => r.id));
+                if (uniqueIds.size < results?.length) {
+                    setFormError('Duplicate tenant IDs found in results. Each tenant must have a unique ID.');
+                    return [];
+                }
                 return results;
             }
         }
         catch (e) {
             console.log('error', e);
+            eventTracking?.logError?.({
+                type: 'bug', // TODO: determine type
+                severity: 'high',
+                message: 'Error validating tenant',
+                errorMessage: e.message,
+                errorStack: e.stack,
+                errorData: {
+                    caller: 'ConnectSchema',
+                    function: 'onValidateEditTenant',
+                },
+            });
             setFormError('Error validating tenant');
             return [];
         }
@@ -129,7 +161,8 @@ databaseSchema, connection, tenantInit, onTenantCreation, clientId, selectedSche
                         }, children: [(0, jsx_runtime_1.jsx)("h2", { style: {
                                     fontSize: 15,
                                     fontWeight: 500,
-                                    color: '#6e6e6e',
+                                    color: state.theme?.secondaryTextColor,
+                                    fontFamily: state.theme?.fontFamily,
                                     paddingBottom: 20,
                                 }, children: `How do you represent your customers in your database?` }), (0, jsx_runtime_1.jsx)(EditTenant_1.EditTenant, { tenant: tenantToEdit, setTenant: (tenant) => setTenantToEdit(tenant), setCreateNewTenant: () => { }, onSubmitEditTenant: onSubmitEditTenant, onValidateEditTenant: onValidateEditTenant, SecondaryButtonComponent: primitives_1.SecondaryButtonPrimitive, TextInputComponent: primitives_1.TextInputPrimitive, ButtonComponent: UiComponents_1.MemoizedButton, isSubmitTenantLoading: isSubmitTenantLoading, client: {
                                     id: clientId,
@@ -144,6 +177,7 @@ databaseSchema, connection, tenantInit, onTenantCreation, clientId, selectedSche
                         display: 'flex',
                         flexDirection: 'column',
                         gap: 20,
+                        fontFamily: state.theme?.fontFamily,
                         width: '100%',
                     }, children: [(0, jsx_runtime_1.jsx)(CardSection_1.default, { children: noTables ? 'Schema Issue' : 'Tenant Issue' }), (0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column', gap: 5 }, children: [(0, jsx_runtime_1.jsx)("div", { style: {
                                         color: 'red',

package/dist/cjs/forms/client_onboard/CreateVirtualTables.d.ts

@@ -38,10 +38,11 @@ export declare function VirtualTableModal({ isOpen, setIsOpen, queryInfo, setQue
     }) => void;
     addVirtualTable: (e: boolean) => Promise<void>;
 }): import("react/jsx-runtime").JSX.Element;
-export declare function TenantFieldModal({ isOpen, setClosed, tenant, onOverride, }: {
+export declare function TenantFieldModal({ isOpen, setClosed, tenant, onOverride, errorType, }: {
     isOpen: boolean;
     setClosed: () => void;
     tenant?: QuillTenant;
     onOverride?: () => void;
+    errorType?: 'missing' | 'type_mismatch';
 }): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=CreateVirtualTables.d.ts.map

package/dist/cjs/forms/client_onboard/CreateVirtualTables.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CreateVirtualTables.d.ts","sourceRoot":"","sources":["../../../../src/forms/client_onboard/CreateVirtualTables.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAA+B,MAAM,OAAO,CAAC;AACnE,OAAO,EAAU,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAY3D,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAOvD,OAAO,EAAE,KAAK,EAAY,MAAM,qBAAqB,CAAC;AAGtD,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAC;AAC7E,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAEhD,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAC1C,cAAc,EACd,YAAY,EACZ,YAAY,EACZ,kBAAkB,EAClB,cAAc,EACd,kBAAkB,EAClB,MAAM,EACN,KAAK,EACL,UAAU,EACV,SAAS,EACT,SAAS,EACT,YAAY,GACb,EAAE;IACD,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,cAAc,EAAE,cAAc,EAAE,CAAC;IACjC,kBAAkB,CAAC,EAAE,cAAc,CAAC;IACpC,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,MAAM,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAAC;IACrC,KAAK,EAAE,KAAK,CAAC;IACb,UAAU,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IAChC,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACjD,YAAY,EAAE,CAAC,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,EAAE,KAAK,IAAI,CAAC;CAClE,2CAoiBA;AAED,wBAAgB,iBAAiB,CAAC,EAChC,MAAM,EACN,SAAS,EACT,SAAS,EACT,YAAY,EACZ,eAAe,GAChB,EAAE;IACD,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAChC,SAAS,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IAC3C,YAAY,EAAE,CAAC,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC3D,eAAe,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAChD,2CAqHA;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,SAAS,EACT,MAAM,EACN,UAAU,GACX,EAAE;IACD,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB,2CA8EA"}
+{"version":3,"file":"CreateVirtualTables.d.ts","sourceRoot":"","sources":["../../../../src/forms/client_onboard/CreateVirtualTables.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAA+B,MAAM,OAAO,CAAC;AACnE,OAAO,EAAkB,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAYnE,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAOvD,OAAO,EAAE,KAAK,EAAY,MAAM,qBAAqB,CAAC;AAGtD,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAC;AAC7E,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAGhD,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAC1C,cAAc,EACd,YAAY,EACZ,YAAY,EACZ,kBAAkB,EAClB,cAAc,EACd,kBAAkB,EAClB,MAAM,EACN,KAAK,EACL,UAAU,EACV,SAAS,EACT,SAAS,EACT,YAAY,GACb,EAAE;IACD,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,cAAc,EAAE,cAAc,EAAE,CAAC;IACjC,kBAAkB,CAAC,EAAE,cAAc,CAAC;IACpC,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,MAAM,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAAC;IACrC,KAAK,EAAE,KAAK,CAAC;IACb,UAAU,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IAChC,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACjD,YAAY,EAAE,CAAC,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,EAAE,KAAK,IAAI,CAAC;CAClE,2CA2jBA;AAED,wBAAgB,iBAAiB,CAAC,EAChC,MAAM,EACN,SAAS,EACT,SAAS,EACT,YAAY,EACZ,eAAe,GAChB,EAAE;IACD,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAChC,SAAS,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IAC3C,YAAY,EAAE,CAAC,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC3D,eAAe,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAChD,2CA2HA;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,SAAS,EACT,MAAM,EACN,UAAU,EACV,SAAqB,GACtB,EAAE;IACD,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,SAAS,CAAC,EAAE,SAAS,GAAG,eAAe,CAAC;CACzC,2CAwHA"}