From 5536ba7ac2afb9d074cb31fa44510e61da3c2e5b Mon Sep 17 00:00:00 2001 From: Viliam Geffert <60324080+vgeffer@users.noreply.github.com> Date: Sun, 24 Nov 2024 12:55:47 +0100 Subject: [PATCH] 492 nahradit stranku verifikacia dialogom (#497) * Added close callback to AlertBox * Changed landing page for alert * Fixed errors with RegistrationForm * Removed verification landing page --- src/components/Alert/AlertBox.tsx | 1 + src/components/RegisterForm/RegisterForm.tsx | 17 +++++++++++++---- src/components/Verification/Verification.tsx | 11 ----------- src/pages/malynar/verifikacia/[[...params]].tsx | 9 --------- src/pages/matik/verifikacia/[[...params]].tsx | 9 --------- src/pages/strom/verifikacia/[[...params]].tsx | 15 --------------- src/utils/AlertContainer.tsx | 1 + src/utils/useAlert.ts | 9 +++++++-- src/utils/useNavigationTrap.ts | 9 +++++---- 9 files changed, 27 insertions(+), 54 deletions(-) delete mode 100644 src/components/Verification/Verification.tsx delete mode 100644 src/pages/malynar/verifikacia/[[...params]].tsx delete mode 100644 src/pages/matik/verifikacia/[[...params]].tsx delete mode 100644 src/pages/strom/verifikacia/[[...params]].tsx diff --git a/src/components/Alert/AlertBox.tsx b/src/components/Alert/AlertBox.tsx index fa617aff..b3ad9685 100644 --- a/src/components/Alert/AlertBox.tsx +++ b/src/components/Alert/AlertBox.tsx @@ -16,6 +16,7 @@ export const AlertBox: FC = () => { title: container.alertBox?.title ?? '', isOpen: false, }) + if (container.alertBox?.onCloseCallback) container.alertBox.onCloseCallback() } return ( diff --git a/src/components/RegisterForm/RegisterForm.tsx b/src/components/RegisterForm/RegisterForm.tsx index 8a9faedb..c0db1f3c 100644 --- a/src/components/RegisterForm/RegisterForm.tsx +++ b/src/components/RegisterForm/RegisterForm.tsx @@ -46,7 +46,7 @@ const defaultValues: RegisterFormValues = { } export const RegisterForm: FC = () => { - const {handleSubmit, control, watch, setValue, getValues, setError, reset} = useForm({ + const {handleSubmit, control, watch, setValue, getValues, setError} = useForm({ defaultValues, values: defaultValues, }) @@ -85,7 +85,17 @@ export const RegisterForm: FC = () => { return axios.post(`/api/user/registration?seminar=${seminar}`, transformFormData(data)) }, // TODO: show alert/toast and redirect to homepage instead of redirect to info page - onSuccess: () => router.push(`${router.asPath}/../verifikacia`), + onSuccess: () => + alert( + 'Verifikačný e-mail bol odoslaný na zadanú e-mailovú adresu. Ak ho do pár minút neuvidíš, skontroluj, či ti náhodou neprišiel do priečinku spam', + { + title: 'Registrácia', + onCloseCallback: () => { + setOverride(true) + router.push(`${router.asPath}/../`) + }, + }, + ), onError: (error: AxiosError) => { if (error.response?.status === 400) { if (error.response.data.email) { @@ -98,7 +108,6 @@ export const RegisterForm: FC = () => { }) const onSubmit: SubmitHandler = (data) => { - reset(undefined, {keepValues: true}) submitFormData(data) } @@ -112,7 +121,7 @@ export const RegisterForm: FC = () => { const [dialogOpen, setDialogOpen] = useState(false) - const {continueNavigation} = useNavigationTrap({ + const {continueNavigation, setOverride} = useNavigationTrap({ shouldBlockNavigation: isDirty, onNavigate: () => { setDialogOpen(true) diff --git a/src/components/Verification/Verification.tsx b/src/components/Verification/Verification.tsx deleted file mode 100644 index 5f7a296f..00000000 --- a/src/components/Verification/Verification.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import {Typography} from '@mui/material' -import {FC} from 'react' - -export const Verification: FC = () => { - return ( - - Verifikačný e-mail bol odoslaný na zadanú e-mailovú adresu. Ak ho do pár minút neuvidíš, skontroluj, či ti náhodou - neprišiel do priečinku spam. - - ) -} diff --git a/src/pages/malynar/verifikacia/[[...params]].tsx b/src/pages/malynar/verifikacia/[[...params]].tsx deleted file mode 100644 index 648e2b65..00000000 --- a/src/pages/malynar/verifikacia/[[...params]].tsx +++ /dev/null @@ -1,9 +0,0 @@ -import {NextPage} from 'next' - -import Page from '../../strom/verifikacia/[[...params]]' - -const Verifikacia: NextPage = () => { - return -} - -export default Verifikacia diff --git a/src/pages/matik/verifikacia/[[...params]].tsx b/src/pages/matik/verifikacia/[[...params]].tsx deleted file mode 100644 index 648e2b65..00000000 --- a/src/pages/matik/verifikacia/[[...params]].tsx +++ /dev/null @@ -1,9 +0,0 @@ -import {NextPage} from 'next' - -import Page from '../../strom/verifikacia/[[...params]]' - -const Verifikacia: NextPage = () => { - return -} - -export default Verifikacia diff --git a/src/pages/strom/verifikacia/[[...params]].tsx b/src/pages/strom/verifikacia/[[...params]].tsx deleted file mode 100644 index 3a39698d..00000000 --- a/src/pages/strom/verifikacia/[[...params]].tsx +++ /dev/null @@ -1,15 +0,0 @@ -import {NextPage} from 'next' - -import {PageLayout} from '@/components/PageLayout/PageLayout' - -import {Verification} from '../../../components/Verification/Verification' - -const Verifikacia: NextPage = () => { - return ( - - - - ) -} - -export default Verifikacia diff --git a/src/utils/AlertContainer.tsx b/src/utils/AlertContainer.tsx index be86fd59..2a651882 100644 --- a/src/utils/AlertContainer.tsx +++ b/src/utils/AlertContainer.tsx @@ -5,6 +5,7 @@ export interface AlertProps { isOpen: boolean title?: string message?: string + onCloseCallback?: () => void } const useAlertBox = () => { diff --git a/src/utils/useAlert.ts b/src/utils/useAlert.ts index ffa9fa12..282223d9 100644 --- a/src/utils/useAlert.ts +++ b/src/utils/useAlert.ts @@ -5,8 +5,13 @@ import {AlertContainer} from '@/utils/AlertContainer' export const useAlert = () => { const container = useContainer(AlertContainer) - const alert = (message: string, title?: string) => { - container.setAlertBox({message: message, title: title ?? 'Upozornenie', isOpen: true}) + const alert = (message: string, options?: {title?: string; onCloseCallback?: () => void}) => { + container.setAlertBox({ + message: message, + title: options?.title ?? 'Upozornenie', + isOpen: true, + onCloseCallback: options?.onCloseCallback, + }) } return {alert} diff --git a/src/utils/useNavigationTrap.ts b/src/utils/useNavigationTrap.ts index 8268c5e5..d13749ef 100644 --- a/src/utils/useNavigationTrap.ts +++ b/src/utils/useNavigationTrap.ts @@ -1,5 +1,5 @@ import {useRouter} from 'next/router' -import {useCallback, useEffect, useRef} from 'react' +import {useCallback, useEffect, useRef, useState} from 'react' interface NavigationTrapProps { shouldBlockNavigation: boolean @@ -12,6 +12,7 @@ export const useNavigationTrap = ({shouldBlockNavigation, onNavigate}: Navigatio const currentPath = router.asPath const nextPath = useRef('') const navConfirmed = useRef(false) + const [override, setOverride] = useState(false) const killNavigation = useCallback(() => { router.events.emit('routeChangeError', '', '', {shallow: false}) @@ -22,7 +23,7 @@ export const useNavigationTrap = ({shouldBlockNavigation, onNavigate}: Navigatio useEffect(() => { const pageNavigate = (path: string) => { - if (navConfirmed.current) return + if (override || navConfirmed.current) return if (shouldBlockNavigation && path !== currentPath) { nextPath.current = path onNavigate() @@ -41,12 +42,12 @@ export const useNavigationTrap = ({shouldBlockNavigation, onNavigate}: Navigatio router.events.off('routeChangeStart', pageNavigate) window.removeEventListener('beforeunload', pageExit) } - }, [shouldBlockNavigation, currentPath, killNavigation, onNavigate, router.events]) + }, [shouldBlockNavigation, currentPath, killNavigation, onNavigate, override, router.events]) const continueNavigation = () => { navConfirmed.current = true router.push(nextPath.current) } - return {nextPath, continueNavigation} + return {nextPath, continueNavigation, setOverride} }