move logic from Users page to separate component
This commit is contained in:
parent
6fc910afc3
commit
cb0c6bac07
|
@ -1,22 +1,30 @@
|
||||||
<script>
|
<script>
|
||||||
import { Body, Input, Select, ModalContent } from "@budibase/bbui"
|
import { Body, Input, Select, ModalContent } from "@budibase/bbui"
|
||||||
import { createValidationStore, emailValidator } from "helpers/validation"
|
import { createValidationStore, emailValidator } from "helpers/validation"
|
||||||
|
import { users } from "stores/portal"
|
||||||
|
|
||||||
export let options
|
|
||||||
export let selected
|
|
||||||
export let onConfirm
|
|
||||||
export let disabled
|
export let disabled
|
||||||
|
|
||||||
const [email, emailError] = createValidationStore("", emailValidator)
|
const options = ["Email onboarding", "Basic onboarding"]
|
||||||
|
let selected = options[0]
|
||||||
|
|
||||||
|
const [email, error, touched] = createValidationStore("", emailValidator)
|
||||||
|
|
||||||
|
async function createUserFlow() {
|
||||||
|
const response = await users.invite(email)
|
||||||
|
console.log(response)
|
||||||
|
notifications.success("Email sent.")
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<ModalContent
|
<ModalContent
|
||||||
{onConfirm}
|
onConfirm={createUserFlow}
|
||||||
size="M"
|
size="M"
|
||||||
title="Add new user options"
|
title="Add new user options"
|
||||||
confirmText="Add user"
|
confirmText="Add user"
|
||||||
confirmDisabled={disabled}
|
confirmDisabled={disabled}
|
||||||
cancelText="Cancel"
|
cancelText="Cancel"
|
||||||
|
disabled={!$touched && !$error}
|
||||||
showCloseIcon={false}
|
showCloseIcon={false}
|
||||||
>
|
>
|
||||||
<Body noPadding
|
<Body noPadding
|
||||||
|
@ -27,13 +35,14 @@
|
||||||
<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"
|
||||||
bind:value={$email}
|
bind:value={$email}
|
||||||
error={$emailError}
|
error={$touched && $error}
|
||||||
placeholder="john@doe.com"
|
placeholder="john@doe.com"
|
||||||
label="Email"
|
label="Email"
|
||||||
/>
|
/>
|
||||||
|
|
|
@ -11,7 +11,6 @@
|
||||||
Label,
|
Label,
|
||||||
Layout,
|
Layout,
|
||||||
Modal,
|
Modal,
|
||||||
notifications,
|
|
||||||
} from "@budibase/bbui"
|
} from "@budibase/bbui"
|
||||||
import AddUserModal from "./_components/AddUserModal.svelte"
|
import AddUserModal from "./_components/AddUserModal.svelte"
|
||||||
import BasicOnboardingModal from "./_components/BasicOnboardingModal.svelte"
|
import BasicOnboardingModal from "./_components/BasicOnboardingModal.svelte"
|
||||||
|
@ -26,8 +25,6 @@
|
||||||
// group: {}
|
// group: {}
|
||||||
}
|
}
|
||||||
|
|
||||||
let onboardingOptions = ["Email onboarding", "Basic onboarding"]
|
|
||||||
let selectedOnboardingOption = onboardingOptions[0]
|
|
||||||
let search
|
let search
|
||||||
let email
|
let email
|
||||||
$: filteredUsers = $users.filter(user => user.email.includes(search || ""))
|
$: filteredUsers = $users.filter(user => user.email.includes(search || ""))
|
||||||
|
@ -35,13 +32,9 @@
|
||||||
let createUserModal
|
let createUserModal
|
||||||
let basicOnboardingModal
|
let basicOnboardingModal
|
||||||
|
|
||||||
function createUserFlow() {
|
function openBasicOnoboardingModal() {
|
||||||
if (selectedOnboardingOption === onboardingOptions[0]) {
|
createUserModal.hide()
|
||||||
notifications.success("Email sent.")
|
basicOnboardingModal.show()
|
||||||
} else {
|
|
||||||
createUserModal.hide()
|
|
||||||
basicOnboardingModal.show()
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -80,13 +73,7 @@
|
||||||
</Layout>
|
</Layout>
|
||||||
|
|
||||||
<Modal bind:this={createUserModal}
|
<Modal bind:this={createUserModal}
|
||||||
><AddUserModal
|
><AddUserModal on:change={openBasicOnoboardingModal} /></Modal
|
||||||
options={onboardingOptions}
|
|
||||||
onConfirm={createUserFlow}
|
|
||||||
disabled={!email}
|
|
||||||
bind:selected={selectedOnboardingOption}
|
|
||||||
bind:email
|
|
||||||
/></Modal
|
|
||||||
>
|
>
|
||||||
<Modal bind:this={basicOnboardingModal}><BasicOnboardingModal {email} /></Modal>
|
<Modal bind:this={basicOnboardingModal}><BasicOnboardingModal {email} /></Modal>
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue