From f595f6179587965f9889afa23d1df534142dc185 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Deborah=20K=C3=B6pfer?= Date: Wed, 13 Nov 2024 13:46:33 +0100 Subject: [PATCH 1/8] feat(additionalEnquiry): wip add additional enquiry for asker --- src/api/apiGetAgenciesByTenant.ts | 15 ++ src/api/apiGetTenantAgenciesTopics.ts | 17 ++ src/api/apiPostAdditionalEnquiry.ts | 42 ++++ src/api/apiRegistrationNewConsultingTypes.ts | 1 + .../AdditionalAgencySelection.tsx | 173 ++++++++++++++ .../AdditionalEnquiry/AdditionalEnquiry.tsx | 226 ++++++++++++++++++ src/resources/scripts/endpoints.ts | 4 + 7 files changed, 478 insertions(+) create mode 100644 src/api/apiGetAgenciesByTenant.ts create mode 100644 src/api/apiGetTenantAgenciesTopics.ts create mode 100644 src/api/apiPostAdditionalEnquiry.ts create mode 100644 src/components/profile/AdditionalEnquiry/AdditionalAgencySelection.tsx create mode 100644 src/components/profile/AdditionalEnquiry/AdditionalEnquiry.tsx diff --git a/src/api/apiGetAgenciesByTenant.ts b/src/api/apiGetAgenciesByTenant.ts new file mode 100644 index 000000000..6444b6fec --- /dev/null +++ b/src/api/apiGetAgenciesByTenant.ts @@ -0,0 +1,15 @@ +import { endpoints } from '../resources/scripts/endpoints'; +import { FETCH_ERRORS, FETCH_METHODS, fetchData } from './fetchData'; + +export const apiGetAgenciesByTenant = async ( + postcode: string, + topicId: number +): Promise => { + const url = `${endpoints.agenciesByTenant}?postcode=${postcode}&topicId=${topicId}`; + + return fetchData({ + url, + method: FETCH_METHODS.GET, + responseHandling: [FETCH_ERRORS.EMPTY] + }); +}; diff --git a/src/api/apiGetTenantAgenciesTopics.ts b/src/api/apiGetTenantAgenciesTopics.ts new file mode 100644 index 000000000..4b65b04b0 --- /dev/null +++ b/src/api/apiGetTenantAgenciesTopics.ts @@ -0,0 +1,17 @@ +import { fetchData, FETCH_METHODS, FETCH_ERRORS } from './fetchData'; +import { endpoints } from '../resources/scripts/endpoints'; + +export interface TenantAgenciesTopicsInterface { + id: number; + name: string; +} + +export const apiGetTenantAgenciesTopics = async (): Promise< + TenantAgenciesTopicsInterface[] +> => { + return fetchData({ + url: `${endpoints.agencyTopics}`, + method: FETCH_METHODS.GET, + responseHandling: [FETCH_ERRORS.CATCH_ALL] + }); +}; diff --git a/src/api/apiPostAdditionalEnquiry.ts b/src/api/apiPostAdditionalEnquiry.ts new file mode 100644 index 000000000..37f77c0db --- /dev/null +++ b/src/api/apiPostAdditionalEnquiry.ts @@ -0,0 +1,42 @@ +import { endpoints } from '../resources/scripts/endpoints'; +import { + fetchData, + FETCH_METHODS, + FETCH_ERRORS, + FETCH_SUCCESS +} from './fetchData'; + +interface registrationResponse { + sessionId: number; + rcGroupId: string; +} + +//TODO cleanup deprecated functionality +export const apiPostAdditionalEnquiry = async ( + consultingType: number, + agencyId: number, + postcode: string, + mainTopicId: number + // topicIds?: number[] ??? todo? tomasz +): Promise => { + const url = endpoints.additionalEnquiry; + const data = JSON.stringify({ + postcode, + agencyId, + consultingType, + mainTopicId + // ...(topicIds ? { topicIds: topicIds } : {}) + }); + + return fetchData({ + url: url, + method: FETCH_METHODS.POST, + rcValidation: true, + bodyData: data, + responseHandling: [ + FETCH_SUCCESS.CONTENT, + FETCH_ERRORS.CATCH_ALL, + FETCH_ERRORS.CONFLICT_WITH_RESPONSE + ] + }); +}; diff --git a/src/api/apiRegistrationNewConsultingTypes.ts b/src/api/apiRegistrationNewConsultingTypes.ts index 9308dffc6..eb4b75d84 100644 --- a/src/api/apiRegistrationNewConsultingTypes.ts +++ b/src/api/apiRegistrationNewConsultingTypes.ts @@ -10,6 +10,7 @@ interface registrationResponse { sessionId: number; } +//TODO cleanup deprecated functionality export const apiRegistrationNewConsultingTypes = async ( consultingType: number, agencyId: number, diff --git a/src/components/profile/AdditionalEnquiry/AdditionalAgencySelection.tsx b/src/components/profile/AdditionalEnquiry/AdditionalAgencySelection.tsx new file mode 100644 index 000000000..337e7b553 --- /dev/null +++ b/src/components/profile/AdditionalEnquiry/AdditionalAgencySelection.tsx @@ -0,0 +1,173 @@ +import * as React from 'react'; +import { useEffect, useState } from 'react'; +import { AgencyDataInterface } from '../../../globalState/interfaces'; +import { FETCH_ERRORS } from '../../../api'; +import { InputField, InputFieldItem } from '../../inputField/InputField'; +import '../../agencySelection/agencySelection.styles'; +import '../profile.styles'; +import { Text } from '../../text/Text'; +import { Headline } from '../../headline/Headline'; +import { useTranslation } from 'react-i18next'; +import { AgencyRadioSelect } from '../../agencyRadioSelect/AgencyRadioSelect'; +import { VALID_POSTCODE_LENGTH } from '../../agencySelection/agencySelectionHelpers'; +import { apiGetAgenciesByTenant } from '../../../api/apiGetAgenciesByTenant'; + +export interface AdditionalAgencySelectionProps { + onAgencyChange: Function; + onPostcodeChange: Function; + selectedTopicId: number; +} + +export const AdditionalAgencySelection = ( + props: AdditionalAgencySelectionProps +) => { + const { t: translate } = useTranslation(['common', 'agencies']); + const [proposedAgencies, setProposedAgencies] = useState< + AgencyDataInterface[] | null + >(null); + const [selectedPostcode, setSelectedPostcode] = useState(''); + const [selectedAgency, setSelectedAgency] = + useState(null); + const validPostcode = () => + selectedPostcode?.length === VALID_POSTCODE_LENGTH; + + const isSelectedAgencyValidated = () => + validPostcode() && typeof selectedAgency?.id === 'number'; + + useEffect(() => { + if (isSelectedAgencyValidated()) { + const agency = { + ...selectedAgency, + postcode: selectedPostcode + }; + props.onAgencyChange(agency); + props.onPostcodeChange(selectedPostcode); + } else { + props.onAgencyChange(null); + props.onPostcodeChange(null); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [selectedAgency, selectedPostcode]); + + useEffect(() => { + if (validPostcode()) { + apiGetAgenciesByTenant(selectedPostcode, props.selectedTopicId) + .then((agencies) => { + setProposedAgencies(agencies); + setSelectedAgency(agencies[0]); + }) + .catch((err: any) => { + if (err.message === FETCH_ERRORS.EMPTY) { + setProposedAgencies(null); + setSelectedAgency(null); + } + }); + } else if (proposedAgencies) { + setProposedAgencies(null); + setSelectedAgency(null); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [selectedPostcode, props.selectedTopicId]); + + const postcodeInputItem: InputFieldItem = { + name: 'postcode', + class: 'asker__registration__postcodeInput', + id: 'postcode', + type: 'number', + label: translate('registration.agencySelection.postcode.label'), + content: selectedPostcode, + maxLength: VALID_POSTCODE_LENGTH, + pattern: '^[0-9]+$' + }; + + const handlePostcodeInput = (e) => { + setSelectedPostcode(e.target.value); + }; + + const introItemsTranslations = [ + 'registration.agencySelection.intro.point1', + 'registration.agencySelection.intro.point2', + 'registration.agencySelection.intro.point3' + ]; + + return ( +
+ <> + +
+ +
+ +
    + {introItemsTranslations.map( + (introItemTranslation, i) => ( +
  • + +
    • + ) + )} +
