From cd7f7f7f93526053325058e8668d852958204762 Mon Sep 17 00:00:00 2001
From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Date: Thu, 26 Jun 2025 08:32:36 -0500
Subject: [PATCH] i18n translated label fixes

---
 web/src/components/filter/SearchFilterGroup.tsx       |  4 +---
 web/src/components/input/InputWithTags.tsx            |  9 +++------
 .../components/overlay/detail/ReviewDetailDialog.tsx  |  7 ++-----
 .../components/overlay/detail/SearchDetailDialog.tsx  | 11 +++++------
 4 files changed, 11 insertions(+), 20 deletions(-)

diff --git a/web/src/components/filter/SearchFilterGroup.tsx b/web/src/components/filter/SearchFilterGroup.tsx
index 4e1f98ebe..198f27b63 100644
--- a/web/src/components/filter/SearchFilterGroup.tsx
+++ b/web/src/components/filter/SearchFilterGroup.tsx
@@ -264,9 +264,7 @@ function GeneralFilterButton({
     }
 
     if (selectedLabels.length == 1) {
-      return t(selectedLabels[0], {
-        ns: "objects",
-      });
+      return getTranslatedLabel(selectedLabels[0]);
     }
 
     return t("labels.count", {
diff --git a/web/src/components/input/InputWithTags.tsx b/web/src/components/input/InputWithTags.tsx
index ab31e1808..0e29c3015 100644
--- a/web/src/components/input/InputWithTags.tsx
+++ b/web/src/components/input/InputWithTags.tsx
@@ -52,6 +52,7 @@ import useSWR from "swr";
 import { FrigateConfig } from "@/types/frigateConfig";
 import { MdImageSearch } from "react-icons/md";
 import { useTranslation } from "react-i18next";
+import { getTranslatedLabel } from "@/utils/i18n";
 
 type InputWithTagsProps = {
   inputFocused: boolean;
@@ -419,9 +420,7 @@ export default function InputWithTags({
         ? t("button.yes", { ns: "common" })
         : t("button.no", { ns: "common" });
     } else if (filterType === "labels") {
-      return t(filterValues as string, {
-        ns: "objects",
-      });
+      return getTranslatedLabel(filterValues as string);
     } else if (filterType === "search_type") {
       return t("filter.searchType." + (filterValues as string));
     } else {
@@ -828,9 +827,7 @@ export default function InputWithTags({
                           >
                             {t("filter.label." + filterType)}:{" "}
                             {filterType === "labels"
-                              ? t(value, {
-                                  ns: "objects",
-                                })
+                              ? getTranslatedLabel(value)
                               : value.replaceAll("_", " ")}
                             <button
                               onClick={() =>
diff --git a/web/src/components/overlay/detail/ReviewDetailDialog.tsx b/web/src/components/overlay/detail/ReviewDetailDialog.tsx
index a30ad8989..cb976d8e0 100644
--- a/web/src/components/overlay/detail/ReviewDetailDialog.tsx
+++ b/web/src/components/overlay/detail/ReviewDetailDialog.tsx
@@ -42,6 +42,7 @@ import { TooltipPortal } from "@radix-ui/react-tooltip";
 import { LuSearch } from "react-icons/lu";
 import useKeyboardListener from "@/hooks/use-keyboard-listener";
 import { Trans, useTranslation } from "react-i18next";
+import { getTranslatedLabel } from "@/utils/i18n";
 
 type ReviewDetailDialogProps = {
   review?: ReviewSegment;
@@ -328,11 +329,7 @@ export default function ReviewDetailDialog({
                         ns="views/explore"
                         values={{
                           objects: missingObjects
-                            .map((x) =>
-                              t(x, {
-                                ns: "objects",
-                              }),
-                            )
+                            .map((x) => getTranslatedLabel(x))
                             .join(", "),
                         }}
                       >
diff --git a/web/src/components/overlay/detail/SearchDetailDialog.tsx b/web/src/components/overlay/detail/SearchDetailDialog.tsx
index 30711613f..acde73954 100644
--- a/web/src/components/overlay/detail/SearchDetailDialog.tsx
+++ b/web/src/components/overlay/detail/SearchDetailDialog.tsx
@@ -77,6 +77,7 @@ import { Trans, useTranslation } from "react-i18next";
 import { TbFaceId } from "react-icons/tb";
 import { useIsAdmin } from "@/hooks/use-is-admin";
 import FaceSelectionDialog from "../FaceSelectionDialog";
+import { getTranslatedLabel } from "@/utils/i18n";
 
 const SEARCH_TABS = [
   "details",
@@ -717,9 +718,7 @@ function ObjectDetailsTab({
             <div className="text-sm text-primary/40">{t("details.label")}</div>
             <div className="flex flex-row items-center gap-2 text-sm smart-capitalize">
               {getIconForLabel(search.label, "size-4 text-primary")}
-              {t(search.label, {
-                ns: "objects",
-              })}
+              {getTranslatedLabel(search.label)}
               {search.sub_label && ` (${search.sub_label})`}
               {isAdmin && search.end_time && (
                 <Tooltip>
@@ -1167,9 +1166,9 @@ export function ObjectSnapshotTab({
                                 ns="components/dialog"
                                 values={{
                                   untranslatedLabel: search?.label,
-                                  translatedLabel: t(search?.label, {
-                                    ns: "objects",
-                                  }),
+                                  translatedLabel: getTranslatedLabel(
+                                    search?.label,
+                                  ),
                                 }}
                               >
                                 explore.plus.review.question.ask_full