diff --git a/src/components/registration/Registration.tsx b/src/components/registration/Registration.tsx index 8fab164ac..3b07fc638 100644 --- a/src/components/registration/Registration.tsx +++ b/src/components/registration/Registration.tsx @@ -174,14 +174,17 @@ export const Registration = () => { return ( <> } showRegistrationInfoDrawer={true} > { - const settings = useAppConfig(); - const isFirstVisit = useIsFirstVisit(); - const { Stage } = useContext(GlobalComponentContext); - const { - disabledNextButton, - setDisabledNextButton, - updateSessionStorageWithPreppedData, - refreshSessionStorageRegistrationData, - sessionStorageRegistrationData, - availableSteps, - dataPrepForSessionStorage, - consultant, - isConsultantLink - } = useContext(RegistrationContext); - const { tenant } = useContext(TenantContext); - const [currentStep, setCurrentStep] = useState(1); - const [redirectOverlayActive, setRedirectOverlayActive] = - useState(false); - const location = useLocation(); - const history = useHistory(); - const { t } = useTranslation(); - const handleOverlayAction = (buttonFunction: string) => { - if (buttonFunction === OVERLAY_FUNCTIONS.REDIRECT_WITH_BLUR) { - redirectToApp(); - } - }; - const overlayItemRegistrationSuccess: OverlayItem = { - illustrationStyle: 'large', - svg: HelloBannerIcon, - headline: t('registration.overlay.success.headline'), - copy: t('registration.overlay.success.copy'), - buttonSet: [ - { - label: t('registration.overlay.success.button'), - function: OVERLAY_FUNCTIONS.REDIRECT_WITH_BLUR, - type: BUTTON_TYPES.AUTO_CLOSE - } - ] - }; - - const updateCurrentStep = () => { - const currentLocation = location?.pathname?.replace( - '/registration', - '' - ); - const step = availableSteps.findIndex( - (step) => step?.urlSuffix === currentLocation - ); - setCurrentStep(step === -1 ? 0 : step); - }; - - const checkForStepsWithMissingMandatoryFields = (): number[] => { - if (currentStep > 0) { - return availableSteps.reduce( - (missingSteps, step, currentIndex) => { - if ( - step?.mandatoryFields?.some( - (mandatoryField) => - sessionStorageRegistrationData?.[ - mandatoryField - ] === undefined - ) - ) { - return [...missingSteps, currentIndex]; - } - return missingSteps; - }, - [] - ); - } - return []; - }; - - const onNextClick = () => { - updateSessionStorageWithPreppedData(); - }; - - useEffect(() => { - setDisabledNextButton(true); - updateCurrentStep(); - refreshSessionStorageRegistrationData(); - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [location]); - - useEffect(() => { - // Check if mandatory fields from previous steps are missing - const missingPreviousSteps = checkForStepsWithMissingMandatoryFields() - .sort() - .filter((missingStep) => missingStep < currentStep); - - if (missingPreviousSteps.length > 0) { - history.push( - `/registration${ - availableSteps[missingPreviousSteps[0]]?.urlSuffix - }${location.search}` - ); - } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [currentStep, availableSteps, sessionStorageRegistrationData]); - - const onRegisterClick = useCallback(() => { - const registrationData = { - ...sessionStorageRegistrationData, - ...dataPrepForSessionStorage, - agencyId: sessionStorageRegistrationData.agencyId.toString(), - postcode: sessionStorageRegistrationData.zipcode, - termsAccepted: 'true', - preferredLanguage: 'de', - // ConsultingType and mainTopicId are identical for the MVP - consultingType: sessionStorageRegistrationData.mainTopicId, - ...(isConsultantLink - ? { consultantId: consultant?.consultantId } - : {}) - }; - - if ( - Object.keys(REGISTRATION_DATA_VALIDATION).every((item) => - REGISTRATION_DATA_VALIDATION[item].validation( - registrationData[item] - ) - ) - ) { - apiPostRegistration( - endpoints.registerAsker, - registrationData, - settings.multitenancyWithSingleDomainEnabled, - tenant - ).then(() => { - sessionStorage.removeItem(registrationSessionStorageKey); - setRedirectOverlayActive(true); - }); - } - }, [ - consultant?.consultantId, - dataPrepForSessionStorage, - isConsultantLink, - sessionStorageRegistrationData, - settings.multitenancyWithSingleDomainEnabled, - tenant - ]); - - return ( - <> - } - showRegistrationInfoDrawer={true} - > - - {availableSteps[currentStep]?.component === 'welcome' ? ( - - ) : ( - <> - - - -
- - {t('registration.headline')} - - - {} - - - {availableSteps[currentStep]?.component === - 'topicSelection' && ( - - )} - {availableSteps[currentStep]?.component === - 'zipcode' && } - {availableSteps[currentStep]?.component === - 'agencySelection' && ( - - )} - {availableSteps[currentStep]?.component === - 'accountData' && } - - {availableSteps[currentStep]?.component !== - 'welcome' && ( - - - {currentStep > 0 && ( - - {t('registration.back')} - - )} - {currentStep === - availableSteps.length - 1 ? ( - - ) : ( - - )} - - - )} - - - )} -
-
- {redirectOverlayActive && ( - - )} - - ); -};