+
+
+ + handlePostcodeInput(e)} + /> + {validPostcode() && ( +
+

+ {translate( + 'registration.agencySelection.title.start' + )}{' '} + {selectedPostcode} + {translate( + 'registration.agencySelection.title.end' + )} +

+ {proposedAgencies ? ( + proposedAgencies.map( + (proposedAgency: AgencyDataInterface) => ( + + setSelectedAgency(proposedAgency) + } + /> + ) + ) + ) : ( + + )} +
+ )} + +
+ ); +}; diff --git a/src/components/profile/AdditionalEnquiry/AdditionalEnquiry.tsx b/src/components/profile/AdditionalEnquiry/AdditionalEnquiry.tsx new file mode 100644 index 000000000..65bc61343 --- /dev/null +++ b/src/components/profile/AdditionalEnquiry/AdditionalEnquiry.tsx @@ -0,0 +1,226 @@ +import * as React from 'react'; +import { useContext, useState, useEffect } from 'react'; +import { useHistory } from 'react-router-dom'; +import { UserDataContext } from '../../../globalState'; +import { Button, ButtonItem, BUTTON_TYPES } from '../../button/Button'; +import { + SelectDropdown, + SelectDropdownItem, + SelectOption +} from '../../select/SelectDropdown'; +import { Overlay, OVERLAY_FUNCTIONS, OverlayItem } from '../../overlay/Overlay'; +import { logout } from '../../logout/logout'; +import { mobileListView } from '../../app/navigationHandler'; +import '../profile.styles'; +import { Headline } from '../../headline/Headline'; +import { useTranslation } from 'react-i18next'; +import { ReactComponent as CheckIcon } from '../../../resources/img/illustrations/check.svg'; +import { ReactComponent as XIcon } from '../../../resources/img/illustrations/x.svg'; +import { + apiGetTenantAgenciesTopics, + TenantAgenciesTopicsInterface +} from '../../../api/apiGetTenantAgenciesTopics'; +import { AdditionalAgencySelection } from './AdditionalAgencySelection'; +import { apiPostAdditionalEnquiry } from '../../../api/apiPostAdditionalEnquiry'; + +export const AdditionalEnquiry: React.FC = () => { + const { t: translate } = useTranslation(['common', 'consultingTypes']); + const history = useHistory(); + + const { reloadUserData } = useContext(UserDataContext); + const [isButtonDisabled, setIsButtonDisabled] = useState(true); + const [selectedTopicId, setSelectedTopicId] = useState(null); + const [selectedAgency, setSelectedAgency] = useState({}); + const [selectedPostcode, setSelectedPostcode] = useState(''); + const [successOverlayActive, setSuccessOverlayActive] = useState(false); + const [successOverlayItem, setSuccessOverlayItem] = + useState(null); + const [sessionId, setSessionId] = useState(null); + const [isRequestInProgress, setIsRequestInProgress] = useState(false); + const [tenantAgenciesTopics, setTenantAgenciesTopics] = useState< + TenantAgenciesTopicsInterface[] + >([]); + const [currentSelectOption, setCurrentSelectOption] = + useState(null); + + const buttonSetRegistration: ButtonItem = { + label: translate('profile.data.register.button.label'), + type: BUTTON_TYPES.LINK + }; + + const overlayItemNewRegistrationSuccess: OverlayItem = { + svg: CheckIcon, + headline: translate('profile.data.registerSuccess.overlay.headline'), + buttonSet: [ + { + label: translate( + 'profile.data.registerSuccess.overlay.button1.label' + ), + function: OVERLAY_FUNCTIONS.REDIRECT, + type: BUTTON_TYPES.PRIMARY + }, + { + label: translate( + 'profile.data.registerSuccess.overlay.button2.label' + ), + function: OVERLAY_FUNCTIONS.LOGOUT, + type: BUTTON_TYPES.LINK + } + ] + }; + + const overlayItemNewRegistrationError: OverlayItem = { + svg: XIcon, + illustrationBackground: 'error', + headline: translate('profile.data.registerError.overlay.headline'), + buttonSet: [ + { + label: translate( + 'profile.data.registerError.overlay.button.label' + ), + function: OVERLAY_FUNCTIONS.CLOSE, + type: BUTTON_TYPES.PRIMARY + } + ] + }; + + useEffect(() => { + apiGetTenantAgenciesTopics() + .then((response) => { + setTenantAgenciesTopics(response); + }) + .catch((error) => { + console.log(error); + }); + }, []); // eslint-disable-line react-hooks/exhaustive-deps + + const isAllRequiredDataSet = () => + selectedTopicId != null && selectedAgency && selectedPostcode; + + useEffect(() => { + if (isAllRequiredDataSet()) { + setIsButtonDisabled(false); + } else { + setIsButtonDisabled(true); + } + }, [selectedAgency]); // eslint-disable-line react-hooks/exhaustive-deps + + const handleConsultingTypeSelect = (selectedOption) => { + setSelectedTopicId(parseInt(selectedOption.value)); + setCurrentSelectOption( + prepareSelectableTopics().filter( + (option) => option.value === selectedOption.value + ) + ); + }; + + const prepareSelectableTopics = (): Array => { + return tenantAgenciesTopics.map((option) => ({ + value: option.id.toString(), + label: option.name + })); + }; + + const topicsDropdown: SelectDropdownItem = { + id: 'topicSelect', + selectedOptions: prepareSelectableTopics(), + handleDropdownSelect: handleConsultingTypeSelect, + selectInputLabel: translate( + 'profile.data.register.consultingTypeSelect.label' + ), + useIconOption: false, + isSearchable: false, + menuPlacement: 'bottom', + defaultValue: currentSelectOption + }; + + const handleRegistration = () => { + if (isRequestInProgress) { + return null; + } + + if (isAllRequiredDataSet()) { + setIsRequestInProgress(true); + + apiPostAdditionalEnquiry( + selectedAgency.consultingType, + selectedAgency.id, + selectedPostcode, + selectedTopicId + ) + .then((response) => { + let overlayItem = overlayItemNewRegistrationSuccess; + setSessionId(response.sessionId); + setSuccessOverlayItem(overlayItem); + setSuccessOverlayActive(true); + setIsRequestInProgress(false); + }) + //TODO CATCH CONFLICT -> same topic & agency + .catch((error) => { + setSuccessOverlayItem(overlayItemNewRegistrationError); + setSuccessOverlayActive(true); + setIsRequestInProgress(false); + }); + } + }; + + const handleSuccessOverlayAction = (buttonFunction: string) => { + reloadUserData().catch(console.log); + + if (buttonFunction === OVERLAY_FUNCTIONS.REDIRECT) { + mobileListView(); + if (!sessionId) { + history.push({ + pathname: `/sessions/user/view` + }); + return; + } + + history.push({ + pathname: `/sessions/user/view/write/${sessionId}` + }); + } else if (buttonFunction === OVERLAY_FUNCTIONS.CLOSE) { + setSuccessOverlayItem({}); + setSuccessOverlayActive(false); + setSelectedTopicId(null); + } else { + logout(); + } + }; + + return ( +
+
+ +
+ { +
+ +
+ } + {selectedTopicId && ( + setSelectedAgency(agency)} + onPostcodeChange={(postcode) => + setSelectedPostcode(postcode) + } + /> + )} +
+ ); +}; diff --git a/src/resources/scripts/endpoints.ts b/src/resources/scripts/endpoints.ts index be502b13e..67c007b91 100644 --- a/src/resources/scripts/endpoints.ts +++ b/src/resources/scripts/endpoints.ts @@ -13,6 +13,9 @@ if (apiUrlEnv) { export const endpoints = { agencyConsultants: apiUrl + '/service/users/consultants', agencyServiceBase: apiUrl + '/service/agencies', + agencyTopics: apiUrl + '/service/agencies/topics', + agenciesByTenant: apiUrl + '/service/agencies/by-tenant', + additionalEnquiry: apiUrl + '/service/users/askers/session/new', appointmentBase: apiUrl + '/service/appointments/sessions', appointmentBaseNew: (sessionId: number) => apiUrl + `/service/appointments/sessions/${sessionId}/enquiry/new`, @@ -100,6 +103,7 @@ export const endpoints = { }, registerAsker: apiUrl + '/service/users/askers/new', baseUserService: apiUrl + '/service/users', + //todo delete? registerAskerNewConsultingType: apiUrl + '/service/users/askers/consultingType/new', rejectVideoCall: apiUrl + '/service/videocalls/reject', From 0442eb89940cb5ff6624def152f842f3ece08ecf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Deborah=20K=C3=B6pfer?= Date: Wed, 13 Nov 2024 13:56:20 +0100 Subject: [PATCH 2/8] feat(additionalEnquiry): wip, new profile routes --- src/components/profile/profile.routes.ts | 17 ++++++++++++++++ src/components/profile/profileHelpers.ts | 25 ++++++++++++++++++++++++ 2 files changed, 42 insertions(+) diff --git a/src/components/profile/profile.routes.ts b/src/components/profile/profile.routes.ts index 949e16c5f..da2074a9d 100644 --- a/src/components/profile/profile.routes.ts +++ b/src/components/profile/profile.routes.ts @@ -21,6 +21,8 @@ import { import { EmailNotification } from './EmailNotifications'; import { BrowserNotification } from './BrowserNotifications'; import { browserNotificationsSettings } from '../../utils/notificationHelpers'; +import { AdditionalEnquiry } from './AdditionalEnquiry/AdditionalEnquiry'; +import { consultingTypeSelectOptionsSet } from './profileHelpers'; const shouldShowOverview = (useOverviewPage: boolean, userData) => useOverviewPage && @@ -114,6 +116,21 @@ const profileRoutes = ( boxed: false, order: 2, column: COLUMN_RIGHT + }, + { + condition: (userData, consultingTypes) => + !hasUserAuthority( + AUTHORITIES.CONSULTANT_DEFAULT, + userData + ) && + consultingTypeSelectOptionsSet( + userData, + consultingTypes + ).length > + 0 /* TODO check condition inside component */, + component: AdditionalEnquiry, + order: 3, + column: COLUMN_RIGHT } ] }, diff --git a/src/components/profile/profileHelpers.ts b/src/components/profile/profileHelpers.ts index 9dbb84224..8fe0aa45e 100644 --- a/src/components/profile/profileHelpers.ts +++ b/src/components/profile/profileHelpers.ts @@ -1,3 +1,4 @@ +import { apiGetTenantAgenciesTopics } from '../../api/apiGetTenantAgenciesTopics'; import { getConsultingType } from '../../globalState'; import { UserDataInterface, @@ -49,10 +50,34 @@ export const getConsultingTypesForRegistrationStatus = ( }); }; +//TODO can be removed or move again here? export const consultingTypeSelectOptionsSet = ( userData: UserDataInterface, consultingTypes: Array ) => { + // let topics; + // apiGetTenantAgenciesTopics() + // .then((response) => { + // // const consultants = prepareConsultantDataForSelect(response); + // topics = response; + // console.log('response', response); + // }) + // .catch((error) => { + // console.log(error); + // }); + + // let topics; + // apiGeTenantAgenciesTopics() + // .then((response) => { + // // const consultants = prepareConsultantDataForSelect(response); + // topics = response; + // }) + // .catch((error) => { + // console.log(error); + // }); + + // // const topics = apiGeTenantAgenciesTopics().then((resp: any) => resp); + // console.log('HEY topics: ', topics); const unregisteredConsultingTypesData = getConsultingTypesForRegistrationStatus( userData, From f46430199d62c648ab48c5690c4be8e88c3a61f9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Deborah=20K=C3=B6pfer?= Date: Wed, 13 Nov 2024 14:07:40 +0100 Subject: [PATCH 3/8] refactor(additionalEnquiry): remove deprecated import --- src/components/profile/profileHelpers.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/profile/profileHelpers.ts b/src/components/profile/profileHelpers.ts index 8fe0aa45e..247dd998c 100644 --- a/src/components/profile/profileHelpers.ts +++ b/src/components/profile/profileHelpers.ts @@ -1,4 +1,3 @@ -import { apiGetTenantAgenciesTopics } from '../../api/apiGetTenantAgenciesTopics'; import { getConsultingType } from '../../globalState'; import { UserDataInterface, From 42ff87af0214e7d8029996b45f615e88825d87d4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Deborah=20K=C3=B6pfer?= Date: Wed, 13 Nov 2024 16:47:44 +0100 Subject: [PATCH 4/8] refactor(additionalEnquiry): cleanup, rm deprecated functionality --- index.ts | 1 - src/api/apiPostAdditionalEnquiry.ts | 3 - src/api/apiRegistrationNewConsultingTypes.ts | 41 --- src/api/index.ts | 4 +- .../AdditionalAgencySelection.tsx | 3 +- .../AdditionalEnquiry/AdditionalEnquiry.tsx | 14 +- .../_additionalEnquiry.styles.scss} | 2 +- src/components/profile/AskerRegistration.tsx | 292 ------------------ ...AskerRegistrationExternalAgencyOverlay.tsx | 55 ---- src/components/profile/profile.routes.ts | 10 +- src/components/profile/profile.styles.scss | 3 +- src/components/profile/profileHelpers.ts | 79 ----- 12 files changed, 17 insertions(+), 490 deletions(-) delete mode 100644 src/api/apiRegistrationNewConsultingTypes.ts rename src/components/profile/{_askerRegistration.styles.scss => AdditionalEnquiry/_additionalEnquiry.styles.scss} (96%) delete mode 100644 src/components/profile/AskerRegistration.tsx delete mode 100644 src/components/profile/AskerRegistrationExternalAgencyOverlay.tsx diff --git a/index.ts b/index.ts index 212e2c63c..4429e97c2 100644 --- a/index.ts +++ b/index.ts @@ -21,7 +21,6 @@ export * from './src/components/overlay/Overlay'; export * from './src/components/serviceExplanation/ServiceExplanation'; export * from './src/components/inputField/InputField'; export * from './src/components/agencySelection/agencySelectionHelpers'; -export * from './src/components/profile/AskerRegistrationExternalAgencyOverlay'; // Data export * from './src/globalState/provider/TenantProvider'; diff --git a/src/api/apiPostAdditionalEnquiry.ts b/src/api/apiPostAdditionalEnquiry.ts index 37f77c0db..2d93d6188 100644 --- a/src/api/apiPostAdditionalEnquiry.ts +++ b/src/api/apiPostAdditionalEnquiry.ts @@ -11,13 +11,11 @@ interface registrationResponse { rcGroupId: string; } -//TODO cleanup deprecated functionality export const apiPostAdditionalEnquiry = async ( consultingType: number, agencyId: number, postcode: string, mainTopicId: number - // topicIds?: number[] ??? todo? tomasz ): Promise => { const url = endpoints.additionalEnquiry; const data = JSON.stringify({ @@ -25,7 +23,6 @@ export const apiPostAdditionalEnquiry = async ( agencyId, consultingType, mainTopicId - // ...(topicIds ? { topicIds: topicIds } : {}) }); return fetchData({ diff --git a/src/api/apiRegistrationNewConsultingTypes.ts b/src/api/apiRegistrationNewConsultingTypes.ts deleted file mode 100644 index eb4b75d84..000000000 --- a/src/api/apiRegistrationNewConsultingTypes.ts +++ /dev/null @@ -1,41 +0,0 @@ -import { endpoints } from '../resources/scripts/endpoints'; -import { - fetchData, - FETCH_METHODS, - FETCH_ERRORS, - FETCH_SUCCESS -} from './fetchData'; - -interface registrationResponse { - sessionId: number; -} - -//TODO cleanup deprecated functionality -export const apiRegistrationNewConsultingTypes = async ( - consultingType: number, - agencyId: number, - postcode: string, - consultantId?: string, - topicIds?: number[] -): Promise => { - const url = endpoints.registerAskerNewConsultingType; - const data = JSON.stringify({ - postcode, - agencyId, - consultingType, - consultantId, - ...(topicIds ? { topicIds: topicIds } : {}) - }); - - return fetchData({ - url: url, - method: FETCH_METHODS.POST, - rcValidation: true, - bodyData: data, - responseHandling: [ - FETCH_SUCCESS.CONTENT, - FETCH_ERRORS.CATCH_ALL, - FETCH_ERRORS.CONFLICT_WITH_RESPONSE - ] - }); -}; diff --git a/src/api/index.ts b/src/api/index.ts index 6f44622a9..f21e392ba 100644 --- a/src/api/index.ts +++ b/src/api/index.ts @@ -2,6 +2,7 @@ export * from './apiAgencySelection'; export * from './apiDeleteAskerAccount'; export * from './apiDraftMessages'; export * from './apiEnquiryAcceptance'; +export * from './apiGetAgenciesByTenant'; export * from './apiGetAgencyConsultantList'; export * from './apiGetAgencyId'; export * from './apiGetAskerSessionList'; @@ -14,10 +15,12 @@ export * from './apiGetApiAppointmentServiceEventTypes'; export * from './apiGetAppointmentsServiceBookingEventsByUserId'; export * from './apiGetGroupChatInfo'; export * from './apiGetSessionData'; +export * from './apiGetTenantAgenciesTopics'; export * from './apiGetUserData'; export * from './apiGroupChatSettings'; export * from './apiLogoutKeycloak'; export * from './apiLogoutRocketchat'; +export * from './apiPostAdditionalEnquiry'; export * from './apiPostRegistration'; export * from './apiPutArchive'; export * from './apiPutDearchive'; @@ -26,7 +29,6 @@ export * from './apiPutGroupChat'; export * from './apiPatchConsultantData'; export * from './apiPutConsultantData'; export * from './apiPutEmail'; -export * from './apiRegistrationNewConsultingTypes'; export * from './apiRejectVideoCall'; export * from './apiSendEnquiry'; export * from './apiSendMessage'; diff --git a/src/components/profile/AdditionalEnquiry/AdditionalAgencySelection.tsx b/src/components/profile/AdditionalEnquiry/AdditionalAgencySelection.tsx index 337e7b553..02b080b9f 100644 --- a/src/components/profile/AdditionalEnquiry/AdditionalAgencySelection.tsx +++ b/src/components/profile/AdditionalEnquiry/AdditionalAgencySelection.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { useEffect, useState } from 'react'; import { AgencyDataInterface } from '../../../globalState/interfaces'; -import { FETCH_ERRORS } from '../../../api'; +import { apiGetAgenciesByTenant, FETCH_ERRORS } from '../../../api'; import { InputField, InputFieldItem } from '../../inputField/InputField'; import '../../agencySelection/agencySelection.styles'; import '../profile.styles'; @@ -10,7 +10,6 @@ import { Headline } from '../../headline/Headline'; import { useTranslation } from 'react-i18next'; import { AgencyRadioSelect } from '../../agencyRadioSelect/AgencyRadioSelect'; import { VALID_POSTCODE_LENGTH } from '../../agencySelection/agencySelectionHelpers'; -import { apiGetAgenciesByTenant } from '../../../api/apiGetAgenciesByTenant'; export interface AdditionalAgencySelectionProps { onAgencyChange: Function; diff --git a/src/components/profile/AdditionalEnquiry/AdditionalEnquiry.tsx b/src/components/profile/AdditionalEnquiry/AdditionalEnquiry.tsx index 65bc61343..f31ac3da2 100644 --- a/src/components/profile/AdditionalEnquiry/AdditionalEnquiry.tsx +++ b/src/components/profile/AdditionalEnquiry/AdditionalEnquiry.tsx @@ -16,12 +16,12 @@ import { Headline } from '../../headline/Headline'; import { useTranslation } from 'react-i18next'; import { ReactComponent as CheckIcon } from '../../../resources/img/illustrations/check.svg'; import { ReactComponent as XIcon } from '../../../resources/img/illustrations/x.svg'; +import { AdditionalAgencySelection } from './AdditionalAgencySelection'; import { apiGetTenantAgenciesTopics, + apiPostAdditionalEnquiry, TenantAgenciesTopicsInterface -} from '../../../api/apiGetTenantAgenciesTopics'; -import { AdditionalAgencySelection } from './AdditionalAgencySelection'; -import { apiPostAdditionalEnquiry } from '../../../api/apiPostAdditionalEnquiry'; +} from '../../../api'; export const AdditionalEnquiry: React.FC = () => { const { t: translate } = useTranslation(['common', 'consultingTypes']); @@ -155,8 +155,10 @@ export const AdditionalEnquiry: React.FC = () => { setSuccessOverlayActive(true); setIsRequestInProgress(false); }) - //TODO CATCH CONFLICT -> same topic & agency .catch((error) => { + //TODO error handling? -> same topic & agency + //CONFLICT_WITH_RESPONSE + console.log('error ', error); setSuccessOverlayItem(overlayItemNewRegistrationError); setSuccessOverlayActive(true); setIsRequestInProgress(false); @@ -189,7 +191,7 @@ export const AdditionalEnquiry: React.FC = () => { }; return ( -
+
{ />
{ -
+
} diff --git a/src/components/profile/_askerRegistration.styles.scss b/src/components/profile/AdditionalEnquiry/_additionalEnquiry.styles.scss similarity index 96% rename from src/components/profile/_askerRegistration.styles.scss rename to src/components/profile/AdditionalEnquiry/_additionalEnquiry.styles.scss index cef40aefe..295b84321 100644 --- a/src/components/profile/_askerRegistration.styles.scss +++ b/src/components/profile/AdditionalEnquiry/_additionalEnquiry.styles.scss @@ -1,4 +1,4 @@ -.askerRegistration { +.additionalEnquiry { &__consultingModeInfo { margin: 0 0 $grid-base-four; } diff --git a/src/components/profile/AskerRegistration.tsx b/src/components/profile/AskerRegistration.tsx deleted file mode 100644 index 5bf35e942..000000000 --- a/src/components/profile/AskerRegistration.tsx +++ /dev/null @@ -1,292 +0,0 @@ -import * as React from 'react'; -import { useContext, useState, useEffect } from 'react'; -import { useHistory } from 'react-router-dom'; -import { - UserDataContext, - useConsultingTypes, - useConsultingType -} from '../../globalState'; -import { Button, ButtonItem, BUTTON_TYPES } from '../button/Button'; -import { SelectDropdown, SelectDropdownItem } from '../select/SelectDropdown'; -import { - consultingTypeSelectOptionsSet, - getConsultingTypesForRegistrationStatus, - REGISTRATION_STATUS_KEYS -} from './profileHelpers'; -import { apiRegistrationNewConsultingTypes } from '../../api'; -import { Overlay, OVERLAY_FUNCTIONS, OverlayItem } from '../overlay/Overlay'; -import { logout } from '../logout/logout'; -import { mobileListView } from '../app/navigationHandler'; -import { AgencySelection } from '../agencySelection/AgencySelection'; -import './profile.styles'; -import { Text, LABEL_TYPES } from '../text/Text'; -import { Headline } from '../headline/Headline'; -import { AskerRegistrationExternalAgencyOverlay } from './AskerRegistrationExternalAgencyOverlay'; -import { useTranslation } from 'react-i18next'; -import { ReactComponent as CheckIcon } from '../../resources/img/illustrations/check.svg'; -import { ReactComponent as XIcon } from '../../resources/img/illustrations/x.svg'; - -export const AskerRegistration: React.FC = () => { - const { t: translate } = useTranslation(['common', 'consultingTypes']); - const history = useHistory(); - - const { userData, reloadUserData } = useContext(UserDataContext); - const [isButtonDisabled, setIsButtonDisabled] = useState(true); - const [selectedConsultingTypeId, setSelectedConsultingTypeId] = - useState(null); - const [selectedAgency, setSelectedAgency] = useState({}); - const [successOverlayActive, setSuccessOverlayActive] = useState(false); - const [successOverlayItem, setSuccessOverlayItem] = - useState(null); - const [externalAgencyOverlayActive, setExternalAgencyOverlayActive] = - useState(false); - const [sessionId, setSessionId] = useState(null); - const [isRequestInProgress, setIsRequestInProgress] = useState(false); - const consultingTypes = useConsultingTypes(); - const selectedConsultingType = useConsultingType(selectedConsultingTypeId); - - const buttonSetRegistration: ButtonItem = { - label: translate('profile.data.register.button.label'), - type: BUTTON_TYPES.LINK - }; - - const overlayItemNewRegistrationSuccess: OverlayItem = { - svg: CheckIcon, - headline: translate('profile.data.registerSuccess.overlay.headline'), - buttonSet: [ - { - label: translate( - 'profile.data.registerSuccess.overlay.button1.label' - ), - function: OVERLAY_FUNCTIONS.REDIRECT, - type: BUTTON_TYPES.PRIMARY - }, - { - label: translate( - 'profile.data.registerSuccess.overlay.button2.label' - ), - function: OVERLAY_FUNCTIONS.LOGOUT, - type: BUTTON_TYPES.LINK - } - ] - }; - - const overlayItemNewRegistrationError: OverlayItem = { - svg: XIcon, - illustrationBackground: 'error', - headline: translate('profile.data.registerError.overlay.headline'), - buttonSet: [ - { - label: translate( - 'profile.data.registerError.overlay.button.label' - ), - function: OVERLAY_FUNCTIONS.CLOSE, - type: BUTTON_TYPES.PRIMARY - } - ] - }; - - const isAllRequiredDataSet = () => - selectedConsultingTypeId != null && selectedAgency; - - useEffect(() => { - if (isAllRequiredDataSet()) { - setIsButtonDisabled(false); - } else { - setIsButtonDisabled(true); - } - }, [selectedAgency]); // eslint-disable-line react-hooks/exhaustive-deps - - const handleConsultingTypeSelect = (selectedOption) => { - setSelectedConsultingTypeId(parseInt(selectedOption.value)); - }; - - const getOptionOfSelectedConsultingType = () => { - return translateConsultingType(userData, consultingTypes).filter( - (option) => parseInt(option.value) === selectedConsultingTypeId - )[0]; - }; - - const translateConsultingType = (userData, consultingTypes) => { - return consultingTypeSelectOptionsSet(userData, consultingTypes).map( - (option) => ({ - ...option, - label: translate( - [ - `consultingType.${option.id}.titles.registrationDropdown`, - `consultingType.fallback.titles.registrationDropdown`, - option.label - ], - { ns: 'consultingTypes' } - ) - }) - ); - }; - - const consultingTypesDropdown: SelectDropdownItem = { - id: 'consultingTypeSelect', - selectedOptions: translateConsultingType(userData, consultingTypes), - handleDropdownSelect: handleConsultingTypeSelect, - selectInputLabel: translate( - 'profile.data.register.consultingTypeSelect.label' - ), - useIconOption: false, - isSearchable: false, - menuPlacement: 'bottom', - defaultValue: getOptionOfSelectedConsultingType() - }; - - const handleRegistration = () => { - if (isRequestInProgress) { - return null; - } - - if (isAllRequiredDataSet()) { - if (selectedAgency.external) { - if (selectedAgency.url) { - setExternalAgencyOverlayActive(true); - } else { - console.error( - `External agency with id ${selectedAgency.id} doesn't have a url set.` - ); - } - return; - } - - setIsRequestInProgress(true); - - apiRegistrationNewConsultingTypes( - selectedConsultingTypeId, - selectedAgency.id, - selectedAgency.postcode - ) - .then((response) => { - let overlayItem = overlayItemNewRegistrationSuccess; - if (selectedConsultingType?.groupChat.isGroupChat) { - overlayItem.buttonSet[0].label = translate( - 'profile.data.registerSuccess.overlay.groupChats.button.label.' - ); - } else { - setSessionId(response.sessionId); - } - setSuccessOverlayItem(overlayItem); - setSuccessOverlayActive(true); - setIsRequestInProgress(false); - }) - .catch((error) => { - setSuccessOverlayItem(overlayItemNewRegistrationError); - setSuccessOverlayActive(true); - setIsRequestInProgress(false); - }); - } - }; - - const handleSuccessOverlayAction = (buttonFunction: string) => { - reloadUserData().catch(console.log); - - if (buttonFunction === OVERLAY_FUNCTIONS.REDIRECT) { - mobileListView(); - if (!sessionId) { - history.push({ - pathname: `/sessions/user/view` - }); - return; - } - - history.push({ - pathname: `/sessions/user/view/write/${sessionId}` - }); - } else if (buttonFunction === OVERLAY_FUNCTIONS.CLOSE) { - setSuccessOverlayItem({}); - setSuccessOverlayActive(false); - setSelectedConsultingTypeId(null); - } else { - logout(); - } - }; - - const handleExternalAgencyOverlayAction = () => { - setExternalAgencyOverlayActive(false); - }; - - const registeredConsultingTypes = userData - ? getConsultingTypesForRegistrationStatus( - userData, - consultingTypes, - REGISTRATION_STATUS_KEYS.REGISTERED - ) - : null; - const isOnlyRegisteredForGroupChats = - registeredConsultingTypes?.length === 1 && - consultingTypes.find( - (cur) => - cur.id === parseInt(registeredConsultingTypes[0].consultingType) - )?.groupChat.isGroupChat && - selectedConsultingType && - !selectedConsultingType.groupChat.isGroupChat; - - return ( -
-
- -
- {isOnlyRegisteredForGroupChats ? ( -
- - -
- ) : ( -
- - -
- )} - {selectedConsultingType && ( - setSelectedAgency(agency)} - isProfileView={true} - agencySelectionNote={ - selectedConsultingType?.registration?.notes - ?.agencySelection - } - /> - )} -
- ); -}; diff --git a/src/components/profile/AskerRegistrationExternalAgencyOverlay.tsx b/src/components/profile/AskerRegistrationExternalAgencyOverlay.tsx deleted file mode 100644 index 8ad881763..000000000 --- a/src/components/profile/AskerRegistrationExternalAgencyOverlay.tsx +++ /dev/null @@ -1,55 +0,0 @@ -import * as React from 'react'; -import { Overlay, OVERLAY_FUNCTIONS } from '../overlay/Overlay'; -import { ReactComponent as ArrowIcon } from '../../resources/img/illustrations/arrow.svg'; -import { BUTTON_TYPES } from '../button/Button'; -import { ConsultingTypeBasicInterface } from '../../globalState/interfaces'; -import { useTranslation } from 'react-i18next'; -import { useTopic } from '../../globalState'; - -interface AskerRegistrationExternalAgencyOverlayProps { - consultingType: ConsultingTypeBasicInterface; - handleOverlayAction: (action: string) => void; - selectedAgency: any; -} - -export const AskerRegistrationExternalAgencyOverlay = ({ - consultingType, - handleOverlayAction, - selectedAgency -}: AskerRegistrationExternalAgencyOverlayProps) => { - const { t: translate } = useTranslation(['common']); - const topic = useTopic(consultingType.id); - const handleOverlay = (action) => { - if (action === OVERLAY_FUNCTIONS.REDIRECT) { - window.open(selectedAgency.url, '_blank')?.focus(); - } else { - handleOverlayAction(action); - } - }; - - return ( - - ); -}; diff --git a/src/components/profile/profile.routes.ts b/src/components/profile/profile.routes.ts index da2074a9d..ed4878fcc 100644 --- a/src/components/profile/profile.routes.ts +++ b/src/components/profile/profile.routes.ts @@ -22,7 +22,6 @@ import { EmailNotification } from './EmailNotifications'; import { BrowserNotification } from './BrowserNotifications'; import { browserNotificationsSettings } from '../../utils/notificationHelpers'; import { AdditionalEnquiry } from './AdditionalEnquiry/AdditionalEnquiry'; -import { consultingTypeSelectOptionsSet } from './profileHelpers'; const shouldShowOverview = (useOverviewPage: boolean, userData) => useOverviewPage && @@ -118,16 +117,11 @@ const profileRoutes = ( column: COLUMN_RIGHT }, { - condition: (userData, consultingTypes) => + condition: (userData) => !hasUserAuthority( AUTHORITIES.CONSULTANT_DEFAULT, userData - ) && - consultingTypeSelectOptionsSet( - userData, - consultingTypes - ).length > - 0 /* TODO check condition inside component */, + ), component: AdditionalEnquiry, order: 3, column: COLUMN_RIGHT diff --git a/src/components/profile/profile.styles.scss b/src/components/profile/profile.styles.scss index 0e4f7a8bd..58dab02f7 100644 --- a/src/components/profile/profile.styles.scss +++ b/src/components/profile/profile.styles.scss @@ -1,4 +1,4 @@ -@import './askerRegistration.styles'; +@import './AdditionalEnquiry/additionalEnquiry.styles'; @import './statistics.styles'; @import './spokenlanguages.styles'; @import './locale.styles'; @@ -115,6 +115,7 @@ $profile-footer-justify-content: center !default; &__actions { margin-left: auto; + & > * { margin-right: 10px; diff --git a/src/components/profile/profileHelpers.ts b/src/components/profile/profileHelpers.ts index 247dd998c..969f8d8f1 100644 --- a/src/components/profile/profileHelpers.ts +++ b/src/components/profile/profileHelpers.ts @@ -1,9 +1,3 @@ -import { getConsultingType } from '../../globalState'; -import { - UserDataInterface, - ConsultingTypeBasicInterface -} from '../../globalState/interfaces'; - export const convertUserDataObjectToArray = (object) => { const array = []; Object.keys(object).forEach((key) => { @@ -23,79 +17,6 @@ export const getUserDataTranslateBase = (consultingType: number) => { return consultingType === 0 ? 'user.userAddiction' : 'user.userU25'; }; -export enum REGISTRATION_STATUS_KEYS { - REGISTERED = 'REGISTERED', - UNREGISTERED = 'UNREGISTERED' -} -export const getConsultingTypesForRegistrationStatus = ( - userData: UserDataInterface, - consultingTypes: Array, - registrationStatus: REGISTRATION_STATUS_KEYS -) => { - return Object.keys(userData.consultingTypes) - .map((key) => { - return { - consultingType: key, - data: userData.consultingTypes[key] - }; - }) - .filter((value) => { - return registrationStatus === REGISTRATION_STATUS_KEYS.REGISTERED - ? value.data.isRegistered - : consultingTypes.find( - (cur) => cur.id === parseInt(value.consultingType) - )?.isSubsequentRegistrationAllowed && - !value.data.isRegistered; - }); -}; - -//TODO can be removed or move again here? -export const consultingTypeSelectOptionsSet = ( - userData: UserDataInterface, - consultingTypes: Array -) => { - // let topics; - // apiGetTenantAgenciesTopics() - // .then((response) => { - // // const consultants = prepareConsultantDataForSelect(response); - // topics = response; - // console.log('response', response); - // }) - // .catch((error) => { - // console.log(error); - // }); - - // let topics; - // apiGeTenantAgenciesTopics() - // .then((response) => { - // // const consultants = prepareConsultantDataForSelect(response); - // topics = response; - // }) - // .catch((error) => { - // console.log(error); - // }); - - // // const topics = apiGeTenantAgenciesTopics().then((resp: any) => resp); - // console.log('HEY topics: ', topics); - const unregisteredConsultingTypesData = - getConsultingTypesForRegistrationStatus( - userData, - consultingTypes, - REGISTRATION_STATUS_KEYS.UNREGISTERED - ); - return unregisteredConsultingTypesData.map((value) => { - const id = parseInt(value.consultingType); - const consultingType = getConsultingType(consultingTypes, id); - - return { - id: id, - value: value.consultingType, - // ToDo: translate missing! - label: consultingType?.titles?.registrationDropdown || '' - }; - }); -}; - export const isUniqueLanguage = (value, index, self) => { return self.indexOf(value) === index; }; From 0698a4fdbbdfd93b0f233d48dfd4e595e4e42435 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Deborah=20K=C3=B6pfer?= Date: Thu, 21 Nov 2024 15:26:03 +0100 Subject: [PATCH 5/8] feat(additionalEnquiry): add x-reason handling --- src/api/fetchData.ts | 4 ++- .../AdditionalEnquiry/AdditionalEnquiry.tsx | 26 ++++++++++++++----- src/resources/i18n/de/common.json | 3 ++- src/resources/i18n/de@informal/common.json | 3 ++- src/resources/i18n/en/common.json | 3 ++- 5 files changed, 29 insertions(+), 10 deletions(-) diff --git a/src/api/fetchData.ts b/src/api/fetchData.ts index c3720a3d4..8b136feea 100644 --- a/src/api/fetchData.ts +++ b/src/api/fetchData.ts @@ -40,7 +40,9 @@ export const FETCH_ERRORS = { export const X_REASON = { EMAIL_NOT_AVAILABLE: 'EMAIL_NOT_AVAILABLE', - USERNAME_NOT_AVAILABLE: 'USERNAME_NOT_AVAILABLE' + USERNAME_NOT_AVAILABLE: 'USERNAME_NOT_AVAILABLE', + USER_ALREADY_REGISTERED_WITH_AGENCY_AND_TOPIC: + 'USER_ALREADY_REGISTERED_WITH_AGENCY_AND_TOPIC' }; export const FETCH_SUCCESS = { diff --git a/src/components/profile/AdditionalEnquiry/AdditionalEnquiry.tsx b/src/components/profile/AdditionalEnquiry/AdditionalEnquiry.tsx index f31ac3da2..74a1e0178 100644 --- a/src/components/profile/AdditionalEnquiry/AdditionalEnquiry.tsx +++ b/src/components/profile/AdditionalEnquiry/AdditionalEnquiry.tsx @@ -20,7 +20,9 @@ import { AdditionalAgencySelection } from './AdditionalAgencySelection'; import { apiGetTenantAgenciesTopics, apiPostAdditionalEnquiry, - TenantAgenciesTopicsInterface + FETCH_ERRORS, + TenantAgenciesTopicsInterface, + X_REASON } from '../../../api'; export const AdditionalEnquiry: React.FC = () => { @@ -155,11 +157,23 @@ export const AdditionalEnquiry: React.FC = () => { setSuccessOverlayActive(true); setIsRequestInProgress(false); }) - .catch((error) => { - //TODO error handling? -> same topic & agency - //CONFLICT_WITH_RESPONSE - console.log('error ', error); - setSuccessOverlayItem(overlayItemNewRegistrationError); + .catch((error: Response) => { + const reason = error.headers?.get(FETCH_ERRORS.X_REASON); + if ( + reason === + X_REASON.USER_ALREADY_REGISTERED_WITH_AGENCY_AND_TOPIC + ) { + let xReasonErrorOverlay = + overlayItemNewRegistrationError; + xReasonErrorOverlay.headline = translate( + 'profile.data.registerError.overlay.xReasonAlreadyRegistered' + ); + setSuccessOverlayItem(xReasonErrorOverlay); + } else { + setSuccessOverlayItem(overlayItemNewRegistrationError); + } + + setIsButtonDisabled(true); setSuccessOverlayActive(true); setIsRequestInProgress(false); }); diff --git a/src/resources/i18n/de/common.json b/src/resources/i18n/de/common.json index ba6fc5c36..e360c1145 100644 --- a/src/resources/i18n/de/common.json +++ b/src/resources/i18n/de/common.json @@ -1350,7 +1350,8 @@ "button": { "label": "Schließen" }, - "headline": "Es ist ein Fehler aufgetreten. Bitte versuchen Sie es erneut." + "headline": "Es ist ein Fehler aufgetreten. Bitte versuchen Sie es erneut.", + "xReasonAlreadyRegistered": "Sie sind bereits mit diesem Thema in der Beratungsstelle registriert." } }, "registerSuccess": { diff --git a/src/resources/i18n/de@informal/common.json b/src/resources/i18n/de@informal/common.json index e0a3dd0de..414955fe3 100644 --- a/src/resources/i18n/de@informal/common.json +++ b/src/resources/i18n/de@informal/common.json @@ -429,7 +429,8 @@ }, "registerError": { "overlay": { - "headline": "Es ist ein Fehler aufgetreten. Bitte versuche es erneut." + "headline": "Es ist ein Fehler aufgetreten. Bitte versuche es erneut.", + "xReasonAlreadyRegistered": "Du bist bereits mit diesem Thema in der Beratungsstelle registriert." } }, "registerSuccess": { diff --git a/src/resources/i18n/en/common.json b/src/resources/i18n/en/common.json index 44abe44ed..6b2505ff5 100644 --- a/src/resources/i18n/en/common.json +++ b/src/resources/i18n/en/common.json @@ -1327,7 +1327,8 @@ "button": { "label": "Close" }, - "headline": "An error has occurred. Please try again." + "headline": "An error has occurred. Please try again.", + "xReasonAlreadyRegistered": "You are already registered with this topic at the counseling center." } }, "registerSuccess": { From 87e93125c765a58445f7c8966826acaeacb5569e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Deborah=20K=C3=B6pfer?= Date: Thu, 21 Nov 2024 15:28:01 +0100 Subject: [PATCH 6/8] feat(additionalEnquiry): display registered topics and agencies --- .../profile/AskerConsultingTypeData.tsx | 140 +++++------------- 1 file changed, 39 insertions(+), 101 deletions(-) diff --git a/src/components/profile/AskerConsultingTypeData.tsx b/src/components/profile/AskerConsultingTypeData.tsx index fdf2d3113..e51af7c65 100644 --- a/src/components/profile/AskerConsultingTypeData.tsx +++ b/src/components/profile/AskerConsultingTypeData.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import { useContext } from 'react'; -import { UserDataContext, useTopics } from '../../globalState'; -import { handleNumericTranslation } from '../../utils/translate'; -import { getUserDataTranslateBase } from './profileHelpers'; +import { useContext, useEffect } from 'react'; +import { SessionsDataContext, SET_SESSIONS } from '../../globalState'; import { Headline } from '../headline/Headline'; import { Box } from '../box/Box'; import { useTranslation } from 'react-i18next'; +import { apiGetAskerSessionList } from '../../api'; +import { ListItemInterface } from '../../globalState/interfaces'; export const AskerConsultingTypeData = () => { const { t: translate } = useTranslation([ @@ -13,106 +13,44 @@ export const AskerConsultingTypeData = () => { 'consultingTypes', 'agencies' ]); - const { userData } = useContext(UserDataContext); - const topics = useTopics(); + + const { sessions, dispatch } = useContext(SessionsDataContext); + + useEffect(() => { + apiGetAskerSessionList().then((sessionsData) => { + dispatch({ + type: SET_SESSIONS, + ready: true, + sessions: sessionsData.sessions + }); + }); + }, []); return ( <> - {Object.values(userData.consultingTypes).map( - (resort: any, index) => - resort.isRegistered && - resort.agency && ( - -
-
- - topic.id === resort.topic - )?.name || '' - } - semanticLevel="5" - /> -
- {resort.sessionData && - Object.keys(resort.sessionData).map( - (item, itemIndex) => - item === 'age' && - resort.sessionData[item] === - 'null' ? null : ( -
-

- {translate( - 'userProfile.data.' + - item - )} -

-

- {resort.sessionData[ - item - ] - ? translate( - handleNumericTranslation( - getUserDataTranslateBase( - parseInt( - resort - .agency - .consultingType - ) - ), - item, - resort - .sessionData[ - item - ] - ) - ) - : translate( - 'profile.noContent' - )} -

-
- ) - )} -
-

- {translate('profile.data.agency.label')} -

-

- {translate( - [ - `agency.${resort.agency.id}.name`, - resort.agency.name - ], - { ns: 'agencies' } - )}{' '} -
- {resort.agency.postcode} - {resort.agency.city - ? ' ' + resort.agency.city - : ''} -

-
-
- - ) - )} + {Object.values(sessions).map((item: ListItemInterface, index) => ( + +
+
+ +
+
+

+ {translate('profile.data.agency.label')} +

+

+ {item.agency.name} +
+ {item.agency.postcode} {item.agency.city} +

+
+
+ + ))} ); }; From 0fbf9fc485690e7569f3ad84cf4acc5b147a1b5a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Deborah=20K=C3=B6pfer?= Date: Thu, 21 Nov 2024 16:09:35 +0100 Subject: [PATCH 7/8] feat(additionalEnquiry): missing dependency --- src/components/profile/AskerConsultingTypeData.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/profile/AskerConsultingTypeData.tsx b/src/components/profile/AskerConsultingTypeData.tsx index e51af7c65..903edf3a4 100644 --- a/src/components/profile/AskerConsultingTypeData.tsx +++ b/src/components/profile/AskerConsultingTypeData.tsx @@ -24,7 +24,7 @@ export const AskerConsultingTypeData = () => { sessions: sessionsData.sessions }); }); - }, []); + }, [dispatch]); return ( <> From 276134ab90371e61770449a6e91ab04207c3ab40 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Deborah=20K=C3=B6pfer?= Date: Thu, 21 Nov 2024 17:00:23 +0100 Subject: [PATCH 8/8] fix(tag-styles): better color contrast --- src/components/tag/tag.styles.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/tag/tag.styles.scss b/src/components/tag/tag.styles.scss index eda4cca82..2dcde71b8 100644 --- a/src/components/tag/tag.styles.scss +++ b/src/components/tag/tag.styles.scss @@ -16,6 +16,7 @@ &--green { background-color: $success; + color: white; } &--red {