refactor: consolidate English translations (#6640)

packages/widgets/src/custom-api/component.tsx

@@ -6,7 +6,7 @@ import { IconAlertTriangle } from "@tabler/icons-react";
 
 import { clientApi } from "@homarr/api/client";
 import { useSession } from "@homarr/auth/client";
-import { useScopedI18n } from "@homarr/translation/client";
+import { useI18n } from "@homarr/translation/client";
 import { Link } from "@homarr/ui";
 
 import type { WidgetComponentProps } from "../definition";
@@ -20,8 +20,8 @@ export default function CustomApiWidget({
   isEditMode,
   removeItem,
 }: WidgetComponentProps<"customApi">) {
-  const t = useScopedI18n("widget.customApi");
-  const tCustomJsx = useScopedI18n("widget.customApi.customJsx");
+  const t = useI18n("widget.customApi");
+  const tCustomJsx = useI18n("widget.customApi.customJsx");
   const { data: session } = useSession();
   const isAdmin = session?.user.permissions.includes("admin") ?? false;
   const definitionId = options.definitionId;

packages/widgets/src/custom-api/custom-jsx-display.spec.ts

@@ -25,7 +25,7 @@ import { SAFE_TABLER_ICON_NAMES } from "./jsx-icon-adapter";
 const CUSTOM_WIDGET_COMPONENTS = createCustomWidgetComponents({ copy: "Copy", copied: "Copied" });
 
 vi.mock("@homarr/translation/client", () => ({
-  useScopedI18n: () => (key: string, params?: Record<string, string>) =>
+  useI18n: () => (key: string, params?: Record<string, string>) =>
     key === "templateWarnings" ? `${params?.count ?? "0"} template warning(s):` : key,
 }));
 

packages/widgets/src/custom-api/custom-jsx-display.tsx

@@ -2,7 +2,7 @@
 
 import { useCallback, useEffect, useMemo, useState } from "react";
 
-import { useScopedI18n } from "@homarr/translation/client";
+import { useI18n } from "@homarr/translation/client";
 import type { CustomWidgetPublishedQueryState } from "@homarr/custom-widgets/runtime";
 import { CustomJsxRenderer, parseRequestCapabilities } from "@homarr/custom-widgets/runtime";
 
@@ -12,9 +12,13 @@ import { InactiveWidgetDefinitionProvider, WidgetDefinitionProvider } from "./wi
 export { CUSTOM_JSX_METHOD_COLORS } from "@homarr/custom-widgets/runtime";
 
 export default function CustomJsxDisplay({ data }: { data: Record<string, unknown> }) {
-  const t = useScopedI18n("widget.customApi.customJsx");
+  const t = useI18n("widget.customApi.customJsx");
+  const actionT = useI18n("common.action");
   const capabilities = useMemo(() => parseRequestCapabilities(data.requestCapabilities), [data.requestCapabilities]);
-  const components = useMemo(() => createCustomWidgetComponents({ copy: t("copy"), copied: t("copied") }), [t]);
+  const components = useMemo(
+    () => createCustomWidgetComponents({ copy: actionT("copy"), copied: t("copied") }),
+    [actionT, t],
+  );
   const [queryState, setQueryState] = useState<Record<string, CustomWidgetPublishedQueryState>>({});
   useEffect(
     () => setQueryState({}),

packages/widgets/src/custom-api/widget-definition-context.tsx

@@ -12,7 +12,7 @@ import type {
 import { CustomWidgetRuntimeProvider } from "@homarr/custom-widgets/runtime";
 import { useConfirmModal } from "@homarr/modals";
 import { showErrorNotification, showSuccessNotification } from "@homarr/notifications";
-import { useScopedI18n } from "@homarr/translation/client";
+import { useI18n } from "@homarr/translation/client";
 import { useQueryClient } from "@tanstack/react-query";
 
 interface WidgetDefinitionProviderProps {
@@ -36,7 +36,8 @@ const INACTIVE_PORT: CustomWidgetRuntimePort = {
 };
 
 const useRuntimeMessages = (): CustomWidgetRuntimeMessages => {
-  const t = useScopedI18n("widget.customApi.customJsx");
+  const t = useI18n("widget.customApi.customJsx");
+  const actionT = useI18n("common.action");
   return {
     requestIdRequired: t("requestIdRequired"),
     unsavedPreview: t("unsavedPreview"),
@@ -51,7 +52,7 @@ const useRuntimeMessages = (): CustomWidgetRuntimeMessages => {
     actionCompleted: t("actionCompleted"),
     confirmDelete: t("confirmDelete"),
     toggle: t("toggle"),
-    refresh: t("refresh"),
+    refresh: actionT("refresh"),
   };
 };