import React, { useState } from 'react'; import { RouteComponentProps } from 'react-router'; import { Link } from 'react-router-dom'; import performPasswordReset from '@/api/auth/performPasswordReset'; import { httpErrorToHuman } from '@/api/http'; import LoginFormContainer from '@/components/auth/LoginFormContainer'; import { Actions, useStoreActions } from 'easy-peasy'; import { ApplicationStore } from '@/state'; import { Formik, FormikHelpers } from 'formik'; import { object, ref, string } from 'yup'; import Field from '@/components/elements/Field'; import Input from '@/components/elements/Input'; import tw from 'twin.macro'; import Button from '@/components/elements/Button'; interface Values { password: string; passwordConfirmation: string; } export default ({ match, location }: RouteComponentProps<{ token: string }>) => { const [email, setEmail] = useState(''); const { clearFlashes, addFlash } = useStoreActions((actions: Actions) => actions.flashes); const parsed = new URLSearchParams(location.search); if (email.length === 0 && parsed.get('email')) { setEmail(parsed.get('email') || ''); } const submit = ({ password, passwordConfirmation }: Values, { setSubmitting }: FormikHelpers) => { clearFlashes(); performPasswordReset(email, { token: match.params.token, password, passwordConfirmation }) .then(() => { // @ts-expect-error this is valid window.location = '/'; }) .catch((error) => { console.error(error); setSubmitting(false); addFlash({ type: 'error', title: 'Error', message: httpErrorToHuman(error) }); }); }; return ( {({ isSubmitting }) => (
Return to Login
)}
); };