From b842a2addc4972390d993466ca254a5ec59ca29b Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Wed, 9 Dec 2020 15:35:57 +0000 Subject: [PATCH] Cache roles in store and add role selector for screens --- .../builder/src/builderStore/store/backend.js | 21 ++++++++++ .../backend/DataTable/cells/RoleCell.svelte | 40 ++----------------- .../DataTable/modals/CreateEditUser.svelte | 36 +++++------------ .../backend/DataTable/modals/EditRoles.svelte | 26 +++++------- .../userInterface/NewScreenModal.svelte | 20 +++------- .../userInterface/RoleSelect.svelte | 15 +++++++ .../userInterface/SettingsView.svelte | 3 +- .../src/pages/[application]/_reset.svelte | 1 + 8 files changed, 70 insertions(+), 92 deletions(-) create mode 100644 packages/builder/src/components/userInterface/RoleSelect.svelte diff --git a/packages/builder/src/builderStore/store/backend.js b/packages/builder/src/builderStore/store/backend.js index 3cdabf1ed5..5592488590 100644 --- a/packages/builder/src/builderStore/store/backend.js +++ b/packages/builder/src/builderStore/store/backend.js @@ -6,6 +6,7 @@ const INITIAL_BACKEND_UI_STATE = { tables: [], views: [], users: [], + roles: [], selectedDatabase: {}, selectedTable: {}, draftTable: {}, @@ -177,6 +178,26 @@ export const getBackendUiStore = () => { return state }), }, + roles: { + fetch: async () => { + const response = await api.get("/api/roles") + const roles = await response.json() + store.update(state => { + state.roles = roles + return state + }) + }, + delete: async role => { + const response = await api.delete(`/api/roles/${role._id}/${role._rev}`) + await store.actions.roles.fetch() + return response + }, + save: async role => { + const response = await api.post("/api/roles", role) + await store.actions.roles.fetch() + return response + }, + }, } return store diff --git a/packages/builder/src/components/backend/DataTable/cells/RoleCell.svelte b/packages/builder/src/components/backend/DataTable/cells/RoleCell.svelte index c6f6cbbcdf..a45f376a3e 100644 --- a/packages/builder/src/components/backend/DataTable/cells/RoleCell.svelte +++ b/packages/builder/src/components/backend/DataTable/cells/RoleCell.svelte @@ -1,42 +1,10 @@ - - -
{roleName}
diff --git a/packages/builder/src/components/backend/DataTable/modals/CreateEditUser.svelte b/packages/builder/src/components/backend/DataTable/modals/CreateEditUser.svelte index bde6514f8f..aac515e74b 100644 --- a/packages/builder/src/components/backend/DataTable/modals/CreateEditUser.svelte +++ b/packages/builder/src/components/backend/DataTable/modals/CreateEditUser.svelte @@ -1,18 +1,14 @@ - {#if rolesLoaded} - - {/if} + {#each customSchemaKeys as [key, meta]} {/each} diff --git a/packages/builder/src/components/backend/DataTable/modals/EditRoles.svelte b/packages/builder/src/components/backend/DataTable/modals/EditRoles.svelte index 627112d87c..3b97f6d61b 100644 --- a/packages/builder/src/components/backend/DataTable/modals/EditRoles.svelte +++ b/packages/builder/src/components/backend/DataTable/modals/EditRoles.svelte @@ -4,27 +4,26 @@ import api from "builderStore/api" import { notifier } from "builderStore/store/notifications" import ErrorsBox from "components/common/ErrorsBox.svelte" + import { backendUiStore } from "builderStore" - let roles = [] let permissions = [] let selectedRole = {} let errors = [] $: selectedRoleId = selectedRole._id - $: otherRoles = roles.filter(role => role._id !== selectedRoleId) + $: otherRoles = $backendUiStore.roles.filter( + role => role._id !== selectedRoleId + ) $: isCreating = selectedRoleId == null || selectedRoleId === "" - // Loads available roles and permissions from the server - const fetchRoles = async () => { - const rolesResponse = await api.get("/api/roles") - roles = await rolesResponse.json() + const fetchPermissions = async () => { const permissionsResponse = await api.get("/api/permissions") permissions = await permissionsResponse.json() } - // Changes the seleced role + // Changes the selected role const changeRole = event => { const id = event?.target?.value - const role = roles.find(role => role._id === id) + const role = $backendUiStore.roles.find(role => role._id === id) if (role) { selectedRole = { ...role, @@ -61,7 +60,7 @@ } // Save/create the role - const response = await api.post("/api/roles", selectedRole) + const response = await backendUiStore.actions.roles.save(selectedRole) if (response.status === 200) { notifier.success("Role saved successfully.") } else { @@ -72,11 +71,8 @@ // Deletes the selected role const deleteRole = async () => { - const response = await api.delete( - `/api/roles/${selectedRole._id}/${selectedRole._rev}` - ) + const response = await backendUiStore.actions.roles.delete(selectedRole) if (response.status === 200) { - await fetchRoles() changeRole() notifier.success("Role deleted successfully.") } else { @@ -84,7 +80,7 @@ } } - onMount(fetchRoles) + onMount(fetchPermissions) - {#each roles as role} + {#each $backendUiStore.roles as role} {/each} diff --git a/packages/builder/src/components/userInterface/NewScreenModal.svelte b/packages/builder/src/components/userInterface/NewScreenModal.svelte index 4a5186adc0..8d7271601a 100644 --- a/packages/builder/src/components/userInterface/NewScreenModal.svelte +++ b/packages/builder/src/components/userInterface/NewScreenModal.svelte @@ -15,7 +15,6 @@ let templateIndex let draftScreen let createLink = true - let roles = [] let roleId = "BASIC" $: templates = getTemplates($store, $backendUiStore.tables) @@ -30,11 +29,6 @@ } } - const fetchRoles = async () => { - const response = await api.get("/api/roles") - roles = await response.json() - } - const templateChanged = newTemplateIndex => { if (newTemplateIndex === undefined) return const template = templates[newTemplateIndex] @@ -96,8 +90,6 @@ route = "/" + event.target.value } } - - onMount(fetchRoles) @@ -118,12 +110,10 @@ error={routeError} bind:value={route} on:change={routeChanged} /> - {#if roles.length} - - {/if} + diff --git a/packages/builder/src/components/userInterface/RoleSelect.svelte b/packages/builder/src/components/userInterface/RoleSelect.svelte new file mode 100644 index 0000000000..e49222d2c0 --- /dev/null +++ b/packages/builder/src/components/userInterface/RoleSelect.svelte @@ -0,0 +1,15 @@ + + + diff --git a/packages/builder/src/components/userInterface/SettingsView.svelte b/packages/builder/src/components/userInterface/SettingsView.svelte index f90e071b08..eee50d8cf6 100644 --- a/packages/builder/src/components/userInterface/SettingsView.svelte +++ b/packages/builder/src/components/userInterface/SettingsView.svelte @@ -4,6 +4,7 @@ import { FrontendTypes } from "constants" import PropertyControl from "./PropertyControl.svelte" import LayoutSelect from "./LayoutSelect.svelte" + import RoleSelect from "./RoleSelect.svelte" import Input from "./PropertyPanelControls/Input.svelte" import { excludeProps } from "./propertyCategories.js" import { store, allScreens, currentAsset } from "builderStore" @@ -36,8 +37,8 @@ const screenDefinition = [ { key: "description", label: "Description", control: Input }, { key: "routing.route", label: "Route", control: Input }, + { key: "routing.roleId", label: "Access", control: RoleSelect }, { key: "layoutId", label: "Layout", control: LayoutSelect }, - { key: "routing.roleId", label: "Role", control: Input }, ] const layoutDefinition = [{ key: "title", label: "Title", control: Input }] diff --git a/packages/builder/src/pages/[application]/_reset.svelte b/packages/builder/src/pages/[application]/_reset.svelte index a6f7e86454..e1daf7da1d 100644 --- a/packages/builder/src/pages/[application]/_reset.svelte +++ b/packages/builder/src/pages/[application]/_reset.svelte @@ -20,6 +20,7 @@ backendUiStore.actions.reset() await store.actions.initialise(pkg) await automationStore.actions.fetch() + await backendUiStore.actions.roles.fetch() return pkg } else { throw new Error(pkg)