script generation refactor - opened in normal QueryTab

This commit is contained in:
Jan Prochazka
2020-05-06 21:27:11 +02:00
parent 04e22e7e7c
commit 54fb4d214d
7 changed files with 87 additions and 81 deletions

View File

@@ -26,7 +26,7 @@ const menus = {
},
{
label: 'Show CREATE TABLE script',
tab: 'TableCreateScriptTab',
sqlTemplate: 'CREATE TABLE',
},
],
views: [
@@ -36,23 +36,23 @@ const menus = {
},
{
label: 'Show CREATE VIEW script',
tab: 'SqlObjectCreateScriptTab',
sqlTemplate: 'CREATE OBJECT',
},
],
procedures: [
{
label: 'Show CREATE PROCEDURE script',
tab: 'SqlObjectCreateScriptTab',
sqlTemplate: 'CREATE OBJECT',
},
{
label: 'Show EXECUTE script',
tab: 'ExecuteProcedureTab',
sqlTemplate: 'EXECUTE PROCEDURE',
},
],
functions: [
{
label: 'Show CREATE FUNCTION script',
tab: 'SqlObjectCreateScriptTab',
sqlTemplate: 'CREATE OBJECT',
},
],
};
@@ -60,13 +60,12 @@ const menus = {
const defaultTabs = {
tables: 'TableDataTab',
views: 'ViewDataTab',
procedures: 'SqlObjectCreateScriptTab',
functions: 'SqlObjectCreateScriptTab',
};
async function openObjectDetail(
setOpenedTabs,
tabComponent,
sqlTemplate,
{ schemaName, pureName, conid, database, objectTypeField }
) {
const connection = await getConnectionInfo({ conid });
@@ -78,14 +77,15 @@ async function openObjectDetail(
openNewTab(setOpenedTabs, {
title: pureName,
tooltip,
icon: icons[objectTypeField],
tabComponent,
icon: sqlTemplate ? 'sql.svg' : icons[objectTypeField],
tabComponent: sqlTemplate ? 'QueryTab' : tabComponent,
props: {
schemaName,
pureName,
conid,
database,
objectTypeField,
initialArgs: sqlTemplate ? { sqlTemplate } : null,
},
});
}
@@ -97,7 +97,7 @@ function Menu({ data, makeAppObj, setOpenedTabs }) {
<DropDownMenuItem
key={menu.label}
onClick={() => {
openObjectDetail(setOpenedTabs, menu.tab, data);
openObjectDetail(setOpenedTabs, menu.tab, menu.sqlTemplate, data);
}}
>
{menu.label}
@@ -115,13 +115,18 @@ const databaseObjectAppObject = () => (
const key = title;
const Icon = (props) => getIconImage(icons[objectTypeField], props);
const onClick = ({ schemaName, pureName }) => {
openObjectDetail(setOpenedTabs, defaultTabs[objectTypeField], {
schemaName,
pureName,
conid,
database,
objectTypeField,
});
openObjectDetail(
setOpenedTabs,
defaultTabs[objectTypeField],
defaultTabs[objectTypeField] ? null : 'CREATE OBJECT',
{
schemaName,
pureName,
conid,
database,
objectTypeField,
}
);
};
const matcher = (filter) => filterName(filter, pureName);
const groupTitle = _.startCase(objectTypeField);

View File

@@ -1,16 +0,0 @@
import React from 'react';
import engines from '@dbgate/engines';
import { useConnectionInfo, useSqlObjectInfo } from '../utility/metadataLoaders';
import QueryTab from './QueryTab';
export default function ExecuteProcedureTab(props) {
const procedureInfo = useSqlObjectInfo(props);
const connnection = useConnectionInfo(props);
if (!connnection || !procedureInfo) return null;
const driver = engines(connnection.engine);
const dmp = driver.createDumper();
if (procedureInfo) dmp.put('^execute %f', procedureInfo);
return <QueryTab {...props} initialScript={dmp.s} />;
}

View File

@@ -2,7 +2,9 @@ import React from 'react';
import ReactDOM from 'react-dom';
import _ from 'lodash';
import axios from '../utility/axios';
import { useConnectionInfo } from '../utility/metadataLoaders';
import engines from '@dbgate/engines';
import { useConnectionInfo, getTableInfo, getConnectionInfo, getSqlObjectInfo } from '../utility/metadataLoaders';
import SqlEditor from '../sqleditor/SqlEditor';
import { useUpdateDatabaseForTab, useSetOpenedTabs, useOpenedTabs } from '../utility/globalState';
import QueryToolbar from '../query/QueryToolbar';
@@ -17,9 +19,59 @@ import SaveSqlFileModal from '../modals/SaveSqlFileModal';
import useModalState from '../modals/useModalState';
import sqlFormatter from 'sql-formatter';
export default function QueryTab({ tabid, conid, database, tabVisible, toolbarPortalRef, initialScript, storageKey }) {
function useSqlTemplate(sqlTemplate, props) {
const [sql, setSql] = React.useState('');
async function loadTemplate() {
if (sqlTemplate == 'CREATE TABLE') {
const tableInfo = await getTableInfo(props);
const connection = await getConnectionInfo(props);
const driver = engines(connection.engine);
const dmp = driver.createDumper();
if (tableInfo) dmp.createTable(tableInfo);
setSql(dmp.s);
}
if (sqlTemplate == 'CREATE OBJECT') {
const objectInfo = await getSqlObjectInfo(props);
setSql(objectInfo.createSql);
}
if (sqlTemplate == 'EXECUTE PROCEDURE') {
const procedureInfo = await getSqlObjectInfo(props);
const connection = await getConnectionInfo(props);
const driver = engines(connection.engine);
const dmp = driver.createDumper();
if (procedureInfo) dmp.put('^execute %f', procedureInfo);
setSql(dmp.s);
}
}
React.useEffect(() => {
if (sqlTemplate) {
loadTemplate();
}
}, []);
return sql;
}
export default function QueryTab({
tabid,
conid,
database,
initialArgs,
tabVisible,
toolbarPortalRef,
initialScript,
storageKey,
...other
}) {
const loadingText = 'Loading SQL template...';
const localStorageKey = storageKey || `sql_${tabid}`;
const [queryText, setQueryText] = React.useState(() => localStorage.getItem(localStorageKey) || initialScript || '');
const { sqlTemplate } = initialArgs || {};
const [queryText, setQueryText] = React.useState(
() => localStorage.getItem(localStorageKey) || initialScript || (sqlTemplate ? loadingText : '')
);
const queryTextRef = React.useRef(queryText);
const [sessionId, setSessionId] = React.useState(null);
const [executeNumber, setExecuteNumber] = React.useState(0);
@@ -29,6 +81,14 @@ export default function QueryTab({ tabid, conid, database, tabVisible, toolbarPo
const [busy, setBusy] = React.useState(false);
const saveSqlFileModalState = useModalState();
const sqlFromTemplate = useSqlTemplate(sqlTemplate, { conid, database, ...other });
React.useEffect(() => {
if (sqlFromTemplate && queryText == loadingText) {
editorRef.current.editor.setValue(sqlFromTemplate);
editorRef.current.editor.clearSelection();
}
}, [sqlFromTemplate]);
const saveToStorage = React.useCallback(() => localStorage.setItem(localStorageKey, queryTextRef.current), [
localStorageKey,
queryTextRef,
@@ -137,6 +197,7 @@ export default function QueryTab({ tabid, conid, database, tabVisible, toolbarPo
engine={connection && connection.engine}
onKeyDown={handleKeyDown}
editorRef={editorRef}
readOnly={queryText == loadingText}
/>
<ResultTabs sessionId={sessionId} executeNumber={executeNumber}>
<TabPage label="Messages" key="messages">

View File

@@ -1,21 +0,0 @@
import React from 'react';
import { useConnectionInfo, useSqlObjectInfo } from '../utility/metadataLoaders';
import SqlEditor from '../sqleditor/SqlEditor';
import { useUpdateDatabaseForTab } from '../utility/globalState';
export default function SqlObjectCreateScriptTab({
objectTypeField,
conid,
database,
schemaName,
pureName,
tabVisible,
}) {
const sqlObjectInfo = useSqlObjectInfo({ conid, database, schemaName, pureName, objectTypeField });
const connnection = useConnectionInfo({ conid });
useUpdateDatabaseForTab(tabVisible, conid, database);
if (!connnection || !sqlObjectInfo) return null;
return <SqlEditor engine={connnection && connnection.engine} value={sqlObjectInfo.createSql} readOnly />;
}

View File

@@ -1,17 +0,0 @@
import React from 'react';
import engines from '@dbgate/engines';
import { useTableInfo, useConnectionInfo } from '../utility/metadataLoaders';
import SqlEditor from '../sqleditor/SqlEditor';
export default function TableCreateScriptTab({ conid, database, schemaName, pureName }) {
const tableInfo = useTableInfo({ conid, database, schemaName, pureName });
const connnection = useConnectionInfo({ conid });
if (!connnection || !tableInfo) return null;
// console.log(tableInfo);
const driver = engines(connnection.engine);
const dmp = driver.createDumper();
if (tableInfo) dmp.createTable(tableInfo);
return <SqlEditor engine={connnection && connnection.engine} value={dmp.s} readOnly />;
}

View File

@@ -1,17 +1,11 @@
import TableDataTab from './TableDataTab';
import ViewDataTab from './ViewDataTab';
import TableStructureTab from './TableStructureTab';
import TableCreateScriptTab from './TableCreateScriptTab';
import SqlObjectCreateScriptTab from './SqlObjectCreateScriptTab';
import QueryTab from './QueryTab';
import ExecuteProcedureTab from './ExecuteProcedureTab';
export default {
TableDataTab,
ViewDataTab,
TableStructureTab,
TableCreateScriptTab,
QueryTab,
SqlObjectCreateScriptTab,
ExecuteProcedureTab,
};