watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2026-02-08 22:57:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Feat/um 140 password modal (#1718)

Browse source 
* Change password to modal.

* Close on save.
This commit is contained in:
Brian Cao 2022-12-28 12:37:09 -08:00 • committed by GitHub
parent 7bbed0e12b
commit 74d2cd8d03
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 58 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

31
components/pages/UserSettings.js
View file

@ -9,9 +9,11 @@ import useApi from 'hooks/useApi';
import Link from 'next/link';
import { useRouter } from 'next/router';
import { useEffect, useState } from 'react';
import { Breadcrumbs, Item, Tabs, useToast } from 'react-basics';
import { Breadcrumbs, Item, Icon, Tabs, useToast, Modal, Button } from 'react-basics';
import Pen from 'assets/pen.svg';
export default function UserSettings({ userId }) {
const [edit, setEdit] = useState(false);
const [values, setValues] = useState(null);
const [tab, setTab] = useState('general');
const { get } = useApi(getClientAuthToken());
@ -32,6 +34,18 @@ export default function UserSettings({ userId }) {
if (data) {
setValues(state => ({ ...state, ...data }));
}
if (edit) {
setEdit(false);
}
};
const handleAdd = () => {
setEdit(true);
};
const handleClose = () => {
setEdit(false);
};
const handleDelete = async () => {
@ -55,15 +69,26 @@ export default function UserSettings({ userId }) {
</Item>
<Item>{values?.username}</Item>
</Breadcrumbs>
<Button onClick={handleAdd}>
<Icon>
<Pen />
</Icon>
Change Password
</Button>
</PageHeader>
<Tabs selectedKey={tab} onSelect={setTab} style={{ marginBottom: 30, fontSize: 14 }}>
<Item key="general">General</Item>
<Item key="password">Password</Item>
<Item key="delete">Danger Zone</Item>
</Tabs>
{tab === 'general' && <UserEditForm userId={userId} data={values} onSave={handleSave} />}
{tab === 'password' && <UserPasswordForm userId={userId} data={values} onSave={handleSave} />}
{tab === 'delete' && <UserDelete userId={userId} onSave={handleDelete} />}
{edit && (
<Modal title="Add website" onClose={handleClose}>
{close => (
<UserPasswordForm userId={userId} data={values} onSave={handleSave} onClose={close} />
)}
</Modal>
)}
</Page>
);
}