[RELEASE] Horrible Hackberry

.github/workflows/pull-request.yml

@@ -0,0 +1,16 @@
+name: pull-request
+on:
+  pull_request:
+    branches: [main, staging, release/**]
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version-file: '.nvmrc'
+      - name: Install modules
+        run: yarn
+      - name: Test
+        run: yarn run jest --ci

.jest/setEnvVars.js

@@ -1,2 +1,2 @@
 process.env.NODE_ENV = "test";
-process.env.NEXT_PUBLIC_API_BASE_URL = "https://test.wrirestorationmarketplace.cubeapis.com";
+process.env.NEXT_PUBLIC_API_BASE_URL = "https://new-wri-staging.wri-restoration-marketplace-api.com";

.nvmrc

@@ -0,0 +1 @@
+18.17.0

src/admin/components/Dialogs/FrameworkSelectionDialog.tsx

@@ -1,13 +1,15 @@
 import { CheckCircle, InfoOutlined } from "@mui/icons-material";
 import { Button, Dialog, DialogActions, DialogContent, DialogProps, DialogTitle } from "@mui/material";
-import { FC, useMemo } from "react";
+import { capitalize, split } from "lodash";
+import { FC, useCallback, useMemo, useState } from "react";
 import { AutocompleteInput, Form } from "react-admin";
 import { FieldValues } from "react-hook-form";
 import * as yup from "yup";
 
 import { validateForm } from "@/admin/utils/forms";
-import { useGetV2AdminReportingFrameworks } from "@/generated/apiComponents";
-import { Option } from "@/types/common";
+import { fetchGetV2AdminENTITYExportFRAMEWORK, useGetV2AdminReportingFrameworks } from "@/generated/apiComponents";
+import { EntityName, Option } from "@/types/common";
+import { downloadFileBlob } from "@/utils/network";
 import { optionToChoices } from "@/utils/options";
 
 interface FrameworkSelectionDialogContentProps {
@@ -57,6 +59,40 @@ const FrameworkSelectionDialogContent: FC<FrameworkSelectionDialogContentProps>
   );
 };
 
+export function useFrameworkExport(entity: EntityName) {
+  const [exporting, setExporting] = useState(false);
+  const [modalOpen, setModalOpen] = useState(false);
+
+  const onExport = useCallback(
+    (framework: string) => {
+      setExporting(true);
+
+      const exportPrefix = split(entity, "-").map(capitalize).join(" ");
+
+      fetchGetV2AdminENTITYExportFRAMEWORK({
+        pathParams: { entity, framework }
+      })
+        .then((response: any) => {
+          downloadFileBlob(response, `${exportPrefix} - ${framework}.csv`);
+        })
+        .finally(() => setExporting(false));
+
+      setModalOpen(false);
+    },
+    [entity]
+  );
+
+  return {
+    exporting,
+    openExportDialog: useCallback(() => setModalOpen(true), []),
+    frameworkDialogProps: {
+      open: modalOpen,
+      onCancel: useCallback(() => setModalOpen(false), []),
+      onExport
+    }
+  };
+}
+
 interface FrameworkSelectionDialogProps extends DialogProps {
   onExport: (framework: string) => void;
   onCancel: () => void;

src/admin/components/Fields/FrameworkField.tsx

@@ -1,22 +1,11 @@
-import { FC, useEffect, useState } from "react";
+import { FC } from "react";
 import { FunctionField } from "react-admin";
 
 import { useFrameworkChoices } from "@/constants/options/frameworks";
 
 const FrameworkField: FC = () => {
-  const [frameworkChoices, setFrameworkChoices] = useState<any>([]);
-  const fetchData = async () => {
-    try {
-      const choices = await useFrameworkChoices();
-      setFrameworkChoices(choices);
-    } catch (error) {
-      console.error("Error fetching framework choices:", error);
-    }
-  };
+  const frameworkChoices = useFrameworkChoices();
 
-  useEffect(() => {
-    fetchData();
-  }, []);
   return (
     <FunctionField
       source="framework_key"

src/admin/components/ResourceTabs/InformationTab/components/ProjectInformationAside/HighLevelMetrics.tsx

@@ -26,7 +26,10 @@ const HighLevelMetics: FC = () => {
           </Labeled>
         </When>
         <When condition={record?.framework_key === "ppc"}>
-          <Labeled label="Workdays Created" sx={inlineLabelSx}>
+          <Labeled label="Workdays Created (Old Calculation)" sx={inlineLabelSx}>
+            <NumberField source="self_reported_workday_count" emptyText="0" />
+          </Labeled>
+          <Labeled label="Workdays Created (New Calculation)" sx={inlineLabelSx}>
             <NumberField source="workday_count" emptyText="0" />
           </Labeled>
         </When>

src/admin/components/ResourceTabs/InformationTab/components/SiteInformationAside/HighLevelMetrics.tsx

@@ -24,7 +24,10 @@ const HighLevelMetics: FC = () => {
       <Box paddingX={3.75} paddingY={2}>
         <Stack gap={3}>
           <When condition={isPPC}>
-            <Labeled label="Total Number Of Workdays Created" sx={inlineLabelSx}>
+            <Labeled label="Workdays Created (Old Calculation)" sx={inlineLabelSx}>
+              <NumberField source="self_reported_workday_count" emptyText="0" />
+            </Labeled>
+            <Labeled label="Workdays Created (New Calculation)" sx={inlineLabelSx}>
               <NumberField source="workday_count" emptyText="0" />
             </Labeled>
           </When>

src/admin/components/ResourceTabs/InformationTab/index.tsx

@@ -8,7 +8,11 @@ import { MonitoringPartnersTable } from "@/admin/components/ResourceTabs/Informa
 import SeedingsTable from "@/admin/components/Tables/SeedingsTable";
 import { setDefaultConditionalFieldsAnswers } from "@/admin/utils/forms";
 import List from "@/components/extensive/List/List";
-import { GetV2FormsENTITYUUIDResponse, useGetV2FormsENTITYUUID } from "@/generated/apiComponents";
+import {
+  GetV2FormsENTITYUUIDResponse,
+  useGetV2FormsENTITYUUID,
+  useGetV2SeedingsENTITYUUID
+} from "@/generated/apiComponents";
 import { getCustomFormSteps, normalizedFormDefaultValue } from "@/helpers/customForms";
 import { pluralEntityNameToSingular } from "@/helpers/entity";
 import { EntityName } from "@/types/common";
@@ -53,6 +57,14 @@ const InformationTab: FC<IProps> = props => {
     }
   });
 
+  const { data: seedlings } = useGetV2SeedingsENTITYUUID({
+    pathParams: {
+      uuid: record?.uuid,
+      entity: resource.replace("Report", "-report")
+    }
+  });
+
+  const totalSeedlings = seedlings?.data?.reduce((acc, curr) => acc + (curr?.amount ?? 0), 0);
   const t = useT();
 
   const isLoading = ctxLoading || queryLoading;
@@ -114,10 +126,30 @@ const InformationTab: FC<IProps> = props => {
                   </Card>
 
                   <When condition={record}>
+                    <When
+                      condition={
+                        record.framework_key === "ppc" && (props.type === "sites" || props.type === "site-reports")
+                      }
+                    >
+                      <Card sx={{ padding: 3 }}>
+                        <Typography variant="h6" component="h3" className="capitalize">
+                          Total Trees Planted
+                        </Typography>
+                        {record?.total_trees_planted_count}
+                      </Card>
+                    </When>
                     <TreeSpeciesTable uuid={record.uuid} entity={resource} />
                   </When>
 
                   <When condition={props.type === "sites" || props.type === "site-reports"}>
+                    <When condition={record.framework_key === "ppc"}>
+                      <Card sx={{ padding: 3 }}>
+                        <Typography variant="h6" component="h3" className="capitalize">
+                          Total Seeds Planted
+                        </Typography>
+                        {totalSeedlings}
+                      </Card>
+                    </When>
                     <SeedingsTable uuid={record.uuid} entity={resource} />
                   </When>
 

src/admin/modules/nurseries/components/NurseriesList.tsx

@@ -1,10 +1,11 @@
 import { Divider, Stack, Typography } from "@mui/material";
-import { FC, useState } from "react";
+import { FC } from "react";
 import {
   AutocompleteInput,
   Datagrid,
   DateField,
   EditButton,
+  FunctionField,
   List,
   ReferenceInput,
   SearchInput,
@@ -19,15 +20,17 @@ import ListActions from "@/admin/components/Actions/ListActions";
 import ExportProcessingAlert from "@/admin/components/Alerts/ExportProcessingAlert";
 import CustomBulkDeleteWithConfirmButton from "@/admin/components/Buttons/CustomBulkDeleteWithConfirmButton";
 import CustomDeleteWithConfirmButton from "@/admin/components/Buttons/CustomDeleteWithConfirmButton";
+import FrameworkSelectionDialog, { useFrameworkExport } from "@/admin/components/Dialogs/FrameworkSelectionDialog";
 import { getCountriesOptions } from "@/constants/options/countries";
+import { useFrameworkChoices } from "@/constants/options/frameworks";
 import { getChangeRequestStatusOptions, getStatusOptions } from "@/constants/options/status";
-import { fetchGetV2AdminENTITYExportFRAMEWORK } from "@/generated/apiComponents";
-import { downloadFileBlob } from "@/utils/network";
 import { optionToChoices } from "@/utils/options";
 
 import modules from "../..";
 
 const NurseryDataGrid: FC = () => {
+  const frameworkChoices = useFrameworkChoices();
+
   return (
     <Datagrid bulkActionButtons={<CustomBulkDeleteWithConfirmButton source="name" />}>
       <TextField source="name" label="Nursery Name" />
@@ -41,6 +44,15 @@ const NurseryDataGrid: FC = () => {
       <TextField source="project.name" label="Project Name" />
       <TextField source="organisation.name" label="Organization" />
       <DateField source="start_date" label="Establishment" locales="en-GB" />
+      <FunctionField
+        source="framework_key"
+        label="Framework"
+        render={(record: any) =>
+          frameworkChoices.find((framework: any) => framework.id === record?.framework_key)?.name ??
+          record?.framework_key
+        }
+        sortable={false}
+      />
       <ShowButton />
       <EditButton />
       <WrapperField>
@@ -51,7 +63,7 @@ const NurseryDataGrid: FC = () => {
 };
 
 export const NurseriesList: FC = () => {
-  const [exporting, setExporting] = useState<boolean>(false);
+  const frameworkChoices = useFrameworkChoices();
 
   const filters = [
     <SearchInput key="search" source="search" alwaysOn />,
@@ -68,6 +80,7 @@ export const NurseriesList: FC = () => {
     >
       <AutocompleteInput optionText="name" label="Organization" />
     </ReferenceInput>,
+    <SelectInput key="framework_key" label="Framework" source="framework_key" choices={frameworkChoices} />,
     <SelectInput key="status" label="Status" source="status" choices={optionToChoices(getStatusOptions())} />,
     <SelectInput
       key="update_request_status"
@@ -89,20 +102,7 @@ export const NurseriesList: FC = () => {
     </ReferenceInput>
   ];
 
-  const handleExport = () => {
-    setExporting(true);
-
-    fetchGetV2AdminENTITYExportFRAMEWORK({
-      pathParams: {
-        entity: "nurseries",
-        framework: "terrafund"
-      }
-    })
-      .then((response: any) => {
-        downloadFileBlob(response, "Nurseries - terrafund.csv");
-      })
-      .finally(() => setExporting(false));
-  };
+  const { exporting, openExportDialog, frameworkDialogProps } = useFrameworkExport("nurseries");
 
   return (
     <>
@@ -112,10 +112,12 @@ export const NurseriesList: FC = () => {
         <Divider />
       </Stack>
 
-      <List actions={<ListActions onExport={handleExport} />} filters={filters}>
+      <List actions={<ListActions onExport={openExportDialog} />} filters={filters}>
         <NurseryDataGrid />
       </List>
 
+      <FrameworkSelectionDialog {...frameworkDialogProps} />
+
       <ExportProcessingAlert show={exporting} />
     </>
   );

src/admin/modules/nurseryReports/components/NurseryReportsList.tsx

@@ -1,10 +1,11 @@
 import { Divider, Stack, Typography } from "@mui/material";
-import { FC, useState } from "react";
+import { FC } from "react";
 import {
   AutocompleteInput,
   Datagrid,
   DateField,
   EditButton,
+  FunctionField,
   List,
   ReferenceInput,
   SearchInput,
@@ -17,15 +18,17 @@ import {
 import ListActions from "@/admin/components/Actions/ListActions";
 import ExportProcessingAlert from "@/admin/components/Alerts/ExportProcessingAlert";
 import CustomBulkDeleteWithConfirmButton from "@/admin/components/Buttons/CustomBulkDeleteWithConfirmButton";
+import FrameworkSelectionDialog, { useFrameworkExport } from "@/admin/components/Dialogs/FrameworkSelectionDialog";
 import { getCountriesOptions } from "@/constants/options/countries";
+import { useFrameworkChoices } from "@/constants/options/frameworks";
 import { getChangeRequestStatusOptions, getReportStatusOptions } from "@/constants/options/status";
-import { fetchGetV2AdminENTITYExportFRAMEWORK } from "@/generated/apiComponents";
-import { downloadFileBlob } from "@/utils/network";
 import { optionToChoices } from "@/utils/options";
 
 import modules from "../..";
 
 const NurseryReportDataGrid: FC = () => {
+  const frameworkChoices = useFrameworkChoices();
+
   return (
     <Datagrid bulkActionButtons={<CustomBulkDeleteWithConfirmButton source="title" />}>
       <TextField source="nursery.name" label="Nursery Name" sortable={false} />
@@ -41,14 +44,23 @@ const NurseryReportDataGrid: FC = () => {
       <DateField source="due_at" label="Due Date" locales="en-GB" />
       <DateField source="updated_at" label="Last Updated" locales="en-GB" />
       <DateField source="submitted_at" label="Date Submitted" locales="en-GB" />
+      <FunctionField
+        source="framework_key"
+        label="Framework"
+        render={(record: any) =>
+          frameworkChoices.find((framework: any) => framework.id === record?.framework_key)?.name ??
+          record?.framework_key
+        }
+        sortable={false}
+      />
       <ShowButton />
       <EditButton />
     </Datagrid>
   );
 };
 
 export const NurseryReportsList: FC = () => {
-  const [exporting, setExporting] = useState<boolean>(false);
+  const frameworkChoices = useFrameworkChoices();
 
   const filters = [
     <SearchInput key="search" source="search" alwaysOn />,
@@ -77,6 +89,7 @@ export const NurseryReportsList: FC = () => {
       <AutocompleteInput optionText="name" label="Nursery" />
     </ReferenceInput>,
     <SelectInput key="country" label="Country" source="country" choices={optionToChoices(getCountriesOptions())} />,
+    <SelectInput key="framework_key" label="Framework" source="framework_key" choices={frameworkChoices} />,
     <SelectInput key="status" label="Status" source="status" choices={optionToChoices(getReportStatusOptions())} />,
     <SelectInput
       key="update_request_status"
@@ -86,20 +99,7 @@ export const NurseryReportsList: FC = () => {
     />
   ];
 
-  const handleExport = () => {
-    setExporting(true);
-
-    fetchGetV2AdminENTITYExportFRAMEWORK({
-      pathParams: {
-        entity: "nursery-reports",
-        framework: "terrafund"
-      }
-    })
-      .then((response: any) => {
-        downloadFileBlob(response, "Nursery Reports - terrafund.csv");
-      })
-      .finally(() => setExporting(false));
-  };
+  const { exporting, openExportDialog, frameworkDialogProps } = useFrameworkExport("nursery-reports");
 
   return (
     <>
@@ -109,10 +109,12 @@ export const NurseryReportsList: FC = () => {
         <Divider />
       </Stack>
 
-      <List actions={<ListActions onExport={handleExport} />} filters={filters}>
+      <List actions={<ListActions onExport={openExportDialog} />} filters={filters}>
         <NurseryReportDataGrid />
       </List>
 
+      <FrameworkSelectionDialog {...frameworkDialogProps} />
+
       <ExportProcessingAlert show={exporting} />
     </>
   );