import { Habit, User } from '@/lib/types'; import { useHabits } from '@/hooks/useHabits'; import { useAtom } from 'jotai'; import { pomodoroAtom, settingsAtom, currentUserAtom } from '@/lib/atoms'; import { d2t, getNow, isHabitDueToday, hasPermission } from '@/lib/utils'; import { DropdownMenuItem, DropdownMenuSeparator } from '@/components/ui/dropdown-menu'; import { ContextMenuItem, ContextMenuSeparator } from '@/components/ui/context-menu'; import { Timer, Calendar, Pin, Edit, Archive, ArchiveRestore, Trash2 } from 'lucide-react'; import { useTranslations } from 'next-intl'; interface HabitContextMenuItemsProps { habit: Habit; onEditRequest: () => void; onDeleteRequest: () => void; context?: 'daily-overview' | 'habit-item'; onClose?: () => void; // Optional: To close the dropdown if an action is taken } export function HabitContextMenuItems({ habit, onEditRequest, onDeleteRequest, context = 'habit-item', onClose, }: HabitContextMenuItemsProps) { const t = useTranslations('HabitContextMenuItems'); const { saveHabit, archiveHabit, unarchiveHabit } = useHabits(); const [settings] = useAtom(settingsAtom); const [, setPomo] = useAtom(pomodoroAtom); const [currentUser] = useAtom(currentUserAtom); const canWrite = hasPermission(currentUser, 'habit', 'write'); // For UI disabling if not handled by useHabits' actions const canInteract = hasPermission(currentUser, 'habit', 'interact'); const MenuItemComponent = context === 'daily-overview' ? ContextMenuItem : DropdownMenuItem; const MenuSeparatorComponent = context === 'daily-overview' ? ContextMenuSeparator : DropdownMenuSeparator; const taskIsDueToday = habit.isTask ? isHabitDueToday({ habit, timezone: settings.system.timezone }) : false; const handleAction = (action: () => void) => { action(); onClose?.(); }; return ( <> {!habit.archived && ( handleAction(() => { setPomo((prev) => ({ ...prev, show: true, selectedHabitId: habit.id, })); })} > {t('startPomodoro')} )} {/* "Move to Today" option: Show if task is not due today */} {habit.isTask && !habit.archived && !taskIsDueToday && ( handleAction(() => { const today = getNow({ timezone: settings.system.timezone }); saveHabit({ ...habit, frequency: d2t({ dateTime: today }) }); })} > {t('moveToToday')} )} {/* "Move to Tomorrow" option: Show if task is due today OR not due today */} {habit.isTask && !habit.archived && ( handleAction(() => { const tomorrow = getNow({ timezone: settings.system.timezone }).plus({ days: 1 }); saveHabit({ ...habit, frequency: d2t({ dateTime: tomorrow }) }); })} > {t('moveToTomorrow')} )} {!habit.archived && ( handleAction(() => saveHabit({ ...habit, pinned: !habit.pinned }))} > {t(habit.pinned ? 'unpin' : 'pin')} )} {context === 'habit-item' && !habit.archived && ( // Edit button visible in dropdown only for habit-item context on small screens handleAction(onEditRequest)} className="sm:hidden" // Kept the sm:hidden for HabitItem specific responsive behavior disabled={!canWrite} > {t('edit')} )} {context === 'daily-overview' && !habit.archived && ( // Edit button always visible in dropdown for daily-overview context handleAction(onEditRequest)} disabled={!canWrite} > {t('edit')} )} {!habit.archived && ( handleAction(() => archiveHabit(habit.id))} > {t('archive')} )} {habit.archived && ( handleAction(() => unarchiveHabit(habit.id))} > {t('unarchive')} )} {context === 'habit-item' && !habit.archived && } {(context === 'daily-overview' || habit.archived) && } handleAction(onDeleteRequest)} className="text-red-600 focus:text-red-600 dark:text-red-400 dark:focus:text-red-400" disabled={!canWrite} // Assuming delete is a write operation > {t('delete')} ); }