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

@@ -16,6 +16,7 @@ export const AlertBox: FC = () => {
       title: container.alertBox?.title ?? '',
       isOpen: false,
     })
+    if (container.alertBox?.onCloseCallback) container.alertBox.onCloseCallback()
   }
 
   return (

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<RegisterFormValues>({
+  const {handleSubmit, control, watch, setValue, getValues, setError} = useForm<RegisterFormValues>({
     defaultValues,
     values: defaultValues,
   })
@@ -85,7 +85,17 @@ export const RegisterForm: FC = () => {
       return axios.post<IGeneralPostResponse>(`/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<RegisterErrorResponseData>) => {
       if (error.response?.status === 400) {
         if (error.response.data.email) {
@@ -98,7 +108,6 @@ export const RegisterForm: FC = () => {
   })
 
   const onSubmit: SubmitHandler<RegisterFormValues> = (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)

src/utils/AlertContainer.tsx

@@ -5,6 +5,7 @@ export interface AlertProps {
   isOpen: boolean
   title?: string
   message?: string
+  onCloseCallback?: () => void
 }
 
 const useAlertBox = () => {

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}

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}
 }