chore: add missing translations

homarr-labs · May 29, 2024 · a533c20 · a533c20
1 parent 2b06d44
commit a533c20
Showing 1 changed file with 11 additions and 7 deletions.
diff --git a/apps/nextjs/src/app/[locale]/manage/tools/docker/DockerTable.tsx b/apps/nextjs/src/app/[locale]/manage/tools/docker/DockerTable.tsx
@@ -9,13 +9,16 @@ import { MantineReactTable, useMantineReactTable } from "mantine-react-table";
 import type { RouterOutputs } from "@homarr/api";
 import { useTimeAgo } from "@homarr/common";
 import type { DockerContainerState } from "@homarr/definitions";
-import { useScopedI18n } from "@homarr/translation/client";
+import type { TranslationFunction } from "@homarr/translation";
+import { useI18n, useScopedI18n } from "@homarr/translation/client";
 import { OverflowBadge } from "@homarr/ui";
 
-const columns: MRT_ColumnDef<RouterOutputs["docker"]["getContainers"]["containers"][number]>[] = [
+const createColumns = (
+  t: TranslationFunction,
+): MRT_ColumnDef<RouterOutputs["docker"]["getContainers"]["containers"][number]>[] => [
   {
     accessorKey: "name",
-    header: "Name",
+    header: t("docker.field.name.label"),
     Cell({ renderedCellValue, row }) {
       return (
         <Group gap="xs">
@@ -29,15 +32,15 @@ const columns: MRT_ColumnDef<RouterOutputs["docker"]["getContainers"]["container
   },
   {
     accessorKey: "state",
-    header: "Status",
+    header: t("docker.field.state.label"),
     size: 120,
     Cell({ cell }) {
       return <ContainerStateBadge state={cell.row.original.state} />;
     },
   },
   {
     accessorKey: "image",
-    header: "Image",
+    header: t("docker.field.containerImage.label"),
     maxSize: 200,
     Cell({ renderedCellValue }) {
       return (
@@ -49,7 +52,7 @@ const columns: MRT_ColumnDef<RouterOutputs["docker"]["getContainers"]["container
   },
   {
     accessorKey: "ports",
-    header: "Ports",
+    header: t("docker.field.ports.label"),
     Cell({ cell }) {
       return (
         <OverflowBadge overflowCount={1} data={cell.row.original.ports.map((port) => port.PrivatePort.toString())} />
@@ -59,6 +62,7 @@ const columns: MRT_ColumnDef<RouterOutputs["docker"]["getContainers"]["container
 ];
 
 export function DockerTable({ containers, timestamp }: RouterOutputs["docker"]["getContainers"]) {
+  const t = useI18n();
   const tDocker = useScopedI18n("docker");
   const relativeTime = useTimeAgo(timestamp);
   const table = useMantineReactTable({
@@ -94,7 +98,7 @@ export function DockerTable({ containers, timestamp }: RouterOutputs["docker"]["
       );
     },
 
-    columns,
+    columns: createColumns(t),
   });
   return (
     <Stack>