adds frontend for updating roles of a user
This commit is contained in:
parent
11c8c74111
commit
4fdb1d080d
|
@ -10,14 +10,27 @@
|
|||
Label,
|
||||
Input,
|
||||
Modal,
|
||||
Table,
|
||||
ModalContent,
|
||||
notifications,
|
||||
} from "@budibase/bbui"
|
||||
import { fetchData } from "helpers"
|
||||
import { users } from "stores/portal"
|
||||
import { users, apps } from "stores/portal"
|
||||
|
||||
import UpdateRolesModal from "./_components/UpdateRolesModal.svelte"
|
||||
|
||||
export let userId
|
||||
let deleteUserModal
|
||||
let editRolesModal
|
||||
|
||||
const roleSchema = {
|
||||
name: { displayName: "App" },
|
||||
roles: {},
|
||||
}
|
||||
|
||||
// Here we need to merge the Apps list and the roles response to get something that makes sense for the table
|
||||
$: appList = $apps.map(app => ({ ...app, roles: ["READ"] }))
|
||||
let selectedApp
|
||||
|
||||
const request = fetchData(`/api/admin/users/${userId}`)
|
||||
|
||||
|
@ -30,6 +43,11 @@
|
|||
notifications.error("Failed to delete user.")
|
||||
}
|
||||
}
|
||||
|
||||
async function openUpdateRolesModal({ detail }) {
|
||||
selectedApp = detail
|
||||
editRolesModal.show()
|
||||
}
|
||||
</script>
|
||||
|
||||
<Layout noPadding gap="XS">
|
||||
|
@ -64,6 +82,18 @@
|
|||
</div>
|
||||
</div>
|
||||
<Divider size="S" />
|
||||
<div class="roles">
|
||||
<Heading size="S">Configure roles</Heading>
|
||||
<Table
|
||||
on:click={openUpdateRolesModal}
|
||||
schema={roleSchema}
|
||||
data={appList}
|
||||
allowEditColumns={false}
|
||||
allowEditRows={false}
|
||||
allowSelectRows={false}
|
||||
/>
|
||||
</div>
|
||||
<Divider size="S" />
|
||||
<div class="delete">
|
||||
<Layout gap="S" noPadding
|
||||
><Heading size="S">Delete user</Heading>
|
||||
|
@ -90,6 +120,9 @@
|
|||
>
|
||||
</ModalContent>
|
||||
</Modal>
|
||||
<Modal bind:this={editRolesModal}>
|
||||
<UpdateRolesModal app={selectedApp} user={$request.data} />
|
||||
</Modal>
|
||||
|
||||
<style>
|
||||
.fields {
|
||||
|
@ -109,6 +142,9 @@
|
|||
position: relative;
|
||||
margin: var(--spacing-xl) 0;
|
||||
}
|
||||
.roles {
|
||||
margin: var(--spacing-xl) 0;
|
||||
}
|
||||
.delete {
|
||||
margin-top: var(--spacing-xl);
|
||||
}
|
||||
|
|
|
@ -0,0 +1,35 @@
|
|||
<script>
|
||||
import { Body, Multiselect, ModalContent } from "@budibase/bbui"
|
||||
import { users } from "stores/portal"
|
||||
|
||||
export let app
|
||||
export let user
|
||||
let roles = app.roles
|
||||
|
||||
const options = ["READ", "WRITE", "ADMIN", "PUBLIC"]
|
||||
|
||||
function updateUserRoles() {
|
||||
users.updateRoles({ ...user, roles: { ...user.roles, [app._id]: roles } })
|
||||
console.log("updating roles!")
|
||||
}
|
||||
</script>
|
||||
|
||||
<ModalContent
|
||||
onConfirm={updateUserRoles}
|
||||
title="Update App Roles"
|
||||
confirmText="Update roles"
|
||||
cancelText="Cancel"
|
||||
size="M"
|
||||
showCloseIcon={false}
|
||||
>
|
||||
<Body noPadding
|
||||
>Select the roles that this user should use for the {app.name}.</Body
|
||||
>
|
||||
<Multiselect
|
||||
placeholder={null}
|
||||
bind:value={roles}
|
||||
on:change
|
||||
{options}
|
||||
label="Select roles:"
|
||||
/>
|
||||
</ModalContent>
|
Loading…
Reference in New Issue