Add CoS updates – HD

Author: szabozoltan69

app/src/App/routes/SurgeRoutes.tsx

@@ -1021,6 +1021,20 @@ const surgeCatalogueOtherDisasterRiskReduction = customWrapRoute({
     },
 });
 
+const surgeCatalogueOtherHumanitarianDiplomacy = customWrapRoute({
+    parent: surgeCatalogueLayout,
+    path: 'other/humanitarian-diplomacy',
+    component: {
+        render: () => import('#views/SurgeCatalogueOtherHumanitarianDiplomacy'),
+        props: {},
+    },
+    wrapperComponent: Auth,
+    context: {
+        title: 'Humanitarian Diplomacy',
+        visibility: 'anything',
+    },
+});
+
 const surgeCatalogueOtherHumanResources = customWrapRoute({
     parent: surgeCatalogueLayout,
     path: 'other/human-resources',
@@ -1347,6 +1361,7 @@ function DeploymentCatalogueNavigate() {
         other: {
             'civil-military-relations': surgeCatalogueOtherCivilMilitaryRelations,
             'disaster-risk-reduction-drr': surgeCatalogueOtherDisasterRiskReduction,
+            'humanitarian-diplomacy': surgeCatalogueOtherHumanitarianDiplomacy,
             'human-resources': surgeCatalogueOtherHumanResources,
             'international-disaster-response-law': surgeCatalogueOtherInternationalDisasterResponseLaw,
             migration: surgeCatalogueOtherMigration,
@@ -1487,6 +1502,7 @@ export default {
     surgeCatalogueWashHwts,
     surgeCatalogueOtherCivilMilitaryRelations,
     surgeCatalogueOtherDisasterRiskReduction,
+    surgeCatalogueOtherHumanitarianDiplomacy,
     surgeCatalogueOtherHumanResources,
     surgeCatalogueOtherInternationalDisasterResponseLaw,
     surgeCatalogueOtherMigration,

app/src/views/SurgeCatalogue/i18n.json

@@ -21,6 +21,7 @@
         "catalogueSecurity": "Security",
         "catalogueCMR": "Civil Military Relations (CMR)",
         "catalogueDDR": "Disaster Risk Reduction (DRR)",
+        "catalogueHD": "Humanitarian Diplomacy (HD)",
         "catalogueHR": "Human Resources (HR)",
         "catalogueIDRL": "International Disaster Response Law (IDRL)",
         "catalogueMigration": "Migration",

app/src/views/SurgeCatalogue/index.tsx

@@ -26,6 +26,7 @@ import {
     RecoveryIcon,
     SafetyAndSecurityIcon,
     ShelterIcon,
+    ShieldCrossFillIcon,
     WaterSanitationAndHygieneIcon,
 } from '@ifrc-go/icons';
 import { NavigationTabList } from '@ifrc-go/ui';
@@ -121,6 +122,13 @@ export function Component() {
                     <HealthIcon className={styles.icon} />
                     {strings.catalogueHealth}
                 </NavigationTab>
+                <NavigationTab
+                    to="surgeCatalogueOtherHumanitarianDiplomacy"
+                    parentRoute
+                >
+                    <ShieldCrossFillIcon className={styles.icon} />
+                    {strings.catalogueHD}
+                </NavigationTab>
                 <NavigationTab
                     to="surgeCatalogueOtherHumanResources"
                     parentRoute

app/src/views/SurgeCatalogueOtherHumanitarianDiplomacy/i18n.json

@@ -0,0 +1,11 @@
+{
+    "namespace": "surgeCatalogueOtherHumanitarianDiplomacy",
+    "strings": {
+        "humanHeading": "Humanitarian Diplomacy (HD)",
+        "overview": "Overview",
+        "overviewDetail": "Humanitarian Diplomacy (HD) is “persuading decision makers and opinion leaders to act, at all times, in the interests of vulnerable people, and with full respect for fundamental humanitarian principles”. In emergencies, IFRC delegations and NS may require specific surge support to strengthen HD efforts to identify HD issues and provide contextual analysis, draft HD key messages and engagement plan, set up an HD membership coordination system, and engage with external partners and stakeholders.",
+        "rapidResponse": "Rapid Response Personnel Role Profile",
+        "rapidResponseDetail": "Details about the expectations for this specialty can be found in the role profile:",
+        "linkOfficer": "Humanitarian Diplomacy Officer Role Profile"
+    }
+}

app/src/views/SurgeCatalogueOtherHumanitarianDiplomacy/index.tsx

@@ -0,0 +1,42 @@
+import { useTranslation } from '@ifrc-go/ui/hooks';
+
+import SurgeCatalogueContainer from '#components/domain/SurgeCatalogueContainer';
+import SurgeContentContainer from '#components/domain/SurgeContentContainer';
+import Link from '#components/Link';
+
+import i18n from './i18n.json';
+
+// eslint-disable-next-line import/prefer-default-export
+export function Component() {
+    const strings = useTranslation(i18n);
+
+    return (
+        <SurgeCatalogueContainer
+            heading={strings.humanHeading}
+        >
+            <SurgeContentContainer
+                heading={strings.overview}
+            >
+                <div>{strings.overviewDetail}</div>
+            </SurgeContentContainer>
+            <SurgeContentContainer
+                heading={strings.rapidResponse}
+            >
+                <div>{strings.rapidResponseDetail}</div>
+                <ul>
+                    <li>
+                        <Link
+                            href="https://ifrcorg.sharepoint.com/:b:/s/IFRCSharing/EaI9xGgLdnxItb4RXU1PGCEBlW_E8nUfxbMIZMGWoqdEHw"
+                            external
+                            withLinkIcon
+                        >
+                            {strings.linkOfficer}
+                        </Link>
+                    </li>
+                </ul>
+            </SurgeContentContainer>
+        </SurgeCatalogueContainer>
+    );
+}
+
+Component.displayName = 'SurgeCatalogueOtherHumanitarianDiplomacy';