From 864fc7db95f081543e9c137438cf5f7bfad93cc5 Mon Sep 17 00:00:00 2001 From: Marc Itzenthaler Date: Tue, 27 Feb 2024 01:41:54 +0100 Subject: [PATCH] feat: added feature toggle logic for counselling relation --- .../components/askerInfo/AskerInfoContent.tsx | 21 ++--- .../AgencyFields/AgencySelection/index.tsx | 22 +++-- .../registration/AgencyFields/index.tsx | 9 +- .../CounsellingRelation/index.tsx | 39 ++++++++ .../registration/RegistrationForm.tsx | 89 +++++++------------ src/extensions/cypress/e2e/registration.cy.ts | 53 +++++++++-- 6 files changed, 148 insertions(+), 85 deletions(-) create mode 100644 src/extensions/components/registration/CounsellingRelation/index.tsx diff --git a/src/extensions/components/askerInfo/AskerInfoContent.tsx b/src/extensions/components/askerInfo/AskerInfoContent.tsx index 08921e8f1..1cbcab9b6 100644 --- a/src/extensions/components/askerInfo/AskerInfoContent.tsx +++ b/src/extensions/components/askerInfo/AskerInfoContent.tsx @@ -67,11 +67,6 @@ export const AskerInfoContent = () => { ); }, [activeSession, type, userData]); - const translateKeys = { - gender: `profile.gender.options.${sessionData?.gender?.toLowerCase()}`, - counselling: `profile.counsellingRelation.${sessionData?.counsellingRelation?.toLowerCase()}` - }; - return ( <> {!sessionData && ( @@ -88,12 +83,18 @@ export const AskerInfoContent = () => { /> - + {tenant.settings.featureCounsellingRelationsEnabled && ( + + )} { - const field = React.useContext(FieldContext); + const field = useContext(FieldContext); + const { tenant } = useContext(TenantContext); const [isLoading, setIsLoading] = useState(false); const [agencies, setAgencies] = useState([ ...(preselectedAgencies || []) @@ -103,12 +105,14 @@ export const AgencySelection = ({ postCode: postcode, counsellingRelation } = field.getFieldsValue(); + const isValidToRequestData = preselectedAgencies.length === 0 && Number(mainTopicId) >= 0 && age && gender && - counsellingRelation && + (!tenant.settings.featureCounsellingRelationsEnabled || + counsellingRelation) && !!postcode?.match(REGEX_POSTCODE); const { t: translate } = useTranslation(); @@ -168,12 +172,12 @@ export const AgencySelection = ({ ? [ 'registration.agencyPreselected.intro.point1', 'registration.agencyPreselected.intro.point2' - ] + ] : [ 'registration.agencySelection.intro.point1', 'registration.agencySelection.intro.point2', 'registration.agencySelection.intro.point3' - ]; + ]; return (
@@ -183,10 +187,10 @@ export const AgencySelection = ({ preselectedAgencies.length ? translate( 'registration.agencyPreselected.intro.overline' - ) + ) : translate( 'registration.agencySelection.intro.overline' - ) + ) } type="infoLargeAlternative" /> @@ -196,10 +200,10 @@ export const AgencySelection = ({ preselectedAgencies.length ? translate( 'registration.agencyPreselected.intro.subline' - ) + ) : translate( 'registration.agencySelection.intro.subline' - ) + ) } type="infoLargeAlternative" /> diff --git a/src/extensions/components/registration/AgencyFields/index.tsx b/src/extensions/components/registration/AgencyFields/index.tsx index 4e64f104c..f75fe2530 100644 --- a/src/extensions/components/registration/AgencyFields/index.tsx +++ b/src/extensions/components/registration/AgencyFields/index.tsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useContext } from 'react'; import { FieldContext } from 'rc-field-form'; import { ConsultingTypeBasicInterface, @@ -8,6 +8,7 @@ import { InputFormField } from '../InputFormField'; import { AgencySelection } from './AgencySelection'; import { useTranslation } from 'react-i18next'; import { Text } from '../../../../components/text/Text'; +import { TenantContext } from '../../../../globalState'; interface AgencySelectionFormFieldProps { preselectedAgencies: AgencyDataInterface[]; @@ -18,7 +19,8 @@ export const AgencySelectionFormField = ({ consultingType, preselectedAgencies }: AgencySelectionFormFieldProps) => { - const field = React.useContext(FieldContext); + const field = useContext(FieldContext); + const { tenant } = useContext(TenantContext); const { t: translate } = useTranslation(); const { mainTopicId, gender, age, counsellingRelation } = field.getFieldsValue(); @@ -29,7 +31,8 @@ export const AgencySelectionFormField = ({ Number(mainTopicId) >= 0 && gender && age && - counsellingRelation + (!tenant.settings.featureCounsellingRelationsEnabled || + counsellingRelation) ) || preselectedAgencies.length > 0 ? ( { + const { t: translate } = useTranslation(); + const counsellingRelationParam = getUrlParameter('counsellingRelation'); + + // Get the counselling relation from the query parameter + const counsellingRelation = useMemo((): string | null => { + if (!counsellingRelationParam) return null; + const fullRelation = `${counsellingRelationParam.toUpperCase()}_COUNSELLING`; + const allRelations: string[] = Object.values(COUNSELLING_RELATIONS); + return allRelations.includes(fullRelation) ? fullRelation : null; + }, [counsellingRelationParam]); + + return ( + ({ + label: translate( + `registrationDigi.counsellingRelation.options.${value.toLowerCase()}` + ), + value + }))} + preset={counsellingRelation} + /> + ); +}; + +export default CounsellingRelation; diff --git a/src/extensions/components/registration/RegistrationForm.tsx b/src/extensions/components/registration/RegistrationForm.tsx index 5fdfbfe34..6306c36f5 100644 --- a/src/extensions/components/registration/RegistrationForm.tsx +++ b/src/extensions/components/registration/RegistrationForm.tsx @@ -31,12 +31,9 @@ import LegalLinks from '../../../components/legalLinks/LegalLinks'; import { FormAccordion } from './FormAccordion/FormAccordion'; import { FormAccordionItem } from './FormAccordion/FormAccordionItem'; import { UrlParamsContext } from '../../../globalState/provider/UrlParamsProvider'; - -enum CounsellingRelation { - Self = 'SELF_COUNSELLING', - Relative = 'RELATIVE_COUNSELLING', - Parental = 'PARENTAL_COUNSELLING' -} +import CounsellingRelation, { + COUNSELLING_RELATIONS +} from './CounsellingRelation'; enum Gender { Male = 'MALE', @@ -55,7 +52,7 @@ interface FormData { 'topicIds[]': number[]; 'mainTopicId': number; 'gender': Gender; - 'counsellingRelation': CounsellingRelation; + 'counsellingRelation': COUNSELLING_RELATIONS; } export const RegistrationForm = () => { @@ -141,29 +138,13 @@ export const RegistrationForm = () => { const getValidRef = (ref: string) => ref.replace(/[^a-zA-Z0-9]/g, '').substring(0, 8); - // Get the counselling relation from the query parameter - const getCounsellingRelation = (): string | null => { - const queryRelation = urlQuery.get('counsellingRelation'); - - if (!queryRelation) return null; - - const fullRelation = `${queryRelation.toUpperCase()}_COUNSELLING`; - const allRelations: string[] = Object.values(CounsellingRelation); - - if (allRelations.includes(fullRelation)) { - return fullRelation; - } - - return null; - }; - const preselectedAgencies = useMemo( () => agency ? [agency] : consultant?.agencies - ? consultant?.agencies - : [], + ? consultant?.agencies + : [], [agency, consultant?.agencies] ); @@ -180,8 +161,10 @@ export const RegistrationForm = () => { gender: formValues.gender, age: Number(formValues.age), topicIds: formValues['topicIds[]'].map(Number), - counsellingRelation: formValues.counsellingRelation, consultingType: formValues.consultingTypeId, + ...(tenant.settings.featureCounsellingRelationsEnabled && { + counsellingRelation: formValues.counsellingRelation + }), ...(consultant && { consultantId: consultant.consultantId }), referer: urlQuery.get('ref') ? getValidRef(urlQuery.get('ref')) @@ -352,37 +335,29 @@ export const RegistrationForm = () => { />
, - - ({ - label: translate( - `registrationDigi.counsellingRelation.options.${value.toLowerCase()}` - ), - value - }))} - preset={getCounsellingRelation()} - /> - , + tenant.settings + .featureCounsellingRelationsEnabled && ( + + + + ), { data ).as('agencies'); }); + + cy.intercept(endpoints.topicsData, [ + { + id: 1, + name: 'Alkohol' + } + ]); }); - describe('addiction', () => { + describe('Counselling relation enabled', () => { beforeEach(() => { - cy.intercept(endpoints.topicsData, [ + cy.willReturn( + 'service.tenant.public', { - id: 1, - name: 'Alkohol' - } - ]); + settings: { + featureCounsellingRelationsEnabled: true + } + }, + true + ); }); it('should have all generic registration page elements', () => { @@ -55,4 +65,35 @@ describe('registration', () => { cy.get('.stageLayout__toLogin').should('exist'); }); }); + describe('Counselling relation disabled', () => { + beforeEach(() => { + cy.willReturn( + 'service.tenant.public', + { + settings: { + featureCounsellingRelationsEnabled: false + } + }, + true + ); + }); + + it('should have all generic registration page elements', () => { + cy.visit('/suchtberatung/registration'); + cy.wait('@consultingTypeServiceBySlugFull'); + cy.get('[data-cy="close-welcome-screen"]').click(); + + cy.get('.registrationFormDigi__Input').should('exist'); + cy.get('input[name="gender"]').should('exist'); + cy.get('input[name="counsellingRelation"]').should('not.exist'); + cy.get( + '.registrationFormDigi__InputTopicIdsContainer input' + ).should('exist'); + cy.get('#username').should('exist'); + cy.get('#passwordInput').should('exist'); + cy.get('#passwordConfirmation').should('exist'); + cy.get('.button__primary').should('exist'); + cy.get('.stageLayout__toLogin').should('exist'); + }); + }); });