From 7d5c0aeea9ee0514a09d0a09a15147c017fa2e1e Mon Sep 17 00:00:00 2001 From: SrJuggernaut Date: Tue, 6 Feb 2024 20:25:27 -0600 Subject: [PATCH] chore: updated old formik forms to use hooks --- src/app/equipo/unirse/ApplyForm.tsx | 21 ++++------------ src/app/login/LoginForm.tsx | 24 ++++--------------- .../CreateRecoverPasswordForm.tsx | 21 ++++------------ .../UpdateRecoverPasswordForm.tsx | 21 ++++------------ src/app/register/RegisterForm.tsx | 22 ++++------------- 5 files changed, 22 insertions(+), 87 deletions(-) diff --git a/src/app/equipo/unirse/ApplyForm.tsx b/src/app/equipo/unirse/ApplyForm.tsx index a4c6461..ddf1edd 100644 --- a/src/app/equipo/unirse/ApplyForm.tsx +++ b/src/app/equipo/unirse/ApplyForm.tsx @@ -5,6 +5,7 @@ import FormGroup from '@/components/ui/form/FormGroup' import Input from '@/components/ui/form/Input' import TextArea from '@/components/ui/form/TextArea' import { useAppDispatch } from '@/hooks/useAppDispatch' +import useManageError from '@/hooks/useManageError' import { addAlert } from '@/state/feedbackSlice' import { css } from '@/styled-system/css' import { teamApplicationDataSchema, type TeamApplicationData } from '@/utilities/teamApplication' @@ -19,6 +20,7 @@ import { useEffect, type FC } from 'react' const ApplyForm: FC = () => { const searchParams = useSearchParams() + const { manageError } = useManageError() const dispatch = useAppDispatch() const formik = useFormik({ @@ -46,26 +48,11 @@ const ApplyForm: FC = () => { severity: 'success' })) } catch (error) { - if (error instanceof Error) { - dispatch(addAlert({ - id: nanoid(), - title: 'Error al enviar el formulario', - message: error.message, - severity: 'error' - })) - return - } - console.error('Error al enviar el formulario', error) - dispatch(addAlert({ - id: nanoid(), - title: 'Error al enviar el formulario', - message: 'Error desconocido', - severity: 'error' - })) + manageError(error, 'Error al enviar el formulario', 'Error desconocido al enviar el formulario', 'error') } }, validationSchema: teamApplicationDataSchema, - isInitialValid: false + validateOnMount: true }) useEffect(() => { if (searchParams.has('role')) { diff --git a/src/app/login/LoginForm.tsx b/src/app/login/LoginForm.tsx index 915dac1..e216f23 100644 --- a/src/app/login/LoginForm.tsx +++ b/src/app/login/LoginForm.tsx @@ -6,10 +6,8 @@ import Input from '@/components/ui/form/Input' import PasswordInput from '@/components/ui/form/PasswordInput' import { useAppDispatch } from '@/hooks/useAppDispatch' import { useAppSelector } from '@/hooks/useAppSelector' -import { addAlert } from '@/state/feedbackSlice' +import useManageError from '@/hooks/useManageError' import { setCurrentUser, setSession, setStatus } from '@/state/sessionSlice' -import { nanoid } from '@reduxjs/toolkit' -import { AppwriteException } from 'appwrite' import { getCurrentUser, login } from 'entgamers-database/frontend/session' import { useFormik } from 'formik' import NextLink from 'next/link' @@ -29,6 +27,7 @@ const loginSchema = object({ const LoginForm: FC = () => { const dispatch = useAppDispatch() + const { manageError } = useManageError() const session = useAppSelector((state) => state.session) const router = useRouter() @@ -45,26 +44,13 @@ const LoginForm: FC = () => { dispatch(setSession(session)) dispatch(setCurrentUser(user)) } catch (error) { - if (error instanceof AppwriteException) { - dispatch(addAlert({ - id: nanoid(), - message: error.message, - title: 'Error mientras se iniciaba sesión', - severity: 'error' - })) - } else { - dispatch(addAlert({ - id: nanoid(), - message: 'Error desconocido', - title: 'Error mientras se iniciaba sesión', - severity: 'error' - })) - } + manageError(error, 'Error mientras se iniciaba sesión', 'Error desconocido mientras se iniciaba sesión', 'error') } finally { dispatch(setStatus('idle')) } }, - validationSchema: loginSchema + validationSchema: loginSchema, + validateOnMount: true }) useEffect(() => { diff --git a/src/app/recover-password/CreateRecoverPasswordForm.tsx b/src/app/recover-password/CreateRecoverPasswordForm.tsx index 8ac6b1c..fe3f0e1 100644 --- a/src/app/recover-password/CreateRecoverPasswordForm.tsx +++ b/src/app/recover-password/CreateRecoverPasswordForm.tsx @@ -4,9 +4,9 @@ import Typography from '@/components/ui/Typography' import FormGroup from '@/components/ui/form/FormGroup' import Input from '@/components/ui/form/Input' import { useAppDispatch } from '@/hooks/useAppDispatch' +import useManageError from '@/hooks/useManageError' import { addAlert } from '@/state/feedbackSlice' import { nanoid } from '@reduxjs/toolkit' -import { AppwriteException } from 'appwrite' import { createPasswordRecovery } from 'entgamers-database/frontend/session' import { useFormik } from 'formik' import { type FC } from 'react' @@ -21,6 +21,7 @@ const recoverPasswordSchema = object({ }) const CreateRecoverPasswordForm: FC = () => { + const { manageError } = useManageError() const dispatch = useAppDispatch() const formik = useFormik({ @@ -38,25 +39,11 @@ const CreateRecoverPasswordForm: FC = () => { severity: 'success' })) } catch (error) { - if (error instanceof AppwriteException) { - dispatch(addAlert({ - id: nanoid(), - message: error.message, - title: 'Error mientras se registraba', - severity: 'error' - })) - } else { - dispatch(addAlert({ - id: nanoid(), - message: 'Error desconocido', - title: 'Error mientras se solicitaba la recuperación de contraseña', - severity: 'error' - })) - } + manageError(error, 'Error mientras se registraba', 'Error desconocido mientras se registraba', 'error') } }, validationSchema: recoverPasswordSchema, - isInitialValid: false + validateOnMount: true }) return (
= (props) => { const dispatch = useAppDispatch() + const { manageError } = useManageError() const router = useRouter() const formik = useFormik({ @@ -54,25 +55,11 @@ const UpdateRecoverPasswordForm: FC = (props) => })) router.push('/login') } catch (error) { - if (error instanceof AppwriteException) { - dispatch(addAlert({ - id: nanoid(), - message: error.message, - title: 'Error mientras se registraba', - severity: 'error' - })) - } else { - dispatch(addAlert({ - id: nanoid(), - message: 'Error desconocido', - title: 'Error mientras se solicitaba la recuperación de contraseña', - severity: 'error' - })) - } + manageError(error, 'Error al recuperar contraseña', 'Error desconocido mientras se solicitaba la recuperación de contraseña', 'error') } }, validationSchema: updateRecoverPasswordSchema, - isInitialValid: false + validateOnMount: true }) return ( { const dispatch = useAppDispatch() + const { manageError } = useManageError() const formik = useFormik({ initialValues: { @@ -50,24 +51,11 @@ const RegisterForm: FC = () => { })) formik.resetForm() } catch (error) { - if (error instanceof AppwriteException) { - dispatch(addAlert({ - id: nanoid(), - message: error.message, - title: 'Error mientras se registraba', - severity: 'error' - })) - } else { - dispatch(addAlert({ - id: nanoid(), - message: 'Error desconocido', - title: 'Error mientras se registraba', - severity: 'error' - })) - } + manageError(error, 'Error mientras se registraba', 'Error desconocido mientras se registraba', 'error') } }, - validationSchema: RegisterSchema + validationSchema: RegisterSchema, + validateOnMount: true }) return (