fixes and splits out database to it's separate store

packages/builder/src/builderStore/store/backend.js

@@ -6,7 +6,6 @@ const INITIAL_BACKEND_UI_STATE = {
   tables: [],
   views: [],
   datasources: [],
-  queries: [],
   selectedDatabase: {},
   selectedTable: {},
   draftTable: {},
@@ -19,12 +18,11 @@ export const getBackendUiStore = () => {
     reset: () => store.set({ ...INITIAL_BACKEND_UI_STATE }),
     database: {
       select: async db => {
-        const [tables, queries] = await Promise.all([
+        const [tables] = await Promise.all([
           api.get(`/api/tables`).then(r => r.json()),
         ])
 
         store.update(state => {
-          state.selectedDatabase = db
           state.tables = tables
           return state
         })
@@ -42,72 +40,6 @@ export const getBackendUiStore = () => {
           return state
         }),
     },
-    queries: {
-      fetch: async () => {
-        const response = await api.get(`/api/queries`)
-        const json = await response.json()
-        store.update(state => {
-          state.queries = json
-          return state
-        })
-        return json
-      },
-      save: async (datasourceId, query) => {
-        const integrations = get(store).integrations
-        const dataSource = get(store).datasources.filter(
-          ds => ds._id === datasourceId
-        )
-        // check if readable attribute is found
-        if (dataSource.length !== 0) {
-          const integration = integrations[dataSource[0].source]
-          const readable = integration.query[query.queryVerb].readable
-          if (readable) {
-            query.readable = readable
-          }
-        }
-        query.datasourceId = datasourceId
-        const response = await api.post(`/api/queries`, query)
-        if (response.status !== 200) {
-          throw new Error("Failed saving query.")
-        }
-        const json = await response.json()
-        store.update(state => {
-          const currentIdx = state.queries.findIndex(
-            query => query._id === json._id
-          )
-
-          if (currentIdx >= 0) {
-            state.queries.splice(currentIdx, 1, json)
-          } else {
-            state.queries.push(json)
-          }
-
-          state.queries = state.queries
-          state.selectedQueryId = json._id
-          return state
-        })
-        return json
-      },
-      select: query =>
-        store.update(state => {
-          state.selectedDatasourceId = query.datasourceId
-          state.selectedQueryId = query._id
-          return state
-        }),
-      delete: async query => {
-        await api.delete(`/api/queries/${query._id}/${query._rev}`)
-        store.update(state => {
-          state.queries = state.queries.filter(
-            existing => existing._id !== query._id
-          )
-          if (state.selectedQueryId === query._id) {
-            state.selectedQueryId = null
-          }
-
-          return state
-        })
-      },
-    },
     tables: {
       fetch: async () => {
         const tablesResponse = await api.get(`/api/tables`)

packages/builder/src/builderStore/store/backend/database.js

@@ -0,0 +1,3 @@
+import { writable } from "svelte/store"
+
+export const database = writable({})

packages/builder/src/builderStore/store/backend/datasources.js

@@ -1,4 +1,5 @@
 import { writable } from "svelte/store"
+import { queries } from "./"
 import api from "../../api"
 
 function createDatasourcesStore() {
@@ -19,6 +20,7 @@ function createDatasourcesStore() {
     },
     select: async datasourceId => {
       update(state => ({ ...state, selected: datasourceId }))
+      queries.update(state => ({...state, selected: null}))
     },
     save: async datasource => {
       const response = await api.post("/api/datasources", datasource)
@@ -35,7 +37,7 @@ function createDatasourcesStore() {
           sources.push(json)
         }
 
-        return { sources, selected: json._id }
+        return { list: sources, selected: json._id }
       })
       return json
     },

packages/builder/src/builderStore/store/backend/index.js

@@ -1,3 +1,4 @@
+export { database } from "./database"
 export { permissions } from "./permissions"
 export { roles } from "./roles"
 export { datasources } from "./datasources"

packages/builder/src/builderStore/store/backend/queries.js

@@ -8,6 +8,7 @@ function createQueriesStore() {
   return {
     subscribe,
     set,
+    update,
     fetch: async () => {
       const response = await api.get(`/api/queries`)
       const json = await response.json()

packages/builder/src/builderStore/store/frontend.js

@@ -10,7 +10,7 @@ import {
   selectedAccessRole,
 } from "builderStore"
 // Backendstores
-import { datasources, integrations, queries } from 'builderStore/store/backend/'
+import { datasources, integrations, queries, database } from 'builderStore/store/backend/'
 
 import { fetchComponentLibDefinitions } from "../loadComponentLibraries"
 import api from "../api"
@@ -70,8 +70,8 @@ export const getFrontendStore = () => {
       datasources.set({ list: _datasources, selected: null })
       integrations.set(_integrations)
       queries.set({ list: _queries, selected: null })
-
+      database.set(application.instance)
-      await backendUiStore.actions.database.select(application.instance)
+      
     },
     routing: {
       fetch: async () => {

packages/builder/src/components/backend/DatasourceNavigator/DatasourceNavigator.svelte

@@ -1,8 +1,7 @@
 <script>
   import { onMount } from "svelte"
   import { goto } from "@sveltech/routify"
-  import { backendUiStore } from "builderStore"
+  import { database, datasources, queries } from 'builderStore/store/backend/'
-  import { datasources, queries } from 'builderStore/store/backend/'
   import EditDatasourcePopover from "./popovers/EditDatasourcePopover.svelte"
   import EditQueryPopover from "./popovers/EditQueryPopover.svelte"
   import NavItem from "components/common/NavItem.svelte"
@@ -14,7 +13,7 @@
   }
 
   function onClickQuery(query) {
-    if ($backendUiStore.selectedQueryId === query._id) {
+    if ($queries.selected === query._id) {
       return
     }
     queries.select(query)
@@ -27,7 +26,7 @@
   })
 </script>
 
-{#if $backendUiStore.selectedDatabase && $backendUiStore.selectedDatabase._id}
+{#if $database?._id}
   <div class="hierarchy-items-container">
     {#each $datasources.list as datasource, idx}
       <NavItem

packages/builder/src/components/backend/DatasourceNavigator/modals/CreateDatasourceModal.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { goto, params } from "@sveltech/routify"
+  import { goto } from "@sveltech/routify"
   import { datasources } from 'builderStore/store/backend/'
   import { notifier } from "builderStore/store/notifications"
   import { Input, Label, ModalContent } from "@budibase/bbui"
@@ -14,7 +14,7 @@
   function checkValid(evt) {
     const datasourceName = evt.target.value
     if (
-      $datasources?.sources.some(
+      $datasources?.list.some(
         datasource => datasource.name === datasourceName
       )
     ) {