CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-07-03 05:20:32 +12:00
Code Issues Projects Releases Wiki Activity

Add modal to let users change their own password, without endpoint for now

Browse source
This commit is contained in:
Andrew Kingston 2021-05-19 13:18:58 +01:00
parent 5c8c663935
commit ba1ee6b033
3 changed files with 42 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
packages/builder/src/pages/builder/apps/_components/ChangePasswordModal.svelte Normal file
View file

@ -0,0 +1,21 @@
<script>
import { ModalContent, Body, notifications } from "@budibase/bbui"
import PasswordRepeatInput from "components/common/users/PasswordRepeatInput.svelte"
let password
let error
const updatePassword = async () => {
// Update password
}
</script>
<ModalContent
title="Change password"
confirmText="Update password"
onConfirm={updatePassword}
disabled={error}
>
<Body size="S">Enter your new password below.</Body>
<PasswordRepeatInput bind:password bind:error />
</ModalContent>

18
packages/builder/src/pages/builder/apps/_components/UpdateUserInfoModal.svelte
View file

@ -1,9 +1,7 @@
<script>
import { ModalContent, Body, Input, notifications } from "@budibase/bbui"
import { ModalContent, Body, Input } from "@budibase/bbui"
import { writable } from "svelte/store"
import { auth } from "stores/backend"
import { saveRow } from "components/backend/DataTable/api"
import { TableNames } from "constants"
const values = writable({
firstName: $auth.user.firstName,
@ -11,19 +9,7 @@
})
const updateInfo = async () => {
const newUser = {
...$auth.user,
firstName: $values.firstName,
lastName: $values.lastName,
}
console.log(newUser)
const response = await saveRow(newUser, TableNames.USERS)
if (response.ok) {
await auth.checkAuth()
notifications.success("Information updated successfully")
} else {
notifications.error("Failed to update information")
}
// Update name
}
</script>

23
packages/builder/src/pages/builder/apps/index.svelte
View file

@ -19,16 +19,19 @@
import { AppStatus } from "constants"
import { gradient } from "actions"
import UpdateUserInfoModal from "./_components/UpdateUserInfoModal.svelte"
import ChangePasswordModal from "./_components/ChangePasswordModal.svelte"
let loaded = false
let userInfoModal
let userPasswordModal
let changePasswordModal
onMount(async () => {
await organisation.init()
await apps.load(AppStatus.DEV)
loaded = true
})
$: console.log($auth.user)
</script>
{#if loaded}
@ -56,7 +59,12 @@
<MenuItem icon="UserEdit" on:click={() => userInfoModal.show()}>
Update user information
</MenuItem>
<MenuItem icon="LockClosed">Update password</MenuItem>
<MenuItem
icon="LockClosed"
on:click={() => changePasswordModal.show()}
>
Update password
</MenuItem>
<MenuItem
icon="UserDeveloper"
on:click={() => $goto("../portal")}
@ -76,7 +84,11 @@
<div class="group-title">
<Body weight="500" size="XS">GROUP</Body>
{#if $auth.user?.builder?.global}
<Icon name="Settings" hoverable />
<Icon
name="Settings"
hoverable
on:click={() => alert("Navigate to portal group page.")}
/>
{/if}
</div>
{#each $apps as app, idx (app.appId)}
@ -100,6 +112,9 @@
<Modal bind:this={userInfoModal}>
<UpdateUserInfoModal />
</Modal>
<Modal bind:this={changePasswordModal}>
<ChangePasswordModal />
</Modal>
{/if}
<style>
@ -136,7 +151,7 @@
grid-gap: var(--spacing-xl);
}
.group {
margin-top: 20px;
margin-top: var(--spacing-s);
}
.group-title {
display: grid;