feat: add xlsx download link for eru readiness information

Author: samshara

app/src/views/SurgeOverview/EmergencyResponseUnit/EmergencyResponseUnitReadiness/i18n.json

@@ -4,6 +4,9 @@
         "eruReadinessCount": "ERU Capacity and Readiness ({count})",
         "eruReadinessUpdateButton": "Update ERU Readiness",
         "eruNationalSociety": "National Society",
-        "eruType": "ERU Type"
+        "eruType": "ERU Type",
+        "exportEruReadiness": "Export ERU Readiness",
+        "exportEruReadinessFailed": "Failed to export ERU readiness information.",
+        "fetchEruReadinessFailed": "Failed to fetch ERU readiness information."
     }
 }

app/src/views/SurgeOverview/EmergencyResponseUnit/EmergencyResponseUnitReadiness/index.tsx

@@ -4,6 +4,7 @@ import {
     useState,
 } from 'react';
 import {
+    Button,
     Container,
     Grid,
     SelectInput,
@@ -29,11 +30,14 @@ import {
 } from '@togglecorp/fujs';
 
 import Link from '#components/Link';
+import useAlert from '#hooks/useAlert';
 import useGlobalEnums from '#hooks/domain/useGlobalEnums';
 import useFilterState from '#hooks/useFilterState';
 import { joinStrings } from '#utils/common';
+import { api } from '#config';
 import {
     type GoApiResponse,
+    useLazyRequest,
     useRequest,
 } from '#utils/restRequest';
 
@@ -72,6 +76,8 @@ function EmergencyResponseUnitReadiness() {
         filter: {},
     });
 
+    const alert = useAlert();
+
     const {
         error: eruOwnersError,
         response: eruOwnersResponse,
@@ -93,6 +99,12 @@ function EmergencyResponseUnitReadiness() {
             eru_type: filter.selectEruTypes,
             eru_owner: filter.selectEruOwner,
         },
+        onFailure: () => {
+            alert.show(
+                strings.fetchEruReadinessFailed,
+                { variant: 'danger' },
+            );
+        },
     });
 
     const {
@@ -107,8 +119,32 @@ function EmergencyResponseUnitReadiness() {
             type: filter.selectEruTypes,
             eru_owner: filter.selectEruOwner,
         },
+        onFailure: () => {
+            alert.show(
+                strings.fetchEruReadinessFailed,
+                { variant: 'danger' },
+            );
+        },
+    });
+
+    const {
+        pending: eruReadinessExportPending,
+        trigger: triggerEruReadinessExport,
+    } = useLazyRequest({
+        method: 'GET',
+        url: '/api/v2/export-eru-readiness',
+        onFailure: () => {
+            alert.show(
+                strings.exportEruReadinessFailed,
+                { variant: 'danger' },
+            );
+        },
     });
 
+    const handleEruReadinessExport = () => {
+        triggerEruReadinessExport(null);
+    };
+
     const {
         deployments_eru_type: deploymentEruType,
     } = useGlobalEnums();
@@ -173,12 +209,21 @@ function EmergencyResponseUnitReadiness() {
                 )}
                 withHeaderBorder
                 actions={(
-                    <Link
-                        to="eruReadinessForm"
-                        variant="primary"
-                    >
-                        {strings.eruReadinessUpdateButton}
-                    </Link>
+                    <>
+                        <Link
+                            href={`${api}/api/v2/export-eru-readiness`}
+                            variant="secondary"
+                            external
+                        >
+                            {strings.exportEruReadiness}
+                        </Link>
+                        <Link
+                            to="eruReadinessForm"
+                            variant="primary"
+                        >
+                            {strings.eruReadinessUpdateButton}
+                        </Link>
+                    </>
                 )}
                 contentViewType="vertical"
                 filters={(
@@ -238,7 +283,7 @@ function EmergencyResponseUnitReadiness() {
                     />
                 </TabPanel>
             </Container>
-        </Tabs>
+        </Tabs >
     );
 }