Move separate strings for table component from page

UN-OCHA · Jun 23, 2022 · 0f0e73b · 0f0e73b
1 parent 8af50bd
commit 0f0e73b
Show file tree

Hide file tree

Showing 3 changed files with 62 additions and 60 deletions.
diff --git a/apps/hpc-ftsadmin/src/app/components/flows-table.tsx b/apps/hpc-ftsadmin/src/app/components/flows-table.tsx
@@ -41,7 +41,7 @@ export interface FlowsTableProps {
   headers: {
     id: HeaderId;
     sortable?: boolean;
-    label: keyof Strings['routes']['flows']['table']['headers'];
+    label: keyof Strings['components']['flowsTable']['headers'];
   }[];
 }
 
@@ -129,7 +129,7 @@ export default function FlowsTable(props: FlowsTableProps) {
       rd[0].date && (
         <Tooltip
           title={t
-            .t(lang, (s) => s.routes.flows.table.reportTooltip)
+            .t(lang, (s) => s.components.flowsTable.reportTooltip)
             .replace('{organization}', org.name)
             .replace(
               '{date}',
@@ -156,7 +156,7 @@ export default function FlowsTable(props: FlowsTableProps) {
             ...t.get(lang, (s) => s.components.loader),
             notFound: {
               ...t.get(lang, (s) => s.components.notFound),
-              ...t.get(lang, (s) => s.routes.flows.table.notFound),
+              ...t.get(lang, (s) => s.components.flowsTable.notFound),
             },
           }}
         >
@@ -182,17 +182,18 @@ export default function FlowsTable(props: FlowsTableProps) {
                             onClick={() => handleSort(header.id)}
                           >
                             <span className={CLASSES.VISUALLY_HIDDEN}>
-                              {t.t(lang, (s) => s.routes.flows.table.sortBy)}
+                              {t.t(lang, (s) => s.components.flowsTable.sortBy)}
                             </span>
                             {t.t(
                               lang,
-                              (s) => s.routes.flows.table.headers[header.label]
+                              (s) =>
+                                s.components.flowsTable.headers[header.label]
                             )}
                           </TableSortLabel>
                         ) : (
                           t.t(
                             lang,
-                            (s) => s.routes.flows.table.headers[header.label]
+                            (s) => s.components.flowsTable.headers[header.label]
                           )
                         )}
                       </TableCell>
@@ -342,7 +343,8 @@ export default function FlowsTable(props: FlowsTableProps) {
                                     label={[
                                       t.t(
                                         lang,
-                                        (s) => s.routes.flows.table.restricted
+                                        (s) =>
+                                          s.components.flowsTable.restricted
                                       ),
                                     ]}
                                     sx={chipSpacing}
@@ -356,7 +358,7 @@ export default function FlowsTable(props: FlowsTableProps) {
                                     label={[
                                       t.t(
                                         lang,
-                                        (s) => s.routes.flows.table.inactive
+                                        (s) => s.components.flowsTable.inactive
                                       ),
                                     ]}
                                     size="small"
@@ -368,7 +370,7 @@ export default function FlowsTable(props: FlowsTableProps) {
                                     label={[
                                       t.t(
                                         lang,
-                                        (s) => s.routes.flows.table.child
+                                        (s) => s.components.flowsTable.child
                                       ),
                                     ]}
                                     size="small"
@@ -381,7 +383,7 @@ export default function FlowsTable(props: FlowsTableProps) {
                                     label={[
                                       t.t(
                                         lang,
-                                        (s) => s.routes.flows.table.parent
+                                        (s) => s.components.flowsTable.parent
                                       ),
                                     ]}
                                     size="small"

diff --git a/apps/hpc-ftsadmin/src/i18n/langs/en.json b/apps/hpc-ftsadmin/src/i18n/langs/en.json
@@ -42,38 +42,38 @@
     "unsupportedBrowser": {
       "title": "Unsupported Browser!",
       "info": "Unfortunately, your current browser is not supported. Please switch to either Firefox or Google Chrome. To do this, simply copy the form address (URL) above, then open Firefox or Chrome, and paste the address into the browser."
+    },
+    "flowsTable": {
+      "headers": {
+        "id": "ID",
+        "updatedCreated": "Updated/Created",
+        "dataProvider": "Data Provider",
+        "amountUSD": "Amount USD",
+        "sourceOrganization": "Source Organization",
+        "destinationOrganization": "Destination Organization",
+        "destinationPlan": "Destination Plan",
+        "destinationCountry": "Destination Country",
+        "destinationYear": "Destination Year",
+        "details": "Details"
+      },
+      "restricted": "restricted",
+      "inactive": "inactive",
+      "child": "child",
+      "parent": "parent",
+      "notFound": {
+        "title": "Flows not found",
+        "info": "We were unable to load flows"
+      },
+      "reportTooltip": "reported by {organization} on {date} via {channel}",
+      "sortBy": "Sort by"
     }
   },
   "navigation": {
     "flows": "Flows"
   },
   "routes": {
     "flows": {
-      "title": "Search funding flows",
-      "table": {
-        "headers": {
-          "id": "ID",
-          "updatedCreated": "Updated/Created",
-          "dataProvider": "Data Provider",
-          "amountUSD": "Amount USD",
-          "sourceOrganization": "Source Organization",
-          "destinationOrganization": "Destination Organization",
-          "destinationPlan": "Destination Plan",
-          "destinationCountry": "Destination Country",
-          "destinationYear": "Destination Year",
-          "details": "Details"
-        },
-        "restricted": "restricted",
-        "inactive": "inactive",
-        "child": "child",
-        "parent": "parent",
-        "notFound": {
-          "title": "Flows not found",
-          "info": "We were unable to load flows"
-        },
-        "reportTooltip": "reported by {organization} on {date} via {channel}",
-        "sortBy": "Sort by"
-      }
+      "title": "Search funding flows"
     }
   }
 }
diff --git a/apps/hpc-ftsadmin/src/i18n/langs/fr.json b/apps/hpc-ftsadmin/src/i18n/langs/fr.json
@@ -42,38 +42,38 @@
     "unsupportedBrowser": {
       "title": "Navigateur non compatible! ",
       "info": "Malheureusement, votre présent navigateur n’est pas compatible. Veuillez utiliser Firefox ou Chrome. Pour ce faire, simplement copiez le lien (URL) dessus, ouvrez Firefox, ou Chrome, et collez le lien sur la barre d’adresse du nouveau navigateur."
+    },
+    "flowsTable": {
+      "headers": {
+        "id": "ID",
+        "updatedCreated": "Mise à jour/Création",
+        "dataProvider": "Fournisseur de données",
+        "amountUSD": "Montant USD",
+        "sourceOrganization": "Organisation source",
+        "destinationOrganization": "Organisation de destination",
+        "destinationPlan": "Destination Plan",
+        "destinationCountry": "Pays de destination",
+        "destinationYear": "Année de destination",
+        "details": "Détails"
+      },
+      "restricted": "restreint",
+      "inactive": "inactif",
+      "child": "enfant",
+      "parent": "parent",
+      "notFound": {
+        "title": "Flux introuvables",
+        "info": "Nous n’avons pas pu charger les flux"
+      },
+      "reportTooltip": "signalé par {organization} le {date} via {channel}",
+      "sortBy": "Trier par"
     }
   },
   "navigation": {
     "flows": "Flux"
   },
   "routes": {
     "flows": {
-      "title": "Rechercher des flux de financement",
-      "table": {
-        "headers": {
-          "id": "ID",
-          "updatedCreated": "Mise à jour/Création",
-          "dataProvider": "Fournisseur de données",
-          "amountUSD": "Montant USD",
-          "sourceOrganization": "Organisation source",
-          "destinationOrganization": "Organisation de destination",
-          "destinationPlan": "Destination Plan",
-          "destinationCountry": "Pays de destination",
-          "destinationYear": "Année de destination",
-          "details": "Détails"
-        },
-        "restricted": "restreint",
-        "inactive": "inactif",
-        "child": "enfant",
-        "parent": "parent",
-        "notFound": {
-          "title": "Flux introuvables",
-          "info": "Nous n’avons pas pu charger les flux"
-        },
-        "reportTooltip": "signalé par {organization} le {date} via {channel}",
-        "sortBy": "Trier par"
-      }
+      "title": "Rechercher des flux de financement"
     }
   }
 }