MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

invite flow now working

This commit is contained in:
Keviin Åberg Kultalahti 2021-05-12 12:49:14 +02:00
parent 982844092d
commit c843e17b31
2 changed files with 100 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
packages/builder/src/App.svelte
View File

@ -4,16 +4,17 @@
import { routes } from "../.routify/routes" import { routes } from "../.routify/routes"
import { initialise } from "builderStore" import { initialise } from "builderStore"
import { NotificationDisplay } from "@budibase/bbui" import { NotificationDisplay } from "@budibase/bbui"
import { parse, stringify } from "qs"
onMount(async () => { onMount(async () => {
await initialise() await initialise()
}) })
const config = {} const queryHandler = { parse, stringify }
</script> </script>
<NotificationDisplay /> <NotificationDisplay />
<Router {routes} {config} /> <Router {routes} config={{ queryHandler }} />
<div class="modal-container" /> <div class="modal-container" />
<style> <style>

97
packages/builder/src/pages/builder/invite/index.svelte Normal file
View File

@ -0,0 +1,97 @@
<script>
import {
Layout,
Heading,
Body,
Input,
Button,
notifications,
} from "@budibase/bbui"
import { goto, params } from "@roxi/routify"
import { createValidationStore, requiredValidator } from "helpers/validation"
import { users } from "stores/portal"
const [password, passwordError, passwordTouched] = createValidationStore(
"",
requiredValidator
)
const [repeat, _, repeatTouched] = createValidationStore(
"",
requiredValidator
)
const inviteCode = $params["?code"]
async function acceptInvite() {
try {
const res = await users.acceptInvite(inviteCode, $password)
if (!res) {
throw new Error(res.message)
}
notifications.success(`User created.`)
$goto("../auth/login")
} catch (err) {
notifications.error(err)
}
}
</script>
<section>
<div class="container">
<Layout gap="XS">
<img src="https://i.imgur.com/ZKyklgF.png" />
</Layout>
<div class="center">
<Layout gap="XS">
<Heading size="M">Accept Invitation</Heading>
<Body size="M">Please enter a password to setup your user.</Body>
</Layout>
</div>
<Layout gap="XS">
<Input
label="Password"
type="password"
error={$passwordTouched && $passwordError}
bind:value={$password}
/>
<Input
label="Repeat Password"
type="password"
error={$repeatTouched &&
$password !== $repeat &&
"Passwords must match"}
bind:value={$repeat}
/>
</Layout>
<Layout gap="S">
<Button
disabled={!$passwordTouched || !$repeatTouched || $password !== $repeat}
cta
on:click={acceptInvite}>Accept invite</Button
>
</Layout>
</div>
</section>
<style>
section {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
.container {
margin: 0 auto;
width: 260px;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: stretch;
}
.center {
text-align: center;
}
img {
width: 40px;
margin: 0 auto;
}
</style>