files widget

packages/web/src/widgets/FilesWidget.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+  import SavedFilesList from './SavedFilesList.svelte';
+
+  import WidgetColumnBar from './WidgetColumnBar.svelte';
+  import WidgetColumnBarItem from './WidgetColumnBarItem.svelte';
+</script>
+
+<WidgetColumnBar>
+  <WidgetColumnBarItem title="Saved files" name="files">
+    <SavedFilesList />
+  </WidgetColumnBarItem>
+</WidgetColumnBar>

packages/web/src/widgets/SavedFilesList.svelte

@@ -0,0 +1,28 @@
+<script lang="ts">
+import _ from 'lodash';
+
+  import AppObjectList from '../appobj/AppObjectList.svelte';
+import * as savedFileAppObject from '../appobj/SavedFileAppObject.svelte';
+import { useFiles } from '../utility/metadataLoaders';
+
+  import WidgetsInnerContainer from './WidgetsInnerContainer.svelte';
+
+  const sqlFiles = useFiles({ folder: 'sql' });
+  const shellFiles = useFiles({ folder: 'shell' });
+  const markdownFiles = useFiles({ folder: 'markdown' });
+  const chartFiles = useFiles({ folder: 'charts' });
+  const queryFiles = useFiles({ folder: 'query' });
+
+  $: files = [
+    ...($sqlFiles || []),
+    ...($shellFiles || []),
+    ...($markdownFiles || []),
+    ...($chartFiles || []),
+    ...($queryFiles || []),
+  ];
+
+</script>
+
+<WidgetsInnerContainer>
+  <AppObjectList list={files} module={savedFileAppObject} groupFunc={data => _.startCase(data.folder)} />
+</WidgetsInnerContainer>

packages/web/src/widgets/SqlObjectList.svelte

@@ -10,7 +10,7 @@
   import SubColumnParamList from '../appobj/SubColumnParamList.svelte';
   import { chevronExpandIcon } from '../icons/expandIcons';
   import ErrorInfo from '../elements/ErrorInfo.svelte';
-  import axios from '../utility/axios';
+  import axiosInstance from '../utility/axiosInstance';
   import LoadingInfo from '../elements/LoadingInfo.svelte';
 
   export let conid;
@@ -31,7 +31,7 @@
   );
 
   const handleRefreshDatabase = () => {
-    axios.post('database-connections/refresh', { conid, database });
+    axiosInstance.post('database-connections/refresh', { conid, database });
   };
 </script>
 

packages/web/src/widgets/WidgetContainer.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import { selectedWidget } from '../stores';
   import DatabaseWidget from './DatabaseWidget.svelte';
+  import FilesWidget from './FilesWidget.svelte';
 
 
 </script>
@@ -8,3 +9,6 @@
 {#if $selectedWidget == 'database'}
   <DatabaseWidget />
 {/if}
+{#if $selectedWidget == 'file'}
+  <FilesWidget />
+{/if}