diff --git a/src/views/DrefApplicationExport/index.tsx b/src/views/DrefApplicationExport/index.tsx index 435140f1a1..5934265746 100644 --- a/src/views/DrefApplicationExport/index.tsx +++ b/src/views/DrefApplicationExport/index.tsx @@ -4,6 +4,7 @@ import { _cs, isDefined, isFalsyString, + isNotDefined, isTruthyString, } from '@togglecorp/fujs'; @@ -14,7 +15,6 @@ import Heading from '#components/printable/Heading'; import DescriptionText from '#components/printable/DescriptionText'; import Link from '#components/Link'; import DateOutput from '#components/DateOutput'; -import { components } from '#generated/types'; import useTranslation from '#hooks/useTranslation'; import { useRequest } from '#utils/restRequest'; import { @@ -25,6 +25,7 @@ import { DREF_TYPE_IMMINENT, DisasterCategory, } from '#utils/constants'; +import { components } from '#generated/types'; import ifrcLogo from '#assets/icons/ifrc-square.png'; @@ -52,57 +53,57 @@ const colorMap: Record = { [DISASTER_CATEGORY_RED]: styles.red, }; -const plannedInterventionSortedList = [ - 'shelter_housing_and_settlements', - 'livelihoods_and_basic_needs', - 'multi-purpose_cash', - 'health', - 'water_sanitation_and_hygiene', - 'protection_gender_and_inclusion', - 'education', - 'migration', - 'risk_reduction_climate_adaptation_and_recovery_', - 'community_engagement_and_accountability', - 'environmental_sustainability', - 'coordination_and_partnerships', - 'secretariat_services', - 'national_society_strengthening', -] satisfies (PlannedIntervention['title'])[]; +const plannedInterventionSortedList: Record, number> = { + shelter_housing_and_settlements: 1, + livelihoods_and_basic_needs: 2, + multi_purpose_cash: 3, + health: 4, + water_sanitation_and_hygiene: 5, + protection_gender_and_inclusion: 6, + education: 7, + migration_and_displacement: 8, + risk_reduction_climate_adaptation_and_recovery: 9, + community_engagement_and_accountability: 10, + environmental_sustainability: 11, + coordination_and_partnerships: 12, + secretariat_services: 13, + national_society_strengthening: 14, +}; -const identifiedNeedsAndGapsSortedList = [ - 'shelter_housing_and_settlements', - 'livelihoods_and_basic_needs', - 'multi_purpose_cash_grants', - 'health', - 'water_sanitation_and_hygiene', - 'protection_gender_and_inclusion', - 'education', - 'migration', - 'risk_reduction_climate_adaptation_and_recovery', - 'community_engagement_and _accountability', - 'environment_sustainability ', -] satisfies (IdentifiedNeedsAndGaps['title'])[]; +const identifiedNeedsAndGapsSortedList: Record, number> = { + shelter_housing_and_settlements: 1, + livelihoods_and_basic_needs: 2, + multi_purpose_cash_grants: 3, + health: 4, + water_sanitation_and_hygiene: 5, + protection_gender_and_inclusion: 6, + education: 7, + migration_and_displacement: 8, + risk_reduction_climate_adaptation_and_recovery: 9, + community_engagement_and_accountability: 10, + environment_sustainability: 11, +}; -const nsActionsSortedList = [ - 'shelter_housing_and_settlements', - 'livelihoods_and_basic_needs', - 'multi-purpose_cash', - 'health', - 'water_sanitation_and_hygiene', - 'protection_gender_and_inclusion', - 'education', - 'migration', - 'risk_reduction_climate_adaptation_and_recovery', - 'community_engagement_and _accountability', - 'environment_sustainability ', - 'coordination', - 'national_society_readiness', - 'assessment', - 'resource_mobilization', - 'activation_of_contingency_plans', - 'national_society_eoc', - 'other', -] satisfies (NsActions['title'])[]; +const nsActionsSortedList: Record = { + shelter_housing_and_settlements: 1, + livelihoods_and_basic_needs: 2, + multi_purpose_cash: 3, + health: 4, + water_sanitation_and_hygiene: 5, + protection_gender_and_inclusion: 6, + education: 7, + migration_and_displacement: 8, + risk_reduction_climate_adaptation_and_recovery: 9, + community_engagement_and_accountability: 10, + environment_sustainability: 11, + coordination: 12, + national_society_readiness: 13, + assessment: 14, + resource_mobilization: 15, + activation_of_contingency_plans: 16, + national_society_eoc: 17, + other: 18, +}; // eslint-disable-next-line import/prefer-default-export export function Component() { @@ -153,28 +154,58 @@ export function Component() { }, }); + const filteredPlannedIntervention = useMemo( + () => drefResponse?.planned_interventions?.map((d) => { + if (isNotDefined(d.title)) { + return undefined; + } + return { ...d, title: d.title }; + }).filter(isDefined), + [drefResponse?.planned_interventions], + ); + + const filteredIdentifiedNeedsAndGaps = useMemo( + () => drefResponse?.needs_identified?.map((d) => { + if (isNotDefined(d.title)) { + return undefined; + } + return { ...d, title: d.title }; + }).filter(isDefined), + [drefResponse?.needs_identified], + ); + + const filteredNsActions = useMemo( + () => drefResponse?.national_society_actions?.map((d) => { + if (isNotDefined(d.title)) { + return undefined; + } + return { ...d, title: d.title }; + }).filter(isDefined), + [drefResponse?.national_society_actions], + ); + const sortedPlannedInterventions = useMemo( - () => drefResponse?.planned_interventions?.sort((a, b) => ( + () => filteredPlannedIntervention?.sort( // eslint-disable-next-line max-len - plannedInterventionSortedList.indexOf(a.title) - plannedInterventionSortedList.indexOf(b.title) - )), - [drefResponse?.planned_interventions], + (a, b) => plannedInterventionSortedList[a.title] - plannedInterventionSortedList[b.title], + ), + [filteredPlannedIntervention], ); const sortedIdentifiedNeedsAndGaps = useMemo( - () => drefResponse?.needs_identified?.sort((a, b) => ( + () => filteredIdentifiedNeedsAndGaps?.sort( // eslint-disable-next-line max-len - identifiedNeedsAndGapsSortedList.indexOf(a.title) - identifiedNeedsAndGapsSortedList.indexOf(b.title) - )), - [drefResponse?.needs_identified], + (a, b) => identifiedNeedsAndGapsSortedList[a.title] - identifiedNeedsAndGapsSortedList[b.title], + ), + [filteredIdentifiedNeedsAndGaps], ); const sortedNsActions = useMemo( - () => drefResponse?.national_society_actions?.sort((a, b) => ( + () => filteredNsActions?.sort((a, b) => ( // eslint-disable-next-line max-len - nsActionsSortedList.indexOf(a.title) - nsActionsSortedList.indexOf(b.title) + nsActionsSortedList[a.title] - nsActionsSortedList[b.title] )), - [drefResponse?.national_society_actions], + [filteredNsActions], ); const eventDescriptionDefined = isTruthyString(drefResponse?.event_description?.trim()); diff --git a/src/views/DrefFinalReportExport/index.tsx b/src/views/DrefFinalReportExport/index.tsx index 15bf4d8da1..9c1c09a68a 100644 --- a/src/views/DrefFinalReportExport/index.tsx +++ b/src/views/DrefFinalReportExport/index.tsx @@ -1,9 +1,10 @@ -import { Fragment, useState } from 'react'; +import { Fragment, useMemo, useState } from 'react'; import { useParams } from 'react-router-dom'; import { _cs, isDefined, isFalsyString, + isNotDefined, isTruthyString, } from '@togglecorp/fujs'; @@ -25,12 +26,16 @@ import { DREF_TYPE_IMMINENT, DisasterCategory, } from '#utils/constants'; +import { components } from '#generated/types'; import ifrcLogo from '#assets/icons/ifrc-square.png'; import i18n from './i18n.json'; import styles from './styles.module.css'; +type PlannedIntervention = components<'read'>['schemas']['PlannedIntervention']; +type IdentifiedNeedsAndGaps = components<'read'>['schemas']['IdentifiedNeed']; + function BlockTextOutput(props: TextOutputProps & { variant?: never, withoutLabelColon?: never }) { return ( = { [DISASTER_CATEGORY_RED]: styles.red, }; +const plannedInterventionSortedList: Record, number> = { + shelter_housing_and_settlements: 1, + livelihoods_and_basic_needs: 2, + multi_purpose_cash: 3, + health: 4, + water_sanitation_and_hygiene: 5, + protection_gender_and_inclusion: 6, + education: 7, + migration_and_displacement: 8, + risk_reduction_climate_adaptation_and_recovery: 9, + community_engagement_and_accountability: 10, + environmental_sustainability: 11, + coordination_and_partnerships: 12, + secretariat_services: 13, + national_society_strengthening: 14, +}; + +const identifiedNeedsAndGapsSortedList: Record, number> = { + shelter_housing_and_settlements: 1, + livelihoods_and_basic_needs: 2, + multi_purpose_cash_grants: 3, + health: 4, + water_sanitation_and_hygiene: 5, + protection_gender_and_inclusion: 6, + education: 7, + migration_and_displacement: 8, + risk_reduction_climate_adaptation_and_recovery: 9, + community_engagement_and_accountability: 10, + environment_sustainability: 11, +}; + // eslint-disable-next-line import/prefer-default-export export function Component() { const { finalReportId } = useParams<{ finalReportId: string }>(); @@ -96,6 +132,42 @@ export function Component() { }, }); + const filteredPlannedIntervention = useMemo( + () => drefResponse?.planned_interventions?.map((d) => { + if (isNotDefined(d.title)) { + return undefined; + } + return { ...d, title: d.title }; + }).filter(isDefined), + [drefResponse?.planned_interventions], + ); + + const filteredIdentifiedNeedsAndGaps = useMemo( + () => drefResponse?.needs_identified?.map((d) => { + if (isNotDefined(d.title)) { + return undefined; + } + return { ...d, title: d.title }; + }).filter(isDefined), + [drefResponse?.needs_identified], + ); + + const sortedPlannedInterventions = useMemo( + () => filteredPlannedIntervention?.sort( + // eslint-disable-next-line max-len + (a, b) => plannedInterventionSortedList[a.title] - plannedInterventionSortedList[b.title], + ), + [filteredPlannedIntervention], + ); + + const sortedIdentifiedNeedsAndGaps = useMemo( + () => filteredIdentifiedNeedsAndGaps?.sort( + // eslint-disable-next-line max-len + (a, b) => identifiedNeedsAndGapsSortedList[a.title] - identifiedNeedsAndGapsSortedList[b.title], + ), + [filteredIdentifiedNeedsAndGaps], + ); + const showMainDonorsSection = isTruthyString(drefResponse?.main_donors?.trim()); const eventDescriptionDefined = isTruthyString(drefResponse?.event_description?.trim()); const eventScopeDefined = drefResponse?.type_of_dref !== DREF_TYPE_ASSESSMENT @@ -490,7 +562,7 @@ export function Component() { {strings.needsIdentifiedSectionHeading} - {needsIdentifiedDefined && drefResponse?.needs_identified?.map( + {needsIdentifiedDefined && sortedIdentifiedNeedsAndGaps?.map( (identifiedNeed) => ( @@ -688,7 +760,7 @@ export function Component() { {strings.interventionSectionHeading} - {drefResponse?.planned_interventions?.map( + {sortedPlannedInterventions?.map( (plannedIntervention) => ( diff --git a/src/views/DrefOperationalUpdateExport/index.tsx b/src/views/DrefOperationalUpdateExport/index.tsx index 0da766b583..726d880977 100644 --- a/src/views/DrefOperationalUpdateExport/index.tsx +++ b/src/views/DrefOperationalUpdateExport/index.tsx @@ -1,9 +1,10 @@ -import { Fragment, useState } from 'react'; +import { Fragment, useState, useMemo } from 'react'; import { useParams, ScrollRestoration } from 'react-router-dom'; import { _cs, isDefined, isFalsyString, + isNotDefined, isTruthyString, } from '@togglecorp/fujs'; @@ -26,12 +27,17 @@ import { DREF_TYPE_IMMINENT, DisasterCategory, } from '#utils/constants'; +import { components } from '#generated/types'; import ifrcLogo from '#assets/icons/ifrc-square.png'; import i18n from './i18n.json'; import styles from './styles.module.css'; +type PlannedIntervention = components<'read'>['schemas']['PlannedIntervention']; +type IdentifiedNeedsAndGaps = components<'read'>['schemas']['IdentifiedNeed']; +type NsActions = components<'read'>['schemas']['NationalSocietyAction']; + function BlockTextOutput(props: TextOutputProps & { variant?: never, withoutLabelColon?: never }) { return ( = { - [DISASTER_CATEGORY_YELLOW]: styles.yellow, - [DISASTER_CATEGORY_ORANGE]: styles.orange, - [DISASTER_CATEGORY_RED]: styles.red, +const plannedInterventionSortedList: Record, number> = { + shelter_housing_and_settlements: 1, + livelihoods_and_basic_needs: 2, + multi_purpose_cash: 3, + health: 4, + water_sanitation_and_hygiene: 5, + protection_gender_and_inclusion: 6, + education: 7, + migration_and_displacement: 8, + risk_reduction_climate_adaptation_and_recovery: 9, + community_engagement_and_accountability: 10, + environmental_sustainability: 11, + coordination_and_partnerships: 12, + secretariat_services: 13, + national_society_strengthening: 14, +}; + +const identifiedNeedsAndGapsSortedList: Record, number> = { + shelter_housing_and_settlements: 1, + livelihoods_and_basic_needs: 2, + multi_purpose_cash_grants: 3, + health: 4, + water_sanitation_and_hygiene: 5, + protection_gender_and_inclusion: 6, + education: 7, + migration_and_displacement: 8, + risk_reduction_climate_adaptation_and_recovery: 9, + community_engagement_and_accountability: 10, + environment_sustainability: 11, +}; + +const nsActionsSortedList: Record = { + shelter_housing_and_settlements: 1, + livelihoods_and_basic_needs: 2, + multi_purpose_cash: 3, + health: 4, + water_sanitation_and_hygiene: 5, + protection_gender_and_inclusion: 6, + education: 7, + migration_and_displacement: 8, + risk_reduction_climate_adaptation_and_recovery: 9, + community_engagement_and_accountability: 10, + environment_sustainability: 11, + coordination: 12, + national_society_readiness: 13, + assessment: 14, + resource_mobilization: 15, + activation_of_contingency_plans: 16, + national_society_eoc: 17, + other: 18, }; // eslint-disable-next-line import/prefer-default-export @@ -97,6 +149,60 @@ export function Component() { }, }); + const filteredPlannedIntervention = useMemo( + () => drefResponse?.planned_interventions?.map((d) => { + if (isNotDefined(d.title)) { + return undefined; + } + return { ...d, title: d.title }; + }).filter(isDefined), + [drefResponse?.planned_interventions], + ); + + const filteredIdentifiedNeedsAndGaps = useMemo( + () => drefResponse?.needs_identified?.map((d) => { + if (isNotDefined(d.title)) { + return undefined; + } + return { ...d, title: d.title }; + }).filter(isDefined), + [drefResponse?.needs_identified], + ); + + const filteredNsActions = useMemo( + () => drefResponse?.national_society_actions?.map((d) => { + if (isNotDefined(d.title)) { + return undefined; + } + return { ...d, title: d.title }; + }).filter(isDefined), + [drefResponse?.national_society_actions], + ); + + const sortedPlannedInterventions = useMemo( + () => filteredPlannedIntervention?.sort( + // eslint-disable-next-line max-len + (a, b) => plannedInterventionSortedList[a.title] - plannedInterventionSortedList[b.title], + ), + [filteredPlannedIntervention], + ); + + const sortedIdentifiedNeedsAndGaps = useMemo( + () => filteredIdentifiedNeedsAndGaps?.sort( + // eslint-disable-next-line max-len + (a, b) => identifiedNeedsAndGapsSortedList[a.title] - identifiedNeedsAndGapsSortedList[b.title], + ), + [filteredIdentifiedNeedsAndGaps], + ); + + const sortedNsActions = useMemo( + () => filteredNsActions?.sort((a, b) => ( + // eslint-disable-next-line max-len + nsActionsSortedList[a.title] - nsActionsSortedList[b.title] + )), + [filteredNsActions], + ); + const eventDescriptionDefined = isTruthyString(drefResponse?.event_description?.trim()); const eventScopeDefined = drefResponse?.type_of_dref !== DREF_TYPE_ASSESSMENT && isTruthyString(drefResponse?.event_scope?.trim()); @@ -533,7 +639,7 @@ export function Component() { - {drefResponse?.national_society_actions?.map( + {sortedNsActions?.map( (nsAction) => ( {strings.needsIdentifiedSectionHeading} - {needsIdentifiedDefined && drefResponse?.needs_identified?.map( + {needsIdentifiedDefined && sortedIdentifiedNeedsAndGaps?.map( (identifiedNeed) => ( @@ -836,7 +942,7 @@ export function Component() { {strings.plannedInterventionSectionHeading} - {drefResponse?.planned_interventions?.map( + {sortedPlannedInterventions?.map( (plannedIntervention) => (