CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-09-08 21:51:58 +12:00
Code Issues Projects Releases Wiki Activity

Merge pull request #4639 from mslourens/merge_create_user_modals

Browse source 
Merge both create user modals for easy switch between the two
This commit is contained in:
Andrew Kingston 2022-06-21 13:28:19 +01:00 committed by GitHub
commit 919823c013
4 changed files with 1326 additions and 102 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
packages/builder/src/pages/builder/portal/manage/users/_components/AddUserModal.svelte
View file

@ -2,22 +2,47 @@
import { import {
Body, Body,
Input, Input,
Select, Label,
ModalContent, ModalContent,
notifications, notifications,
Select,
Toggle, Toggle,
Label,
} from "@budibase/bbui" } from "@budibase/bbui"
import { createValidationStore, emailValidator } from "helpers/validation" import { createValidationStore, emailValidator } from "helpers/validation"
import { users } from "stores/portal" import { users } from "stores/portal"
export let disabled const password = Math.random().toString(36).substring(2, 22)
const options = ["Email onboarding", "Basic onboarding"] const options = ["Email onboarding", "Basic onboarding"]
let selected = options[0]
let builder, admin
const [email, error, touched] = createValidationStore("", emailValidator) const [email, error, touched] = createValidationStore("", emailValidator)
let disabled
let builder
let admin
let selected = "Email onboarding"
$: basic = selected === "Basic onboarding"
function addUser() {
if (basic) {
createUser()
} else {
createUserFlow()
}
}
async function createUser() {
try {
await users.create({
email: $email,
password,
builder,
admin,
forceResetPassword: true,
})
notifications.success("Successfully created user")
} catch (error) {
notifications.error("Error creating user")
}
}
async function createUserFlow() { async function createUserFlow() {
try { try {
@ -30,7 +55,7 @@
</script> </script>
<ModalContent <ModalContent
onConfirm={createUserFlow} onConfirm={addUser}
size="M" size="M"
title="Add new user" title="Add new user"
confirmText="Add user" confirmText="Add user"
@ -47,17 +72,22 @@
<Select <Select
placeholder={null} placeholder={null}
bind:value={selected} bind:value={selected}
on:change
{options} {options}
label="Add new user via:" label="Add new user via:"
/> />
<Input <Input
type="email" type="email"
label="Email"
bind:value={$email} bind:value={$email}
error={$touched && $error} error={$touched && $error}
placeholder="john@doe.com" placeholder="john@doe.com"
label="Email"
/> />
{#if basic}
<Input disabled label="Password" value={password} />
{/if}
<div> <div>
<div class="toggle"> <div class="toggle">
<Label size="L">Development access</Label> <Label size="L">Development access</Label>

74
packages/builder/src/pages/builder/portal/manage/users/_components/BasicOnboardingModal.svelte
View file

@ -1,74 +0,0 @@
<script>
import {
ModalContent,
Body,
Input,
notifications,
Toggle,
Label,
} from "@budibase/bbui"
import { createValidationStore, emailValidator } from "helpers/validation"
import { users } from "stores/portal"
const [email, error, touched] = createValidationStore("", emailValidator)
const password = Math.random().toString(36).slice(2, 20)
let builder = false,
admin = false
async function createUser() {
try {
await users.create({
email: $email,
password,
builder,
admin,
forceResetPassword: true,
})
notifications.success("Successfully created user")
} catch (error) {
notifications.error(error.message)
}
}
</script>
<ModalContent
onConfirm={createUser}
size="M"
title="Basic user onboarding"
confirmText="Continue"
cancelText="Cancel"
disabled={$error}
error={$touched && $error}
showCloseIcon={false}
>
<Body size="S">
Below you will find the user’s username and password. The password will not
be accessible from this point. Please save the credentials.
</Body>
<Input
type="email"
label="Email"
bind:value={$email}
error={$touched && $error}
/>
<Input readonly label="Password" value={password} />
<div>
<div class="toggle">
<Label size="L">Development access</Label>
<Toggle text="" bind:value={builder} />
</div>
<div class="toggle">
<Label size="L">Administration access</Label>
<Toggle text="" bind:value={admin} />
</div>
</div>
</ModalContent>
<style>
.toggle {
display: grid;
grid-template-columns: 78% 1fr;
align-items: center;
width: 50%;
}
</style>

11
packages/builder/src/pages/builder/portal/manage/users/index.svelte
View file

@ -15,7 +15,6 @@
} from "@budibase/bbui" } from "@budibase/bbui"
import TagsRenderer from "./_components/TagsTableRenderer.svelte" import TagsRenderer from "./_components/TagsTableRenderer.svelte"
import AddUserModal from "./_components/AddUserModal.svelte" import AddUserModal from "./_components/AddUserModal.svelte"
import BasicOnboardingModal from "./_components/BasicOnboardingModal.svelte"
import { users } from "stores/portal" import { users } from "stores/portal"
import { onMount } from "svelte" import { onMount } from "svelte"
@ -30,7 +29,6 @@
} }
let search let search
let email
$: filteredUsers = $users $: filteredUsers = $users
.filter(user => user.email.includes(search || "")) .filter(user => user.email.includes(search || ""))
.map(user => ({ .map(user => ({
@ -41,12 +39,6 @@
})) }))
let createUserModal let createUserModal
let basicOnboardingModal
function openBasicOnboardingModal() {
createUserModal.hide()
basicOnboardingModal.show()
}
onMount(async () => { onMount(async () => {
try { try {
@ -93,9 +85,8 @@
</Layout> </Layout>
<Modal bind:this={createUserModal}> <Modal bind:this={createUserModal}>
<AddUserModal on:change={openBasicOnboardingModal} /> <AddUserModal />
</Modal> </Modal>
<Modal bind:this={basicOnboardingModal}><BasicOnboardingModal {email} /></Modal>
<style> <style>
.field { .field {

1293
packages/client/yarn.lock
View file

File diff suppressed because it is too large Load diff