refactor: consolidate English translations (#6640)

packages/widgets/src/clock/advanced-view.tsx

@@ -15,7 +15,7 @@ import {
 import { IconAlertTriangle, IconClock } from "@tabler/icons-react";
 import type { Dayjs } from "dayjs";
 
-import { useCurrentIntlLocale, useScopedI18n } from "@homarr/translation/client";
+import { useCurrentIntlLocale, useI18n } from "@homarr/translation/client";
 
 import { formatLocalizedDate, formatLocalizedTime } from "../common/locale";
 import type { WidgetComponentProps } from "../definition";
@@ -47,7 +47,7 @@ export const AdvancedClockView = ({
   primaryTimeZone,
   primaryTimeZoneInvalid,
 }: AdvancedClockViewProps) => {
-  const t = useScopedI18n("widget.clock");
+  const t = useI18n("widget.clock");
   const primaryLabel = getPrimaryLabel(options, t);
   const primary: WorldClockTime = {
     id: "primary",
@@ -95,7 +95,7 @@ interface ModeProps {
 
 const PrimaryClock = ({ now, options, primary }: Pick<ModeProps, "now" | "options" | "primary">) => {
   const locale = useCurrentIntlLocale();
-  const t = useScopedI18n("widget.clock");
+  const t = useI18n("widget.clock");
   const primaryTime = primary.zonedTime;
   if (!primaryTime || primary.phase === null || primary.minuteOfDay === null) return null;
 
@@ -152,7 +152,7 @@ const PrimaryClock = ({ now, options, primary }: Pick<ModeProps, "now" | "option
 };
 
 const OverviewMode = ({ now, options, primary, cities }: ModeProps) => {
-  const t = useScopedI18n("widget.clock");
+  const t = useI18n("widget.clock");
   if (cities.length === 0) return <EmptyCities />;
 
   return (
@@ -218,7 +218,7 @@ const ClockTime = ({
   compact = false,
 }: Omit<ClockEntryProps, "primaryOffset"> & { primary?: boolean; compact?: boolean }) => {
   const locale = useCurrentIntlLocale();
-  const t = useScopedI18n("widget.clock");
+  const t = useI18n("widget.clock");
   if (!entry.zonedTime) return null;
   let formattedTime = formatLocalizedTime(now, locale, {
     hour12: clockTimeFormatUses12Hours(options.customTimeFormat, options.is24HourFormat),
@@ -257,7 +257,7 @@ const ClockTime = ({
 
 const DayAndOffset = ({ entry, now, primaryOffset }: Pick<ClockEntryProps, "entry" | "now" | "primaryOffset">) => {
   const locale = useCurrentIntlLocale();
-  const t = useScopedI18n("widget.clock");
+  const t = useI18n("widget.clock");
   if (entry.dayDifference === null || entry.utcOffset === null) return null;
   const dayRelation = getDayRelation(entry.dayDifference, t);
   const date = formatLocalizedDate(now, locale, {
@@ -280,7 +280,7 @@ const DayAndOffset = ({ entry, now, primaryOffset }: Pick<ClockEntryProps, "entr
 };
 
 const InvalidTimeZone = ({ entry }: { entry: WorldClockTime }) => {
-  const t = useScopedI18n("widget.clock");
+  const t = useI18n("widget.clock");
   return (
     <Paper component="li" withBorder radius="md" p="md">
       <Group gap="xs" wrap="nowrap">
@@ -297,7 +297,7 @@ const InvalidTimeZone = ({ entry }: { entry: WorldClockTime }) => {
 };
 
 const EmptyCities = () => {
-  const t = useScopedI18n("widget.clock");
+  const t = useI18n("widget.clock");
   return (
     <Paper withBorder radius="md" p="xl">
       <Text c="dimmed" ta="center">
@@ -307,7 +307,7 @@ const EmptyCities = () => {
   );
 };
 
-type ScopedClockTranslator = ReturnType<typeof useScopedI18n<"widget.clock">>;
+type ScopedClockTranslator = ReturnType<typeof useI18n<"widget.clock">>;
 
 const getDayRelation = (difference: number, t: ScopedClockTranslator) => {
   if (difference < 0) return t("worldClock.yesterday");

packages/widgets/src/clock/time-of-day-bar.tsx

@@ -1,6 +1,6 @@
 import { Badge, Box, Group, Progress, Stack, Text } from "@mantine/core";
 
-import { useScopedI18n } from "@homarr/translation/client";
+import { useI18n } from "@homarr/translation/client";
 
 import type { TimeOfDayPhase } from "./world-clock";
 
@@ -36,7 +36,7 @@ export const TimeOfDayBar = ({
   showTicks = false,
   label,
 }: TimeOfDayBarProps) => {
-  const t = useScopedI18n("widget.clock");
+  const t = useI18n("widget.clock");
   const progress = Math.max(0, Math.min(100, (minuteOfDay / 1440) * 100));
   const remainingMinutes = Math.max(0, 1440 - Math.floor(minuteOfDay));
   const remainingHours = Math.floor(remainingMinutes / 60);

packages/widgets/src/clock/weather-summary.tsx

@@ -1,7 +1,7 @@
 import { Box, Group, Loader, Stack, Text } from "@mantine/core";
 
 import { clientApi } from "@homarr/api/client";
-import { useI18n, useScopedI18n } from "@homarr/translation/client";
+import { useI18n } from "@homarr/translation/client";
 
 import { isInitialWidgetQueryPending } from "../common/query-state";
 import { WidgetQueryErrorIndicator } from "../common/query-state-indicator";
@@ -26,7 +26,7 @@ export const ClockWeatherSummary = ({
   detailed,
 }: ClockWeatherSummaryProps) => {
   const t = useI18n();
-  const tCommon = useScopedI18n("common");
+  const tCommon = useI18n("common");
   const weatherQuery = clientApi.widget.weather.atLocation.useQuery({ latitude, longitude });
   const weather = weatherQuery.data;