happyz
/
memos
mirror of https://github.com/usememos/memos.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fix(web): make MonthNavigator month label reactive to language changes 

Use useTranslation() hook instead of the static i18n import so that
the month label re-computes when the language changes.
This commit is contained in:
Steven 2026-02-23 11:04:04 +08:00
parent 704503e556
commit 1cea9b0a78
1 changed files with 3 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
web/src/components/StatisticsView/MonthNavigator.tsx
View File

@ -4,11 +4,12 @@ import { memo, useCallback, useMemo, useState } from "react";
import { YearCalendar } from "@/components/ActivityCalendar";
import { Button } from "@/components/ui/button";
import { Dialog, DialogContent, DialogTitle, DialogTrigger } from "@/components/ui/dialog";
import i18n from "@/i18n";
import { useTranslation } from "react-i18next";
import { addMonths, formatMonth, getMonthFromDate, getYearFromDate, setYearAndMonth } from "@/lib/calendar-utils";
import type { MonthNavigatorProps } from "@/types/statistics";
export const MonthNavigator = memo(({ visibleMonth, onMonthChange, activityStats }: MonthNavigatorProps) => {
const { i18n } = useTranslation();
const [isOpen, setIsOpen] = useState(false);
const { currentMonth, currentYear, currentMonthNum } = useMemo(
@ -20,7 +21,7 @@ export const MonthNavigator = memo(({ visibleMonth, onMonthChange, activityStats
[visibleMonth],
);
const monthLabel = useMemo(() => currentMonth.toLocaleString(i18n.language, { year: "numeric", month: "long" }), [currentMonth]);
const monthLabel = useMemo(() => currentMonth.toLocaleString(i18n.language, { year: "numeric", month: "long" }), [currentMonth, i18n.language]);
const handlePrevMonth = useCallback(() => onMonthChange(addMonths(visibleMonth, -1)), [visibleMonth, onMonthChange]);
const handleNextMonth = useCallback(() => onMonthChange(addMonths(visibleMonth, 1)), [visibleMonth, onMonthChange]);