script generation refactor - opened in normal QueryTab

packages/engines/mssql/sql/modifications.js

@@ -2,5 +2,5 @@ module.exports = `
 select o.object_id as objectId, o.modify_date as modifyDate, o.type, o.name as pureName, s.name as schemaName
 from sys.objects o 
 inner join sys.schemas s on o.schema_id = s.schema_id
-where o.type in ('U', 'V', 'P', 'IF', 'FN', 'TR', 'TF')
+where o.type in ('U', 'V', 'P', 'IF', 'FN', 'TF') -- , 'TR' - triggers disabled
 `;

packages/web/src/appobj/databaseObjectAppObject.js

@@ -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],
+    icon: sqlTemplate ? 'sql.svg' : icons[objectTypeField],
-    tabComponent,
+    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], {
+    openObjectDetail(
-      schemaName,
+      setOpenedTabs,
-      pureName,
+      defaultTabs[objectTypeField],
-      conid,
+      defaultTabs[objectTypeField] ? null : 'CREATE OBJECT',
-      database,
+      {
-      objectTypeField,
+        schemaName,
-    });
+        pureName,
+        conid,
+        database,
+        objectTypeField,
+      }
+    );
   };
   const matcher = (filter) => filterName(filter, pureName);
   const groupTitle = _.startCase(objectTypeField);

packages/web/src/tabs/ExecuteProcedureTab.js

@@ -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} />;
-}

packages/web/src/tabs/QueryTab.js

@@ -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">

packages/web/src/tabs/SqlObjectCreateScriptTab.js

@@ -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 />;
-}

packages/web/src/tabs/TableCreateScriptTab.js

@@ -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 />;
-}

packages/web/src/tabs/index.js

@@ -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,
 };