save file app object

packages/web/src/appobj/SavedFileAppObject.js

@@ -0,0 +1,79 @@
+import React from 'react';
+import axios from '../utility/axios';
+import _ from 'lodash';
+import { DropDownMenuItem } from '../modals/DropDownMenu';
+import { AppObjectCore } from './AppObjectCore';
+import useNewQuery from '../query/useNewQuery';
+import { openNewTab } from '../utility/common';
+import { useSetOpenedTabs } from '../utility/globalState';
+
+function Menu({ data }) {
+  const handleDelete = () => {
+    axios.post('files/delete', data);
+  };
+  return (
+    <>
+      <DropDownMenuItem onClick={handleDelete}>Delete</DropDownMenuItem>
+    </>
+  );
+}
+
+export function SavedFileAppObjectBase({ data, commonProps, format, icon, onLoad }) {
+  const { file, folder } = data;
+
+  const onClick = async () => {
+    const resp = await axios.post('files/load', { folder, file, format });
+    onLoad(resp.data);
+  };
+
+  return <AppObjectCore {...commonProps} data={data} title={file} icon={icon} onClick={onClick} Menu={Menu} />;
+}
+
+export function SavedSqlFileAppObject({ data, commonProps }) {
+  const { file, folder } = data;
+  const newQuery = useNewQuery();
+
+  return (
+    <SavedFileAppObjectBase
+      data={data}
+      commonProps={commonProps}
+      format="text"
+      icon="img sql-file"
+      onLoad={(data) => {
+        newQuery({
+          title: file,
+          // @ts-ignore
+          initialScript: data,
+        });
+      }}
+    />
+  );
+}
+
+export function SavedShellFileAppObject({ data, commonProps }) {
+  const { file, folder } = data;
+  const setOpenedTabs = useSetOpenedTabs();
+  return (
+    <SavedFileAppObjectBase
+      data={data}
+      commonProps={commonProps}
+      format="text"
+      icon="img shell"
+      onLoad={(data) => {
+        openNewTab(setOpenedTabs, {
+          title: file,
+          icon: 'img shell',
+          tabComponent: 'ShellTab',
+          props: {
+            initialScript: data,
+          },
+        });
+      }}
+    />
+  );
+}
+
+[SavedSqlFileAppObject, SavedShellFileAppObject].forEach((fn) => {
+  // @ts-ignore
+  fn.extractKey = (data) => data.file;
+});

packages/web/src/appobj/SavedSqlFileAppObject.js

@@ -1,37 +0,0 @@
-import React from 'react';
-import axios from '../utility/axios';
-import _ from 'lodash';
-import { DropDownMenuItem } from '../modals/DropDownMenu';
-import { AppObjectCore } from './AppObjectCore';
-import useNewQuery from '../query/useNewQuery';
-
-function Menu({ data }) {
-  const handleDelete = () => {
-    axios.post('files/delete', { folder: 'sql', file: data.name });
-  };
-  return (
-    <>
-      <DropDownMenuItem onClick={handleDelete}>Delete</DropDownMenuItem>
-    </>
-  );
-}
-
-function SavedSqlFileAppObject({ data, commonProps }) {
-  const { file } = data;
-  const newQuery = useNewQuery();
-
-  const onClick = async () => {
-    const resp = await axios.post('files/load', { folder: 'sql', file, format: 'text' });
-    newQuery({
-      title: file,
-      // @ts-ignore
-      initialScript: resp.data,
-    });
-  };
-
-  return <AppObjectCore {...commonProps} data={data} title={file} icon="img sql-file" onClick={onClick} Menu={Menu} />;
-}
-
-SavedSqlFileAppObject.extractKey = (data) => data.file;
-
-export default SavedSqlFileAppObject;

packages/web/src/widgets/FilesWidget.js

@@ -5,7 +5,7 @@ import { AppObjectList } from '../appobj/AppObjectList';
 import { useOpenedTabs } from '../utility/globalState';
 import ClosedTabAppObject from '../appobj/ClosedTabAppObject';
 import { WidgetsInnerContainer } from './WidgetStyles';
-import SavedSqlFileAppObject from '../appobj/SavedSqlFileAppObject';
+import { SavedSqlFileAppObject } from '../appobj/SavedFileAppObject';
 import WidgetColumnBar, { WidgetColumnBarItem } from './WidgetColumnBar';
 import { useFiles } from '../utility/metadataLoaders';