diff --git a/src/pages/auth/components/AuthForm/AuthForm.tsx b/src/pages/auth/components/AuthForm/AuthForm.tsx index f0e01f5..1d6f78f 100644 --- a/src/pages/auth/components/AuthForm/AuthForm.tsx +++ b/src/pages/auth/components/AuthForm/AuthForm.tsx @@ -15,7 +15,7 @@ import { import { SubmitHandler, useForm } from 'react-hook-form'; import { yupResolver } from '@hookform/resolvers/yup'; import useLoginQuery from 'hooks/useLoginQuery'; -import LoginSchema from 'validators/LoginSchema'; +import LoginSchema from './AuthForm.validator'; type AuthInputType = { login: string; diff --git a/src/validators/LoginSchema.ts b/src/pages/auth/components/AuthForm/AuthForm.validator.ts similarity index 88% rename from src/validators/LoginSchema.ts rename to src/pages/auth/components/AuthForm/AuthForm.validator.ts index 58df305..47cf244 100644 --- a/src/validators/LoginSchema.ts +++ b/src/pages/auth/components/AuthForm/AuthForm.validator.ts @@ -1,4 +1,4 @@ -import yup from 'validators'; +import yup from 'schema'; const LoginSchema = yup.object().shape({ login: yup.string().required('Login is required'), diff --git a/src/pages/profile/components/UpdateUserContactsForm/UpdateUserContactsForm.tsx b/src/pages/profile/components/UpdateUserContactsForm/UpdateUserContactsForm.tsx index 3891d23..afc8c1b 100644 --- a/src/pages/profile/components/UpdateUserContactsForm/UpdateUserContactsForm.tsx +++ b/src/pages/profile/components/UpdateUserContactsForm/UpdateUserContactsForm.tsx @@ -8,7 +8,7 @@ import { Text, Input, Button } from '@chakra-ui/react'; import { FormControl, FormHelperText } from '@chakra-ui/form-control'; import { yupResolver } from '@hookform/resolvers/yup'; import useUpdateUserContactsQuery from 'hooks/useUpdateUserContactsQuery'; -import UpdateUserContactsSchema from 'validators/UpdateUserContactsSchema'; +import UpdateUserContactsSchema from './UpdateUserContactsForm.validator'; type UpdateUserContactsInputType = { phone_number: string | null; diff --git a/src/validators/UpdateUserContactsSchema.ts b/src/pages/profile/components/UpdateUserContactsForm/UpdateUserContactsForm.validator.ts similarity index 96% rename from src/validators/UpdateUserContactsSchema.ts rename to src/pages/profile/components/UpdateUserContactsForm/UpdateUserContactsForm.validator.ts index 4726866..e8f9573 100644 --- a/src/validators/UpdateUserContactsSchema.ts +++ b/src/pages/profile/components/UpdateUserContactsForm/UpdateUserContactsForm.validator.ts @@ -1,4 +1,4 @@ -import yup from 'validators'; +import yup from 'schema'; const UpdateUserContactsSchema = yup.object().shape({ phone_number: yup diff --git a/src/pages/profile/containers/UpdatePasswordContainer/UpdatePasswordForm/UpdatePasswordForm.tsx b/src/pages/profile/containers/UpdatePasswordContainer/UpdatePasswordForm/UpdatePasswordForm.tsx index f236111..3c481dc 100644 --- a/src/pages/profile/containers/UpdatePasswordContainer/UpdatePasswordForm/UpdatePasswordForm.tsx +++ b/src/pages/profile/containers/UpdatePasswordContainer/UpdatePasswordForm/UpdatePasswordForm.tsx @@ -1,4 +1,5 @@ import React, { useContext } from 'react'; +import { useRootStore } from 'hooks/useRootStore'; import { Box, Stack } from '@chakra-ui/layout'; import { FormControl, FormLabel, FormHelperText } from '@chakra-ui/form-control'; import { Button } from '@chakra-ui/button'; @@ -6,7 +7,6 @@ import { Input } from '@chakra-ui/input'; import { SubmitHandler, useForm } from 'react-hook-form'; import { yupResolver } from '@hookform/resolvers/yup'; import UpdatePasswordSchema from './UpdatePasswordForm.validator'; -import { useRootStore } from 'hooks/useRootStore'; import { useToast } from '@chakra-ui/toast'; import { useErrorHandler } from 'react-error-boundary'; import { ProfilePageViewContext } from 'contexts'; @@ -27,6 +27,7 @@ const UpdatePasswordForm: React.FC = () => { handleSubmit, register, reset, + setFocus, formState: { errors }, } = useForm({ resolver: yupResolver(UpdatePasswordSchema), @@ -35,9 +36,9 @@ const UpdatePasswordForm: React.FC = () => { const toast = useToast(); const handleError = useErrorHandler(); - const onSubmit: SubmitHandler = async data => { + const onSubmit: SubmitHandler = async ({ old_password, new_password, confirm_password }) => { try { - await userStore.updateCurrentUserPassword(data.old_password, data.new_password); + await userStore.updateCurrentUserPassword(old_password, new_password); toast({ title: 'Password changed.', status: 'success' }); reset(); setStatusPageView(undefined); @@ -45,6 +46,10 @@ const UpdatePasswordForm: React.FC = () => { if (error.response) { if (error.response.status === 401) { toast({ title: 'Invalid current password.', status: 'error', duration: 2000 }); + reset({ old_password: '', new_password, confirm_password }); + setFocus('old_password'); + } else { + handleError(error); } } else { handleError(error); @@ -79,7 +84,7 @@ const UpdatePasswordForm: React.FC = () => { {...register('new_password')} /> - Must be at least 6 characters. + {errors.new_password ? errors.new_password.message : 'Must be at least 6 characters.'} @@ -93,7 +98,7 @@ const UpdatePasswordForm: React.FC = () => { {...register('confirm_password')} /> - Both passwords must match. + {errors.confirm_password ? errors.confirm_password.message : 'Both passwords must match.'} diff --git a/src/pages/profile/containers/UpdatePasswordContainer/UpdatePasswordForm/UpdatePasswordForm.validator.ts b/src/pages/profile/containers/UpdatePasswordContainer/UpdatePasswordForm/UpdatePasswordForm.validator.ts index 485c887..4d1b097 100644 --- a/src/pages/profile/containers/UpdatePasswordContainer/UpdatePasswordForm/UpdatePasswordForm.validator.ts +++ b/src/pages/profile/containers/UpdatePasswordContainer/UpdatePasswordForm/UpdatePasswordForm.validator.ts @@ -1,8 +1,14 @@ -import yup from 'validators'; +import yup from 'schema'; const UpdatePasswordSchema = yup.object().shape({ old_password: yup.string().required('Old password is required'), - new_password: yup.string().required('New password is required').min(6, 'Password bust be at least 6 characters.'), + new_password: yup + .string() + .required('New password is required') + .min(6, 'Password must be at least 6 characters.') + .test('password-unique', 'Password must be different from the old one.', function (value) { + return this.parent.old_password !== value; + }), confirm_password: yup .string() .required('Confirm password is required') diff --git a/src/validators/index.ts b/src/schema/index.ts similarity index 100% rename from src/validators/index.ts rename to src/schema/index.ts