fix(web): update time locale when language is changed

Pass i18n.language to time display components to ensure locale updates
when the user switches languages in UserMenu. Changes:

- MemoView: Pass i18n.language to toLocaleString() and <relative-time> lang attribute
- MonthNavigator: Wrap with observer to make component reactive to i18n.language changes

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Steven 2025-11-25 21:37:04 +08:00
parent ef6456a4f5
commit 8ec4c9ab63
2 changed files with 6 additions and 4 deletions

View file

@ -7,6 +7,7 @@ import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/comp
import useAsyncEffect from "@/hooks/useAsyncEffect";
import useCurrentUser from "@/hooks/useCurrentUser";
import useNavigateTo from "@/hooks/useNavigateTo";
import i18n from "@/i18n";
import { cn } from "@/lib/utils";
import { instanceStore, memoStore, userStore } from "@/store";
import { State } from "@/types/proto/api/v1/common";
@ -211,9 +212,9 @@ const MemoView: React.FC<Props> = observer((props: Props) => {
};
const displayTime = isArchived ? (
memo.displayTime?.toLocaleString()
memo.displayTime?.toLocaleString(i18n.language)
) : (
<relative-time datetime={memo.displayTime?.toISOString()} format={relativeTimeFormat}></relative-time>
<relative-time datetime={memo.displayTime?.toISOString()} lang={i18n.language} format={relativeTimeFormat}></relative-time>
);
return showEditor ? (

View file

@ -1,9 +1,10 @@
import dayjs from "dayjs";
import { ChevronLeftIcon, ChevronRightIcon } from "lucide-react";
import { observer } from "mobx-react-lite";
import i18n from "@/i18n";
import type { MonthNavigatorProps } from "@/types/statistics";
export const MonthNavigator = ({ visibleMonth, onMonthChange }: MonthNavigatorProps) => {
export const MonthNavigator = observer(({ visibleMonth, onMonthChange }: MonthNavigatorProps) => {
const currentMonth = dayjs(visibleMonth).toDate();
const handlePrevMonth = () => {
@ -29,4 +30,4 @@ export const MonthNavigator = ({ visibleMonth, onMonthChange }: MonthNavigatorPr
</div>
</div>
);
};
});