Add modal to let users change their own password, without endpoint for now
This commit is contained in:
parent
5c8c663935
commit
ba1ee6b033
|
@ -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>
|
|
@ -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>
|
||||
|
||||
|
|
|
@ -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;
|
||||
|
|
Loading…
Reference in New Issue