Add sorted NS actions and planned interventions in all DREF export

IFRCGo · Dec 8, 2023 · 8b4a6a4 · 8b4a6a4
1 parent 7197fb6
commit 8b4a6a4
Show file tree

Hide file tree

Showing 3 changed files with 230 additions and 16 deletions.
diff --git 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';
 
@@ -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.indexOf(a.title) - plannedInterventionSortedList.indexOf(b.title),
+        ),
+        [filteredPlannedIntervention],
     );
 
     const sortedIdentifiedNeedsAndGaps = useMemo(
-        () => drefResponse?.needs_identified?.sort((a, b) => (
+        () => filteredIdentifiedNeedsAndGaps?.sort((a, b) => (
             // eslint-disable-next-line max-len
             identifiedNeedsAndGapsSortedList.indexOf(a.title) - identifiedNeedsAndGapsSortedList.indexOf(b.title)
         )),
-        [drefResponse?.needs_identified],
+        [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)
         )),
-        [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
@@ -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 (
         <TextOutput
@@ -48,6 +53,37 @@ const colorMap: Record<DisasterCategory, string> = {
     [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 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'])[];
+
 // 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.indexOf(a.title) - plannedInterventionSortedList.indexOf(b.title),
+        ),
+        [filteredPlannedIntervention],
+    );
+
+    const sortedIdentifiedNeedsAndGaps = useMemo(
+        () => filteredIdentifiedNeedsAndGaps?.sort((a, b) => (
+            // eslint-disable-next-line max-len
+            identifiedNeedsAndGapsSortedList.indexOf(a.title) - identifiedNeedsAndGapsSortedList.indexOf(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() {
                     <Heading level={2}>
                         {strings.needsIdentifiedSectionHeading}
                     </Heading>
-                    {needsIdentifiedDefined && drefResponse?.needs_identified?.map(
+                    {needsIdentifiedDefined && sortedIdentifiedNeedsAndGaps?.map(
                         (identifiedNeed) => (
                             <Fragment key={identifiedNeed.id}>
                                 <Heading className={styles.needsIdentifiedHeading}>
@@ -688,7 +760,7 @@ export function Component() {
                     <Heading level={2}>
                         {strings.interventionSectionHeading}
                     </Heading>
-                    {drefResponse?.planned_interventions?.map(
+                    {sortedPlannedInterventions?.map(
                         (plannedIntervention) => (
                             <Fragment key={plannedIntervention.id}>
                                 <Heading className={styles.plannedInterventionHeading}>

diff --git 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 (
         <TextOutput
@@ -49,6 +55,58 @@ const colorMap: Record<DisasterCategory, string> = {
     [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 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 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'])[];
+
 // eslint-disable-next-line import/prefer-default-export
 export function Component() {
     const { opsUpdateId } = useParams<{ opsUpdateId: string }>();
@@ -97,6 +155,59 @@ 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.indexOf(a.title) - plannedInterventionSortedList.indexOf(b.title),
+        ),
+        [filteredPlannedIntervention],
+    );
+
+    const sortedIdentifiedNeedsAndGaps = useMemo(
+        () => filteredIdentifiedNeedsAndGaps?.sort((a, b) => (
+            // eslint-disable-next-line max-len
+            identifiedNeedsAndGapsSortedList.indexOf(a.title) - identifiedNeedsAndGapsSortedList.indexOf(b.title)
+        )),
+        [filteredIdentifiedNeedsAndGaps],
+    );
+
+    const sortedNsActions = useMemo(
+        () => filteredNsActions?.sort((a, b) => (
+            // eslint-disable-next-line max-len
+            nsActionsSortedList.indexOf(a.title) - nsActionsSortedList.indexOf(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 +644,7 @@ export function Component() {
                             <Container
                                 childrenContainerClassName={styles.nsActionsList}
                             >
-                                {drefResponse?.national_society_actions?.map(
+                                {sortedNsActions?.map(
                                     (nsAction) => (
                                         <BlockTextOutput
                                             key={nsAction.id}
@@ -631,7 +742,7 @@ export function Component() {
                     <Heading level={2}>
                         {strings.needsIdentifiedSectionHeading}
                     </Heading>
-                    {needsIdentifiedDefined && drefResponse?.needs_identified?.map(
+                    {needsIdentifiedDefined && sortedIdentifiedNeedsAndGaps?.map(
                         (identifiedNeed) => (
                             <Fragment key={identifiedNeed.id}>
                                 <Heading className={styles.needsIdentifiedHeading}>
@@ -836,7 +947,7 @@ export function Component() {
                     <Heading level={2}>
                         {strings.plannedInterventionSectionHeading}
                     </Heading>
-                    {drefResponse?.planned_interventions?.map(
+                    {sortedPlannedInterventions?.map(
                         (plannedIntervention) => (
                             <Fragment key={plannedIntervention.id}>
                                 <Heading className={styles.plannedInterventionHeading}>