import React, { ReactElement, useState } from 'react'; import { NextPageWithLayout } from '../_app'; import AccountLayout from '@/components/sheardComponent/AccountLayout'; import Pagetitle from '@/components/sheardComponent/Pagetitle'; import * as yup from "yup"; import { useForm } from "react-hook-form"; import { yupResolver } from "@hookform/resolvers/yup"; import { useToast } from '@/hooks/useToast'; import useAxiosPrivate from '@/hooks/useAxiosPrivate'; import { api_routes } from '@/helper/routes'; import Head from 'next/head'; const schema = yup .object({ old_password: yup.string().required(), password: yup.string().required(), confirm_password: yup .string() .required() .oneOf([yup.ref("password")], "Passwords must match"), }) .required(); const SettingsPage:NextPageWithLayout = () => { const [loading, setLoading] = useState(false); const {toastSuccess, toastError} = useToast(); const axiosPrivate = useAxiosPrivate(); const [showPassword, setShowPassword] = useState(false); const [showPasswordTwo, setShowPasswordTwo] = useState(false); const [showPassword3, setShowPassword3] = useState(false); const { handleSubmit, register, setError, getValues, reset, formState: { errors }, } = useForm({ resolver: yupResolver(schema), }); const onSubmit = async () => { setLoading(true); try { const response = await axiosPrivate.post(api_routes.password_update, {...getValues()}); toastSuccess(response.data.message); reset({ old_password: "", password: "", confirm_password: "", }); } catch (error: any) { if (error?.response?.data?.message) { toastError(error?.response?.data?.message); } if (error?.response?.data?.errors?.old_password) { setError("old_password", { type: "server", message: error?.response?.data?.errors?.old_password[0], }); } if (error?.response?.data?.errors?.password) { setError("password", { type: "server", message: error?.response?.data?.errors?.password[0], }); } if (error?.response?.data?.errors?.confirm_password) { setError("confirm_password", { type: "server", message: error?.response?.data?.errors?.confirm_password[0], }); } } finally { setLoading(false); } }; return ( <> JAP - Settings

Settings

{errors.old_password && ( {errors.old_password.message} )}
{errors.password && ( {errors.password.message} )}
{errors.confirm_password && ( {errors.confirm_password.message} )}
); }; SettingsPage.getLayout = function getLayout(page: ReactElement) { return (
{page}
) } export default SettingsPage;