watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2026-02-06 13:47:15 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

Refactored settings components.

Browse source
This commit is contained in:
Mike Cao 2023-01-09 23:59:26 -08:00
parent d827b79c72
commit 7450b76e6d
91 changed files with 736 additions and 353 deletions
Download patch file Download diff file Expand all files Collapse all files

78
components/forms/UserPasswordForm.js
View file

@ -1,78 +0,0 @@
import { useRef } from 'react';
import { Form, FormRow, FormInput, FormButtons, PasswordField, Button } from 'react-basics';
import useApi from 'hooks/useApi';
import styles from './UserPasswordForm.module.css';
import useUser from 'hooks/useUser';
export default function UserPasswordForm({ onSave, onClose, userId }) {
const user = useUser();
const isCurrentUser = !userId || user?.id === userId;
const url = isCurrentUser ? `/users/${user?.id}/password` : `/users/${user?.id}`;
const { post, useMutation } = useApi();
const { mutate, error, isLoading } = useMutation(data => post(url, data));
const ref = useRef(null);
const handleSubmit = async data => {
const payload = isCurrentUser
? data
: {
password: data.newPassword,
};
mutate(payload, {
onSuccess: async () => {
onSave();
ref.current.reset();
},
});
};
const samePassword = value => {
if (value !== ref?.current?.getValues('newPassword')) {
return "Passwords don't match";
}
return true;
};
return (
<Form ref={ref} className={styles.form} onSubmit={handleSubmit} error={error}>
{isCurrentUser && (
<FormRow label="Current password">
<FormInput name="currentPassword" rules={{ required: 'Required' }}>
<PasswordField autoComplete="off" />
</FormInput>
</FormRow>
)}
<FormRow label="New password">
<FormInput
name="newPassword"
rules={{
required: 'Required',
minLength: { value: 8, message: 'Minimum length 8 characters' },
}}
>
<PasswordField autoComplete="off" />
</FormInput>
</FormRow>
<FormRow label="Confirm password">
<FormInput
name="confirmPassword"
rules={{
required: 'Required',
minLength: { value: 8, message: 'Minimum length 8 characters' },
validate: samePassword,
}}
>
<PasswordField autoComplete="off" />
</FormInput>
</FormRow>
<FormButtons flex>
<Button type="submit" variant="primary" disabled={isLoading}>
Save
</Button>
<Button onClick={onClose}>Close</Button>
</FormButtons>
</Form>
);
}