moves permissions to a separate store

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

@@ -1,6 +1,7 @@
 import { writable, get } from "svelte/store"
 import { cloneDeep } from "lodash/fp"
 import api from "../api"
+import { permissions } from './backend/permissions'
 
 const INITIAL_BACKEND_UI_STATE = {
   tables: [],
@@ -26,18 +27,15 @@ export const getBackendUiStore = () => {
           api.get(`/api/tables`).then(r => r.json()),
           api.get(`/api/datasources`).then(r => r.json()),
           api.get(`/api/queries`).then(r => r.json()),
-          api.get("/api/integrations").then(r => r.json())
+          api.get("/api/integrations").then(r => r.json()),
         ])
 
-        const permissionLevels = await store.actions.permissions.fetchLevels()
-
         store.update(state => {
           state.selectedDatabase = db
           state.tables = tables
           state.datasources = datasources
           state.queries = queries
           state.integrations = integrations
-          state.permissionLevels = permissionLevels
           return state
         })
       },

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

@@ -0,0 +1 @@
+export { permissions } from "./permissions"

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

@@ -0,0 +1,29 @@
+import { writable } from "svelte/store"
+import api from "../../api"
+
+function createPermissionStore() {
+  const { subscribe, set } = writable([])
+
+  return {
+    subscribe,
+    fetchLevels: async () => {
+      const response = await api.get("/api/permission/levels")
+      const json = await response.json()
+      set(json)
+    },
+    forResource: async resourceId => {
+      const response = await api.get(`/api/permission/${resourceId}`)
+      const json = await response.json()
+      return json
+    },
+    save: async ({ role, resource, level }) => {
+      const response = await api.post(
+        `/api/permission/${role}/${resource}/${level}`
+      )
+      const json = await response.json()
+      return json
+    },
+  }
+}
+
+export const permissions = createPermissionStore()

packages/builder/src/components/backend/DataTable/buttons/ManageAccessButton.svelte

@@ -1,22 +1,18 @@
 <script>
-  import { TextButton, Icon, Popover } from "@budibase/bbui"
+  import { TextButton, Popover } from "@budibase/bbui"
-  import { backendUiStore } from "builderStore"
+  import { permissions } from 'builderStore/store/backend/'
-  import { Roles } from "constants/backend"
-  import api from "builderStore/api"
   import ManageAccessPopover from "../popovers/ManageAccessPopover.svelte"
 
   export let resourceId
 
   let anchor
   let dropdown
-  let levels
+  let resourcePermissions
-  let permissions
 
   async function openDropdown() {
-    permissions = await backendUiStore.actions.permissions.forResource(
+    resourcePermissions = await permissions.forResource(
       resourceId
     )
-    levels = await backendUiStore.actions.permissions.fetchLevels()
     dropdown.show()
   }
 </script>
@@ -30,8 +26,8 @@
 <Popover bind:this={dropdown} {anchor} align="left">
   <ManageAccessPopover
     {resourceId}
-    {levels}
+    levels={$permissions}
-    {permissions}
+    permissions={resourcePermissions}
     onClosed={dropdown.hide} />
 </Popover>