localize emissions entries on all tables

Open-Earth-Foundation · Jan 20, 2025 · 2277624 · 2277624
1 parent a635a8b
commit 2277624
Show file tree

Hide file tree

Showing 6 changed files with 40 additions and 12 deletions.
diff --git a/app/src/components/Tabs/Activity/activity-accordion.tsx b/app/src/components/Tabs/Activity/activity-accordion.tsx
@@ -31,6 +31,8 @@ import React, { FC, useMemo } from "react";
 import { MdModeEditOutline, MdMoreVert } from "react-icons/md";
 import { FiTrash2 } from "react-icons/fi";
 import { ExtraField, findMethodology, Methodology } from "@/util/form-schema";
+import { useParams } from "next/navigation";
+import { regionalLocales } from "@/util/constants";
 
 interface IActivityGroup {
   activityData: ActivityValue[];
@@ -61,6 +63,7 @@ const ActivityAccordion: FC<ActivityAccordionProps> = ({
   onEditActivity,
   referenceNumber,
 }) => {
+  const { lng } = useParams();
   // perform the group by logic when there's more than one activity.
   // split the data into groups
   // for each table group by the group by field
@@ -246,7 +249,13 @@ const ActivityAccordion: FC<ActivityAccordionProps> = ({
                     {parseFloat(activity?.activityData[title])}{" "}
                     {t(activity?.activityData[title + "-unit"])}
                   </Td>
-                  <Td>{convertKgToTonnes(activity?.co2eq)}</Td>
+                  <Td>
+                    {convertKgToTonnes(
+                      activity?.co2eq,
+                      null,
+                      regionalLocales[lng as string],
+                    )}
+                  </Td>
                   <Td>
                     <Popover>
                       <PopoverTrigger>
@@ -402,6 +411,8 @@ const ActivityAccordion: FC<ActivityAccordionProps> = ({
                                   acc + BigInt(curr.co2eq as bigint),
                                 0n,
                               ),
+                              null,
+                              regionalLocales[lng as string],
                             )}{" "}
                           </Text>
                         </Box>

diff --git a/app/src/components/Tabs/Activity/direct-measure-table.tsx b/app/src/components/Tabs/Activity/direct-measure-table.tsx
@@ -34,6 +34,8 @@ import {
   MANUAL_INPUT_HIERARCHY,
 } from "@/util/form-schema";
 import { AddIcon } from "@chakra-ui/icons";
+import { useParams } from "next/navigation";
+import { regionalLocales } from "@/util/constants";
 
 interface DirectMeasureTableProps {
   t: TFunction;
@@ -52,6 +54,7 @@ const DirectMeasureTable: FC<DirectMeasureTableProps> = ({
   t,
   showActivityModal,
 }) => {
+  const { lng } = useParams();
   const directMeasure = MANUAL_INPUT_HIERARCHY[referenceNumber as string]
     .directMeasure as DirectMeasure;
   const extraFields = directMeasure["extra-fields"] as ExtraField[];
@@ -134,18 +137,21 @@ const DirectMeasureTable: FC<DirectMeasureTableProps> = ({
                   {convertKgToTonnes(
                     activity?.activityData?.co2_amount * 1000,
                     "CO2e",
+                    regionalLocales[lng as string],
                   )}
                 </Td>
                 <Td isNumeric isTruncated>
                   {convertKgToTonnes(
                     activity?.activityData?.n2o_amount * 1000,
                     "N2O",
+                    regionalLocales[lng as string],
                   )}
                 </Td>
                 <Td isNumeric isTruncated>
                   {convertKgToTonnes(
                     activity?.activityData?.ch4_amount * 1000,
                     "CH4",
+                    regionalLocales[lng as string],
                   )}
                 </Td>
                 <Td>
@@ -292,6 +298,8 @@ const DirectMeasureTable: FC<DirectMeasureTableProps> = ({
                                   acc + BigInt(curr.co2eq as bigint),
                                 0n,
                               ),
+                              null,
+                              regionalLocales[lng as string],
                             )}{" "}
                           </Text>
                         </Box>

diff --git a/app/src/components/Tabs/Activity/emission-data-section.tsx b/app/src/components/Tabs/Activity/emission-data-section.tsx
@@ -35,6 +35,8 @@ import HeadingText from "@/components/heading-text";
 import { MdMoreVert } from "react-icons/md";
 import { FaNetworkWired } from "react-icons/fa";
 import { FiTrash2 } from "react-icons/fi";
+import { regionalLocales } from "@/util/constants";
+import { useParams } from "next/navigation";
 
 interface EmissionDataSectionProps {
   t: TFunction;
@@ -118,6 +120,8 @@ const EmissionDataSection = ({
     onAddActivityModalOpen();
   };
 
+  const { lng } = useParams();
+
   const renderSuggestedActivities = () => (
     <>
       {suggestedActivities.length ? (
@@ -357,7 +361,11 @@ const EmissionDataSection = ({
                       fontWeight="semibold"
                       fontSize="headline.md"
                     >
-                      {convertKgToTonnes(inventoryValue?.co2eq as bigint)}
+                      {convertKgToTonnes(
+                        inventoryValue?.co2eq as bigint,
+                        null,
+                        regionalLocales[lng as string],
+                      )}
                     </Text>
                   </Box>
                 </Box>

diff --git a/app/src/components/formatted-number-input.tsx b/app/src/components/formatted-number-input.tsx
@@ -8,6 +8,7 @@ import {
   NumberInputProps,
 } from "@chakra-ui/react";
 import { useParams } from "next/navigation";
+import { regionalLocales } from "@/util/constants";
 
 interface FormattedNumberInputProps extends NumberInputProps {
   control: Control<any, any>;
@@ -25,13 +26,6 @@ interface FormattedNumberInputProps extends NumberInputProps {
   t: Function;
 }
 
-const regionalLocales: Record<string, string> = {
-  es: "es-ES", // Spanish (Spain)
-  en: "en-US", // English (United States)
-  pt: "pt-PT", // Portuguese (Portugal)
-  de: "de-DE", // German (Germany)
-};
-
 function FormattedNumberInput({
   control,
   setError,

diff --git a/app/src/util/constants.ts b/app/src/util/constants.ts
@@ -3,7 +3,7 @@ import { PiPlant, PiTrashLight } from "react-icons/pi";
 import { TbBuildingCommunity } from "react-icons/tb";
 import { IconBaseProps } from "react-icons";
 import { LiaIndustrySolid } from "react-icons/lia";
-import { appTheme, SectorColors } from "@/lib/app-theme"; // Import the appTheme
+import { SectorColors } from "@/lib/app-theme"; // Import the appTheme
 
 export const maxPopulationYearDifference = 5;
 
@@ -136,3 +136,10 @@ export const getSectorByName = (name: string) =>
 
 export const getReferenceNumberByName = (name: keyof ISector) =>
   findBy("name", name)?.referenceNumber;
+
+export const regionalLocales: Record<string, string> = {
+  es: "es-ES", // Spanish (Spain)
+  en: "en-US", // English (United States)
+  pt: "pt-PT", // Portuguese (Portugal)
+  de: "de-DE", // German (Germany)
+};
diff --git a/app/src/util/helpers.ts b/app/src/util/helpers.ts
@@ -278,9 +278,9 @@ export function convertKgToKiloTonnes(
 
 export function convertKgToTonnes(
   valueInKg: number | Decimal | bigint,
-  gas?: string,
+  gas?: string | null,
+  locale = "en-US",
 ): string {
-  const locale = "en-US";
   const gasSuffix = gas ? ` ${gas}` : " CO2e";
 
   const kg = toDecimal(valueInKg);