refactor: simplify CalendarPage and CalendarHeader components by removing unused props

- Removed the handleGoToToday function and its associated prop from CalendarPage, streamlining the component's logic.
- Eliminated the isLoading and onRefresh props from CalendarHeader, enhancing clarity and reducing complexity.
- Updated internationalization messages to remove references to "Today" and "Refresh," aligning with the component changes.
This commit is contained in:
2026-03-03 16:23:49 +03:00
parent 95f65141e1
commit 95c9e23c33
3 changed files with 11 additions and 68 deletions

View File

@@ -123,11 +123,6 @@ export function CalendarPage({ isAllowed, initDataRaw }: CalendarPageProps) {
setSelectedDay(null); setSelectedDay(null);
}, [setSelectedDay]); }, [setSelectedDay]);
const handleGoToToday = useCallback(() => {
setCurrentMonth(new Date());
retry();
}, [setCurrentMonth, retry]);
const readyCalledRef = useRef(false); const readyCalledRef = useRef(false);
// Signal Telegram to hide loading when the first load finishes (loading goes true -> false). // Signal Telegram to hide loading when the first load finishes (loading goes true -> false).
useEffect(() => { useEffect(() => {
@@ -145,10 +140,7 @@ export function CalendarPage({ isAllowed, initDataRaw }: CalendarPageProps) {
> >
<CalendarHeader <CalendarHeader
month={currentMonth} month={currentMonth}
isLoading={false}
disabled={navDisabled} disabled={navDisabled}
onGoToToday={handleGoToToday}
onRefresh={retry}
onPrevMonth={handlePrevMonth} onPrevMonth={handlePrevMonth}
onNextMonth={handleNextMonth} onNextMonth={handleNextMonth}
/> />

View File

@@ -11,7 +11,6 @@ import { cn } from "@/lib/utils";
import { import {
ChevronLeft as ChevronLeftIcon, ChevronLeft as ChevronLeftIcon,
ChevronRight as ChevronRightIcon, ChevronRight as ChevronRightIcon,
RefreshCw as RefreshCwIcon,
} from "lucide-react"; } from "lucide-react";
export interface CalendarHeaderProps { export interface CalendarHeaderProps {
@@ -19,31 +18,14 @@ export interface CalendarHeaderProps {
month: Date; month: Date;
/** Whether month navigation is disabled (e.g. during loading). */ /** Whether month navigation is disabled (e.g. during loading). */
disabled?: boolean; disabled?: boolean;
/** When true, show a compact loading spinner next to the month title (e.g. while fetching new month). */
isLoading?: boolean;
/** When provided and displayed month is not the current month, show a "Today" control that calls this. */
onGoToToday?: () => void;
/** When provided, show a refresh icon that calls this (e.g. to refetch month data). */
onRefresh?: () => void;
onPrevMonth: () => void; onPrevMonth: () => void;
onNextMonth: () => void; onNextMonth: () => void;
className?: string; className?: string;
} }
function isCurrentMonth(month: Date): boolean {
const now = new Date();
return (
month.getFullYear() === now.getFullYear() &&
month.getMonth() === now.getMonth()
);
}
export function CalendarHeader({ export function CalendarHeader({
month, month,
disabled = false, disabled = false,
isLoading = false,
onGoToToday,
onRefresh,
onPrevMonth, onPrevMonth,
onNextMonth, onNextMonth,
className, className,
@@ -52,7 +34,6 @@ export function CalendarHeader({
const year = month.getFullYear(); const year = month.getFullYear();
const monthIndex = month.getMonth(); const monthIndex = month.getMonth();
const labels = weekdayLabels(); const labels = weekdayLabels();
const showToday = Boolean(onGoToToday) && !isCurrentMonth(month);
return ( return (
<header className={cn("flex flex-col", className)}> <header className={cn("flex flex-col", className)}>
@@ -76,44 +57,18 @@ export function CalendarHeader({
> >
{monthName(monthIndex)} {year} {monthName(monthIndex)} {year}
</h1> </h1>
{showToday && (
<button
type="button"
onClick={onGoToToday}
disabled={disabled}
className="text-[0.8rem] font-medium text-accent hover:underline focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2 disabled:opacity-50"
aria-label={t("nav.today")}
>
{t("nav.today")}
</button>
)}
</div>
<div className="flex items-center gap-1">
{onRefresh && (
<Button
type="button"
variant="secondary"
size="icon"
className="size-10 rounded-[10px] bg-surface text-accent hover:bg-[var(--surface-hover)] focus-visible:outline-accent active:scale-95 disabled:opacity-50"
aria-label={t("nav.refresh")}
disabled={disabled || isLoading}
onClick={onRefresh}
>
<RefreshCwIcon className="size-5" aria-hidden />
</Button>
)}
<Button
type="button"
variant="secondary"
size="icon"
className="size-10 rounded-[10px] bg-surface text-accent hover:bg-[var(--surface-hover)] focus-visible:outline-accent active:scale-95 disabled:opacity-50"
aria-label={t("nav.next_month")}
disabled={disabled}
onClick={onNextMonth}
>
<ChevronRightIcon className="size-5" aria-hidden />
</Button>
</div> </div>
<Button
type="button"
variant="secondary"
size="icon"
className="size-10 rounded-[10px] bg-surface text-accent hover:bg-[var(--surface-hover)] focus-visible:outline-accent active:scale-95 disabled:opacity-50"
aria-label={t("nav.next_month")}
disabled={disabled}
onClick={onNextMonth}
>
<ChevronRightIcon className="size-5" aria-hidden />
</Button>
</div> </div>
<div className="grid grid-cols-7 gap-0.5 mb-1.5 text-center text-[0.75rem] text-muted"> <div className="grid grid-cols-7 gap-0.5 mb-1.5 text-center text-[0.75rem] text-muted">
{labels.map((label, i) => ( {labels.map((label, i) => (

View File

@@ -16,8 +16,6 @@ export const MESSAGES: Record<Lang, Record<string, string>> = {
"error.retry": "Retry", "error.retry": "Retry",
"nav.prev_month": "Previous month", "nav.prev_month": "Previous month",
"nav.next_month": "Next month", "nav.next_month": "Next month",
"nav.today": "Today",
"nav.refresh": "Refresh",
"weekdays.mon": "Mon", "weekdays.mon": "Mon",
"weekdays.tue": "Tue", "weekdays.tue": "Tue",
"weekdays.wed": "Wed", "weekdays.wed": "Wed",
@@ -91,8 +89,6 @@ export const MESSAGES: Record<Lang, Record<string, string>> = {
"error.retry": "Повторить", "error.retry": "Повторить",
"nav.prev_month": "Предыдущий месяц", "nav.prev_month": "Предыдущий месяц",
"nav.next_month": "Следующий месяц", "nav.next_month": "Следующий месяц",
"nav.today": "Сегодня",
"nav.refresh": "Обновить",
"weekdays.mon": "Пн", "weekdays.mon": "Пн",
"weekdays.tue": "Вт", "weekdays.tue": "Вт",
"weekdays.wed": "Ср", "weekdays.wed": "Ср",