@quillsql/admin 1.6.1 → 1.6.3

package/dist/esm/public_components/SQLViewManager.js

@@ -1,555 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useEffect, useRef, useState } from 'react';
-import { ButtonPrimitive, ModalPrimitive, TextInputPrimitive, } from '../primitives';
-import { useAdmin } from '../AdminProvider';
-import { EnvSelectPopover } from '../components';
-import { TableCell } from '../Admin';
-import CreateEditSqlView from '../forms/sql_views/CreateEditSqlView';
-import { addSqlView, editSQLView, deleteSQLView } from '../utils/dataEditor';
-import { getSqlViewData, getTableColumnsBySchema, } from '../api/ConnectionClient';
-import { LoadingSpinner, MemoizedButton, MemoizedDeleteButton, MemoizedModal, MemoizedSecondaryButton, } from '../components/UiComponents';
-import DatabaseMismatchCard from '../components/DatabaseMismatchCard';
-import TogglePrimitive from '../primitives/TogglePrimitive';
-import { SegmentedControl } from '../components/SegmentedControl';
-import SqlTextEditor from '../components/SqlTextEditor';
-import { Table } from '@quillsql/react';
-import { getSchemaInfo } from '../utils/schema';
-import { PromoteViewModal } from '../modals';
-export const getDuplicateColumns = (columns) => {
-    if (!columns) {
-        return [];
-    }
-    const columnCount = columns?.reduce((acc, curr) => {
-        if (acc[curr.field]) {
-            acc[curr.field] += 1;
-        }
-        else {
-            acc[curr.field] = 1;
-        }
-        return acc;
-    }, {});
-    return Object.keys(columnCount).filter((column) => columnCount[column] > 1);
-};
-export default function SQLViewManager({ containerStyle, }) {
-    const [tables, setTables] = useState(undefined);
-    const [modalIsOpen, setIsOpen] = useState(false);
-    const [editModalIsOpen, setEditModalIsOpen] = useState(false);
-    const [editQueryView, setEditQueryView] = useState(false);
-    const [name, setName] = useState('');
-    const [viewQuery, setViewQuery] = useState('');
-    const [editViewId, setEditViewId] = useState('');
-    const [editName, setEditName] = useState('');
-    const [editViewQuery, setEditViewQuery] = useState('');
-    const [tableToBeDeleted, setTableToBeDeleted] = useState('');
-    const [deleteName, setDeleteName] = useState('');
-    const [deleteModalIsOpen, setDeleteModalIsOpen] = useState(false);
-    const [isPromoteViewModalOpen, setIsPromoteViewModalOpen] = useState(false);
-    const [allTableData, setAllTableData] = useState([]);
-    const [referencedTablesMap, setReferencedTablesMap] = useState({});
-    const [schemaIsLoading, setSchemaIsLoading] = useState(false);
-    const [customFieldInfo, setCustomFieldInfo] = useState(undefined);
-    const [provider, setProvider] = useState(null);
-    const [initialSqlView, setInitialSqlView] = useState(undefined);
-    const [submittingView, setSubmittingView] = useState(false);
-    const parentRef = useRef(null);
-    const { state, dispatch } = useAdmin();
-    const closeEditModal = () => {
-        setEditModalIsOpen(false);
-        setEditName('');
-        setEditViewQuery('');
-        setCustomFieldInfo(undefined);
-    };
-    const clickTableCell = (table) => {
-        setEditName(table.name);
-        setEditViewQuery(table.viewQuery);
-        setEditViewId(table._id);
-        setInitialSqlView({
-            id: table._id,
-            name: table.name,
-            query: table.viewQuery,
-        });
-        setCustomFieldInfo(table.customFieldInfo);
-        setEditModalIsOpen(true);
-    };
-    const getTables = async () => {
-        const schemaData = await getSchemaInfo({
-            queryEndpoint: state.queryEndpoint,
-            queryHeaders: state.queryHeaders,
-            publicKey: state.client._id,
-            customerId: state.client.customerId,
-            gatherSchemaData: false,
-        }, 'svm');
-        setTables(schemaData);
-    };
-    const getSchemaTableDetails = async () => {
-        setSchemaIsLoading(true);
-        const response = await 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);
-    };
-    useEffect(() => {
-        let isSubscribed = true;
-        if (isSubscribed && state.client) {
-            getTables();
-            getSchemaTableDetails();
-            getReferencedTablesMap();
-        }
-        return () => {
-            isSubscribed = false;
-        };
-    }, [state.client]);
-    const handleModalSubmit = async (submitRequest, query, name, id, columns, customFieldInfo) => {
-        try {
-            const prevTableName = tables?.find((table) => table._id === id)?.name;
-            const isPlural = referencedTablesMap &&
-                referencedTablesMap[prevTableName] &&
-                referencedTablesMap[prevTableName].length > 1
-                ? 's'
-                : '';
-            let trimmedName = name?.trim() || undefined;
-            let submitResponse;
-            switch (submitRequest) {
-                case 'add':
-                    if (!trimmedName) {
-                        alert('No name found');
-                        return;
-                    }
-                    if (tables?.map((table) => table.name).includes(trimmedName)) {
-                        alert('Name already exists');
-                        return;
-                    }
-                    // determine if there are duplicate names if there are then alert the user
-                    let duplicateColumns = getDuplicateColumns(columns);
-                    if (duplicateColumns.length > 0) {
-                        alert(`Ambiguous column names found. Either use aliases or remove the column to make every column name unique: \n\n${duplicateColumns.join('\n')}`);
-                        return;
-                    }
-                    if (!/^[a-z0-9_]+$/.test(trimmedName)) {
-                        alert('Names can only include lowercase letters, numbers, and underscores');
-                        return;
-                    }
-                    submitResponse = await addSqlView(trimmedName, query, customFieldInfo, 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 (!trimmedName) {
-                        alert('No name found');
-                        return;
-                    }
-                    if (!/^[a-z0-9_]+$/.test(trimmedName)) {
-                        alert('Names can only include lowercase letters, numbers, and underscores');
-                        return;
-                    }
-                    // determine if there are duplicate names if there are then alert the user
-                    const duplicateColumns2 = getDuplicateColumns(columns);
-                    if (duplicateColumns2.length > 0) {
-                        alert(`Ambiguous column names found. Either use aliases or remove the column to make every column name unique: \n\n${duplicateColumns2.join('\n')}`);
-                        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(trimmedName)) {
-                        alert('Name already exists');
-                        return;
-                    }
-                    submitResponse = await editSQLView(trimmedName, query, id, customFieldInfo, state);
-                    break;
-                case 'delete':
-                    if (!id) {
-                        alert('No id found');
-                        return;
-                    }
-                    // Determine if the table is referenced in other charts
-                    if (referencedTablesMap && referencedTablesMap[prevTableName]) {
-                        const referencedTableInfo = referencedTablesMap[prevTableName].map((info) => {
-                            return `${info.dashboardName} - ${info.reportName}`;
-                        });
-                        alert(`This table is referenced in the following dashboard${isPlural}/chart${isPlural}.\n\n${referencedTableInfo.join('\n')} \n\nPlease delete those charts before deleting this table.`);
-                        return;
-                    }
-                    submitResponse = await deleteSQLView(id, state);
-                    break;
-                default:
-                    setEditName('');
-                    setEditViewQuery(query);
-                    setEditViewId('');
-                    setEditModalIsOpen(true);
-                    return;
-            }
-            if (submitResponse.status !== 'success') {
-                alert(`There was an error processing your ${submitRequest} request.`);
-                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, undefined, undefined, columns);
-                break;
-        }
-    };
-    useEffect(() => {
-        getTables();
-    }, [state.client]);
-    return (_jsxs("div", { style: { ...containerStyle }, children: [_jsxs("div", { style: {
-                    display: 'flex',
-                    flexDirection: 'column',
-                    paddingTop: '0px',
-                    position: 'relative',
-                }, ref: parentRef, children: [(state.databaseTypeMismatch.show || !editQueryView) && (_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: _jsxs("div", { style: {
-                                display: 'flex',
-                                flexDirection: 'row',
-                                alignItems: 'flex-end',
-                                justifyContent: 'space-between',
-                                width: '100%',
-                                // marginLeft: '25px'
-                            }, children: [_jsxs("div", { style: { display: 'flex', flexDirection: 'column' }, children: [_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" }), _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: () => setIsPromoteViewModalOpen(true) })] }), !editQueryView && !state.databaseTypeMismatch.show && (_jsx(ButtonPrimitive, { onClick: () => {
-                                        setEditName('');
-                                        setEditViewQuery('');
-                                        setEditViewId('');
-                                        setInitialSqlView(undefined);
-                                        setEditQueryView(true);
-                                    }, label: "Add view +" }))] }) })), state.databaseTypeMismatch.show ? (_jsx(DatabaseMismatchCard, { environemntName: state.client.name, environemntDatabaseType: state.client.databaseType, backendDatabaseType: state.databaseTypeMismatch.backendDatabaseType })) : (_jsx(_Fragment, { children: !editQueryView ? (_jsx("div", { style: {
-                                display: 'flex',
-                                flexWrap: 'wrap',
-                                paddingLeft: 25,
-                                paddingRight: 25,
-                                paddingTop: 25,
-                            }, children: tables && tables?.length
-                                ? tables.map((table) => (_jsx(TableCell, { table: table, clickTableCell: clickTableCell }, table._id)))
-                                : null }, 'edit-view-query')) : (_jsx(CreateEditSqlView, { containerStyle: {}, initialSqlView: initialSqlView, closeEditView: () => setEditQueryView(false), addEditView: (request, name, query, id, columns) => {
-                                handleEditAddView(request, name, query, id, columns);
-                            }, setProvider: (provider) => { setProvider(provider); }, provider: provider, allTableData: allTableData, schemaIsLoading: schemaIsLoading })) }))] }), _jsx(PromoteViewModal, { clientId: state.client._id, client: state.client, clients: state.clients, isOpen: isPromoteViewModalOpen, setIsOpen: setIsPromoteViewModalOpen, ModalComponent: MemoizedModal, views: tables || [], parentRef: parentRef }), _jsx(EditAddViewModal, { viewName: editName, viewQuery: editViewQuery, viewId: editViewId, editModalIsOpen: editModalIsOpen, customFieldInfo: customFieldInfo, closeEditModal: closeEditModal, submit: async (submitRequest, query, name, id, columns, customFieldInfo) => {
-                    if (submitRequest !== 'delete') {
-                        setSubmittingView(true);
-                    }
-                    await handleModalSubmit(submitRequest, query, name, id, columns, customFieldInfo);
-                    setSubmittingView(false);
-                }, state: state, onEditViewClick: () => setEditQueryView(true), isLoading: submittingView })] }));
-}
-function EditAddViewModal({ viewName, viewQuery, viewId, editModalIsOpen, customFieldInfo, closeEditModal, submit, state, onEditViewClick = () => { }, isLoading, }) {
-    const [name, setName] = useState(viewName);
-    const [query, setQuery] = useState(viewQuery);
-    const [id, setId] = useState(viewId);
-    const [useCustomField, setUseCustomField] = useState(customFieldInfo ? true : false);
-    const [customFieldType, setCustomFieldType] = useState(customFieldInfo ? customFieldInfo.type : 'eav');
-    const [customFieldQuery, setCustomFieldQuery] = useState(customFieldInfo ? customFieldInfo.query : '');
-    const [runQueryButtonLoading, setRunQueryButtonLoading] = useState(false);
-    const [tableData, setTableData] = useState(undefined);
-    const [errorInfo, setErrorInfo] = useState({ show: false, message: '' });
-    useEffect(() => {
-        setCustomFieldQuery(customFieldInfo?.query || '');
-        setCustomFieldType(customFieldInfo?.type || 'eav');
-        setUseCustomField(customFieldInfo ? true : false);
-    }, [customFieldInfo]);
-    useEffect(() => {
-        setName(viewName);
-    }, [viewName]);
-    useEffect(() => {
-        setQuery(viewQuery);
-    }, [viewQuery]);
-    useEffect(() => {
-        setId(viewId);
-    }, [viewId]);
-    return (_jsx(ModalPrimitive, { isOpen: editModalIsOpen, close: () => {
-            setUseCustomField(false);
-            setCustomFieldType('eav');
-            setCustomFieldQuery('');
-            setTableData(undefined);
-            setErrorInfo({ show: false, message: '' });
-            setName('');
-            closeEditModal();
-        }, children: _jsxs("div", { style: { height: '100%', overflow: 'scroll', width: '100%' }, children: [_jsxs("div", { style: {
-                        display: 'flex',
-                        flexDirection: 'row',
-                        alignItems: 'center',
-                        justifyContent: 'space-between',
-                        paddingBottom: '20px',
-                        // width: '100%'
-                    }, children: [_jsx("h1", { style: {
-                                fontSize: '24px',
-                                paddingTop: '0px',
-                                marginTop: '0px',
-                                marginBottom: '0px',
-                                fontWeight: 'bold',
-                                color: '#384151',
-                            }, children: viewName ? 'Edit SQL View' : 'Add SQL View' }), _jsx(MemoizedDeleteButton, { onClick: closeEditModal, style: undefined })] }), _jsx("h3", { style: {
-                        fontWeight: '600',
-                        fontSize: '14px',
-                        marginBottom: '6px',
-                        color: '#212121',
-                    }, children: "Name" }), _jsx(TextInputPrimitive, { placeholder: "Enter view display name...", onChange: (e) => setName(e.target.value), value: name ? name : '' }), _jsx("br", {}), _jsx("h3", { style: {
-                        fontWeight: '600',
-                        fontSize: '14px',
-                        marginBottom: '6px',
-                        color: '#212121',
-                    }, children: "Query" }), _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)',
-                        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: [_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 }), _jsx("div", { style: {
-                                position: 'absolute',
-                                bottom: 0,
-                                left: 0,
-                                right: 0,
-                                height: '90%',
-                                background: 'linear-gradient(transparent, white)',
-                                pointerEvents: 'none',
-                            } }), viewName && (_jsx("div", { style: { position: 'absolute', bottom: '10px', right: '10px' }, children: _jsx(MemoizedSecondaryButton, { label: 'Edit Query   ↗', onClick: () => {
-                                    closeEditModal();
-                                    onEditViewClick();
-                                } }) }))] }), _jsx("br", {}), ['65d65b57cdd8ae70a5648d9c', '665610862cf7a3000be66453'].includes(state.client._id) &&
-                    state.client.databaseType === 'PostgreSQL' && (_jsxs(_Fragment, { children: [_jsx("h3", { style: {
-                                fontWeight: '600',
-                                fontSize: '14px',
-                                marginBottom: '6px',
-                                color: '#212121',
-                            }, children: "Custom fields" }), _jsx(TogglePrimitive, { value: useCustomField, onClick: () => {
-                                setUseCustomField((useCustomField) => !useCustomField);
-                            } }), _jsx("br", {}), useCustomField && (_jsxs(_Fragment, { children: [_jsx("h3", { style: {
-                                        fontWeight: '600',
-                                        fontSize: '14px',
-                                        marginBottom: '6px',
-                                        marginTop: '20px',
-                                        color: '#212121',
-                                    }, children: "Custom field type" }), _jsx(SegmentedControl, { theme: state.theme, value: customFieldType, onChange: (e) => {
-                                        setCustomFieldType(e);
-                                    }, left: 'EAV', right: 'JSON' }), _jsx("br", {}), _jsx("h3", { style: {
-                                        fontWeight: '600',
-                                        fontSize: '14px',
-                                        marginBottom: '6px',
-                                        color: '#212121',
-                                    }, children: "Custom field query" }), _jsx("h3", { style: {
-                                        fontWeight: '400',
-                                        fontSize: '14px',
-                                        marginBottom: '20px',
-                                        color: '#212121',
-                                    }, children: customFieldType === 'eav'
-                                        ? `A table of custom fields. It must have these columns: ref_table, ref_id, field, value, type, ${state.client.customerFieldName.replaceAll('"', '')}.`
-                                        : `A table of custom fields. It must have these columns: ref_table, ref_column, field, ${state.client.customerFieldName.replaceAll('"', '')}.` }), _jsx(SqlTextEditor, { value: customFieldQuery, setValue: (e) => {
-                                        setCustomFieldQuery(e);
-                                    }, setEditorMounted: () => { }, containerStyle: {
-                                        width: 800,
-                                    }, previousProvider: null, height: '150px', schema: [] }), _jsx("br", {}), _jsx(MemoizedButton, { label: 'Run query', onClick: async () => {
-                                        if (/limit\s+\d+\s*;?\s*$/i.test(customFieldQuery)) {
-                                            setErrorInfo({
-                                                show: true,
-                                                message: 'Error: Please remove the limit at the end of your query.',
-                                            });
-                                            return;
-                                        }
-                                        setErrorInfo({ show: false, message: '' });
-                                        setRunQueryButtonLoading(true);
-                                        const getSqlResults = await getSqlViewData(state.client._id, customFieldQuery, state.client.databaseType, state.queryEndpoint);
-                                        if (!getSqlResults.success) {
-                                            setErrorInfo({
-                                                show: true,
-                                                message: getSqlResults.error,
-                                            });
-                                        }
-                                        else {
-                                            setErrorInfo({ show: false, message: '' });
-                                            setTableData(getSqlResults);
-                                        }
-                                        setRunQueryButtonLoading(false);
-                                    } }), _jsx("br", {}), runQueryButtonLoading && (_jsx("div", { style: {
-                                        height: '250px',
-                                        width: '100%',
-                                        display: 'flex',
-                                        justifyContent: 'center',
-                                        alignItems: 'center',
-                                    }, children: _jsx(LoadingSpinner, {}) })), !errorInfo.show && tableData && !runQueryButtonLoading && (_jsx(Table, { rows: tableData.rows, columns: tableData.fields, containerStyle: {
-                                        height: '250px',
-                                        maxWidth: '800px',
-                                        paddingTop: '20px',
-                                    }, hideCSVDownloadButton: true })), errorInfo.show && (_jsx("div", { style: {
-                                        fontSize: 15,
-                                        fontWeight: '400',
-                                        paddingTop: '20px',
-                                    }, children: _jsx("div", { style: {
-                                            padding: 30,
-                                            background: 'rgba(0,0,0,0.02)',
-                                            display: 'inline-block',
-                                            flex: 0,
-                                            borderRadius: 6,
-                                        }, children: errorInfo.message }) }))] }))] })), _jsxs("div", { style: {
-                        display: 'flex',
-                        flexDirection: 'row',
-                        alignItems: 'center',
-                        justifyContent: 'flex-end',
-                        marginTop: 20,
-                        gap: 8,
-                    }, children: [viewName && (_jsx(MemoizedButton, { onClick: () => submit('delete', query, name, id), label: "Delete", style: { color: 'red', backgroundColor: 'white' } })), _jsx(MemoizedButton, { onClick: () => {
-                                if (!name) {
-                                    alert('Please enter a name');
-                                    return;
-                                }
-                                if (useCustomField) {
-                                    const fields = tableData?.fields.map((field) => field.field);
-                                    const missingFields = [];
-                                    if (!fields) {
-                                        alert('Custom field query is missing required columns');
-                                        return;
-                                    }
-                                    if (customFieldType === 'eav') {
-                                        // make sure the tableData has the required columns
-                                        [
-                                            'ref_table',
-                                            'ref_id',
-                                            'field',
-                                            'value',
-                                            'type',
-                                            state.client.customerFieldName.replaceAll('"', ''),
-                                        ].forEach((requiredField) => {
-                                            if (!fields.includes(requiredField)) {
-                                                missingFields.push(requiredField);
-                                            }
-                                        });
-                                    }
-                                    else {
-                                        [
-                                            'ref_table',
-                                            'field',
-                                            'ref_column',
-                                            state.client.customerFieldName.replaceAll('"', ''),
-                                        ].forEach((requiredField) => {
-                                            if (!fields.includes(requiredField)) {
-                                                missingFields.push(requiredField);
-                                            }
-                                        });
-                                    }
-                                    if (missingFields.length > 0) {
-                                        alert(`Custom field query is missing required columns: ${missingFields.join(', ')}`);
-                                        return;
-                                    }
-                                }
-                                submit(viewName ? 'edit' : 'add', query, name, id, undefined, useCustomField
-                                    ? { type: customFieldType, query: customFieldQuery }
-                                    : undefined);
-                            }, label: viewName ? 'Save changes' : 'Create view', isLoading: isLoading })] })] }) }));
-}