import type { NextPage } from 'next' import Link from 'next/link' import useTranslation from 'next-translate/useTranslation' import axios from 'axios' import { useForm } from 'react-component-form' import type { HandleUseFormCallback } from 'react-component-form' import { AuthenticationForm } from '../../components/Authentication' import { Head } from '../../components/Head' import { Header } from '../../components/Header' import { Main } from '../../components/design/Main' import type { FooterProps } from '../../components/Footer' import { Footer } from '../../components/Footer' import { Input } from '../../components/design/Input' import { Button } from '../../components/design/Button' import { FormState } from '../../components/design/FormState' import { authenticationFromServerSide } from '../../tools/authentication' import { userSchema } from '../../models/User' import { api } from '../../tools/api' import { useFormTranslation } from '../../hooks/useFormTranslation' const schema = { email: userSchema.email } const ForgotPassword: NextPage = (props) => { const { t } = useTranslation() const { version } = props const { handleUseForm, fetchState, message, errors } = useForm(schema) const { getFirstErrorTranslation } = useFormTranslation() const onSubmit: HandleUseFormCallback = async ( formData, formElement ) => { try { await api.post( `/users/reset-password?redirectURI=${window.location.origin}/authentication/reset-password`, formData ) formElement.reset() return { type: 'success', message: 'authentication:success-forgot-password' } } catch (error) { if (axios.isAxiosError(error) && error.response?.status === 400) { return { type: 'error', message: 'errors:invalid-email' } } return { type: 'error', message: 'errors:server-error' } } } return ( <>

{t('authentication:already-know-password')}