diff --git a/backend/app/routers/dashboard.py b/backend/app/routers/dashboard.py index 45a6773..c83ce7b 100644 --- a/backend/app/routers/dashboard.py +++ b/backend/app/routers/dashboard.py @@ -93,6 +93,12 @@ async def get_dashboard( ) total_incomplete_todos = total_incomplete_result.scalar() + # Total todos count (for progress ring ratio) + total_todos_result = await db.execute( + select(func.count(Todo.id)).where(Todo.user_id == current_user.id) + ) + total_todos = total_todos_result.scalar() + # Starred events (upcoming, ordered by date, scoped to user's calendars) starred_query = select(CalendarEvent).where( CalendarEvent.calendar_id.in_(user_calendar_ids), @@ -148,6 +154,7 @@ async def get_dashboard( "by_status": projects_by_status }, "total_incomplete_todos": total_incomplete_todos, + "total_todos": total_todos, "starred_events": starred_events_data } diff --git a/frontend/src/components/dashboard/CalendarWidget.tsx b/frontend/src/components/dashboard/CalendarWidget.tsx index 6d8270d..8703527 100644 --- a/frontend/src/components/dashboard/CalendarWidget.tsx +++ b/frontend/src/components/dashboard/CalendarWidget.tsx @@ -1,7 +1,9 @@ +import { useState, useEffect } from 'react'; import { format } from 'date-fns'; import { useNavigate } from 'react-router-dom'; import { Calendar } from 'lucide-react'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; +import { cn } from '@/lib/utils'; interface DashboardEvent { id: number; @@ -17,12 +19,38 @@ interface CalendarWidgetProps { events: DashboardEvent[]; } +function getEventTimeState(event: DashboardEvent, now: Date) { + if (event.all_day) return 'all-day' as const; + const start = new Date(event.start_datetime).getTime(); + const end = new Date(event.end_datetime).getTime(); + const current = now.getTime(); + if (current >= end) return 'past' as const; + if (current >= start && current < end) return 'current' as const; + return 'future' as const; +} + +function getProgressPercent(event: DashboardEvent, now: Date): number { + if (event.all_day) return 0; + const start = new Date(event.start_datetime).getTime(); + const end = new Date(event.end_datetime).getTime(); + const current = now.getTime(); + if (current >= end) return 100; + if (current <= start) return 0; + return Math.round(((current - start) / (end - start)) * 100); +} + export default function CalendarWidget({ events }: CalendarWidgetProps) { const navigate = useNavigate(); const todayStr = format(new Date(), 'yyyy-MM-dd'); + const [clientNow, setClientNow] = useState(() => new Date()); + + useEffect(() => { + const interval = setInterval(() => setClientNow(new Date()), 60_000); + return () => clearInterval(interval); + }, []); return ( - +
@@ -33,29 +61,58 @@ export default function CalendarWidget({ events }: CalendarWidgetProps) { {events.length === 0 ? ( -

- No events today -

+
+
+ +
+

Enjoy the free time

+
) : (
- {events.map((event) => ( -
navigate('/calendar', { state: { date: todayStr, view: 'timeGridDay', eventId: event.id } })} - className="flex items-center gap-2 py-1.5 px-2 rounded-md hover:bg-white/5 transition-colors duration-150 cursor-pointer" - > + {events.map((event) => { + const timeState = getEventTimeState(event, clientNow); + const progress = getProgressPercent(event, clientNow); + const isCurrent = timeState === 'current'; + const isPast = timeState === 'past'; + + return (
- - {event.all_day - ? 'All day' - : `${format(new Date(event.start_datetime), 'h:mm a')} – ${format(new Date(event.end_datetime), 'h:mm a')}`} - - {event.title} -
- ))} + key={event.id} + onClick={() => navigate('/calendar', { state: { date: todayStr, view: 'timeGridDay', eventId: event.id } })} + className={cn( + 'flex items-center gap-2 py-1.5 rounded-md hover:bg-card-elevated transition-colors duration-150 cursor-pointer relative pl-3.5', + isCurrent && 'bg-accent/[0.05]', + isPast && 'opacity-50' + )} + > + {/* Time progress bar — always rendered for consistent layout */} +
+ {!event.all_day && ( +
+ )} +
+
+ + {event.all_day + ? 'All day' + : `${format(new Date(event.start_datetime), 'h:mm a')} – ${format(new Date(event.end_datetime), 'h:mm a')}`} + + {event.title} +
+ ); + })}
)} diff --git a/frontend/src/components/dashboard/CountdownWidget.tsx b/frontend/src/components/dashboard/CountdownWidget.tsx index ab15adb..ce4d26e 100644 --- a/frontend/src/components/dashboard/CountdownWidget.tsx +++ b/frontend/src/components/dashboard/CountdownWidget.tsx @@ -1,6 +1,7 @@ import { differenceInCalendarDays, format } from 'date-fns'; import { useNavigate } from 'react-router-dom'; import { Star } from 'lucide-react'; +import { cn } from '@/lib/utils'; interface CountdownWidgetProps { events: Array<{ @@ -16,16 +17,22 @@ export default function CountdownWidget({ events }: CountdownWidgetProps) { if (visible.length === 0) return null; return ( -
+
{visible.map((event) => { const days = differenceInCalendarDays(new Date(event.start_datetime), new Date()); const label = days === 0 ? 'Today' : days === 1 ? '1 day' : `${days} days`; const dateStr = format(new Date(event.start_datetime), 'yyyy-MM-dd'); + const isUrgent = days <= 3; + const isFar = days >= 7; return (
navigate('/calendar', { state: { date: dateStr, view: 'timeGridDay', eventId: event.id } })} - className="flex items-center gap-2 cursor-pointer hover:bg-amber-500/10 rounded px-1 -mx-1 transition-colors duration-150" + className={cn( + 'flex items-center gap-2 cursor-pointer hover:bg-amber-500/10 rounded px-1.5 -mx-1.5 transition-all duration-150 border border-transparent', + isUrgent && 'border-amber-500/30 shadow-[0_0_8px_hsl(38_92%_50%/0.15)]', + isFar && 'opacity-70' + )} > diff --git a/frontend/src/components/dashboard/DashboardPage.tsx b/frontend/src/components/dashboard/DashboardPage.tsx index 2972677..46692c9 100644 --- a/frontend/src/components/dashboard/DashboardPage.tsx +++ b/frontend/src/components/dashboard/DashboardPage.tsx @@ -1,8 +1,8 @@ -import { useState, useEffect, useRef } from 'react'; +import { useState, useEffect, useRef, useCallback } from 'react'; import { useNavigate } from 'react-router-dom'; -import { useQuery } from '@tanstack/react-query'; -import { format } from 'date-fns'; -import { Bell, Plus, Calendar as CalIcon, ListTodo } from 'lucide-react'; +import { useQuery, useQueryClient } from '@tanstack/react-query'; +import { format, formatDistanceToNow } from 'date-fns'; +import { Bell, Plus, Calendar as CalIcon, ListTodo, RefreshCw } from 'lucide-react'; import api from '@/lib/api'; import type { DashboardData, UpcomingResponse, WeatherData } from '@/types'; import { useSettings } from '@/hooks/useSettings'; @@ -22,6 +22,7 @@ import ReminderForm from '../reminders/ReminderForm'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Button } from '@/components/ui/button'; import { DashboardSkeleton } from '@/components/ui/skeleton'; +import { cn } from '@/lib/utils'; function getGreeting(name?: string): string { const hour = new Date().getHours(); @@ -35,12 +36,14 @@ function getGreeting(name?: string): string { export default function DashboardPage() { const navigate = useNavigate(); + const queryClient = useQueryClient(); const { settings } = useSettings(); const { alerts, dismiss: dismissAlert, snooze: snoozeAlert } = useAlerts(); const [quickAddType, setQuickAddType] = useState<'event' | 'todo' | 'reminder' | null>(null); const [dropdownOpen, setDropdownOpen] = useState(false); const dropdownRef = useRef(null); + // Click outside to close dropdown useEffect(() => { function handleClickOutside(e: MouseEvent) { if (dropdownRef.current && !dropdownRef.current.contains(e.target as Node)) { @@ -51,7 +54,47 @@ export default function DashboardPage() { return () => document.removeEventListener('mousedown', handleClickOutside); }, [dropdownOpen]); - const { data, isLoading } = useQuery({ + // Keyboard quick-add: Ctrl+N / Cmd+N opens dropdown, e/t/r selects type + useEffect(() => { + function handleKeyDown(e: KeyboardEvent) { + // Don't trigger inside inputs/textareas or when a form is open + const tag = (e.target as HTMLElement)?.tagName; + if (tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT') return; + if (quickAddType) return; + + if ((e.ctrlKey || e.metaKey) && e.key === 'n') { + e.preventDefault(); + setDropdownOpen(true); + return; + } + + if (dropdownOpen) { + if (e.key === 'Escape') { + setDropdownOpen(false); + return; + } + if (e.key === 'e') { + setQuickAddType('event'); + setDropdownOpen(false); + return; + } + if (e.key === 't') { + setQuickAddType('todo'); + setDropdownOpen(false); + return; + } + if (e.key === 'r') { + setQuickAddType('reminder'); + setDropdownOpen(false); + return; + } + } + } + document.addEventListener('keydown', handleKeyDown); + return () => document.removeEventListener('keydown', handleKeyDown); + }, [dropdownOpen, quickAddType]); + + const { data, isLoading, dataUpdatedAt } = useQuery({ queryKey: ['dashboard'], queryFn: async () => { const now = new Date(); @@ -59,6 +102,8 @@ export default function DashboardPage() { const { data } = await api.get(`/dashboard?client_date=${today}`); return data; }, + staleTime: 60_000, + refetchInterval: 120_000, }); const { data: upcomingData } = useQuery({ @@ -70,6 +115,8 @@ export default function DashboardPage() { const { data } = await api.get(`/upcoming?days=${days}&client_date=${clientDate}`); return data; }, + staleTime: 60_000, + refetchInterval: 120_000, }); const { data: weatherData } = useQuery({ @@ -83,6 +130,11 @@ export default function DashboardPage() { enabled: !!(settings?.weather_city || (settings?.weather_lat != null && settings?.weather_lon != null)), }); + const handleRefresh = useCallback(() => { + queryClient.invalidateQueries({ queryKey: ['dashboard'] }); + queryClient.invalidateQueries({ queryKey: ['upcoming'] }); + }, [queryClient]); + if (isLoading) { return (
@@ -107,6 +159,10 @@ export default function DashboardPage() { ); } + const updatedAgo = dataUpdatedAt + ? formatDistanceToNow(new Date(dataUpdatedAt), { addSuffix: true }) + : null; + return (
{/* Header — greeting + date + quick add */} @@ -115,9 +171,25 @@ export default function DashboardPage() {

{getGreeting(settings?.preferred_name || undefined)}

-

- {format(new Date(), 'EEEE, MMMM d, yyyy')} -

+
+

+ {format(new Date(), 'EEEE, MMMM d, yyyy')} +

+ {updatedAgo && ( + <> + · + Updated {updatedAgo} + + + )} +
{dropdownOpen && ( -
+
)} @@ -157,7 +238,7 @@ export default function DashboardPage() {
-
+
{/* Week Timeline */} {upcomingData && (
@@ -179,6 +260,7 @@ export default function DashboardPage() {
@@ -226,7 +308,7 @@ export default function DashboardPage() {
navigate('/reminders', { state: { reminderId: reminder.id } })} - className="flex items-center gap-2 py-1.5 px-2 rounded-md hover:bg-white/5 transition-colors duration-150 cursor-pointer" + className="flex items-center gap-2 py-1.5 px-2 rounded-md hover:bg-card-elevated transition-colors duration-150 cursor-pointer" >
{reminder.title} diff --git a/frontend/src/components/dashboard/DayBriefing.tsx b/frontend/src/components/dashboard/DayBriefing.tsx index c1019d9..988ac93 100644 --- a/frontend/src/components/dashboard/DayBriefing.tsx +++ b/frontend/src/components/dashboard/DayBriefing.tsx @@ -1,5 +1,6 @@ import { useMemo } from 'react'; import { format, isSameDay, startOfDay, addDays, isAfter } from 'date-fns'; +import { Sparkles } from 'lucide-react'; import type { UpcomingItem, DashboardData } from '@/types'; interface DayBriefingProps { @@ -148,8 +149,11 @@ export default function DayBriefing({ upcomingItems, dashboardData, weatherData if (!briefing) return null; return ( -

- {briefing} -

+
+ +

+ {briefing} +

+
); } diff --git a/frontend/src/components/dashboard/StatsWidget.tsx b/frontend/src/components/dashboard/StatsWidget.tsx index 1fd72a9..e55ca53 100644 --- a/frontend/src/components/dashboard/StatsWidget.tsx +++ b/frontend/src/components/dashboard/StatsWidget.tsx @@ -1,5 +1,5 @@ import { useNavigate } from 'react-router-dom'; -import { FolderKanban, TrendingUp, CheckSquare, CloudSun } from 'lucide-react'; +import { FolderKanban, CloudSun } from 'lucide-react'; import { Card, CardContent } from '@/components/ui/card'; interface StatsWidgetProps { @@ -8,12 +8,50 @@ interface StatsWidgetProps { by_status: Record; }; totalIncompleteTodos: number; + totalTodos?: number; weatherData?: { temp: number; description: string; city?: string } | null; } -export default function StatsWidget({ projectStats, totalIncompleteTodos, weatherData }: StatsWidgetProps) { +function ProgressRing({ value, total, color }: { value: number; total: number; color: string }) { + const size = 32; + const strokeWidth = 3; + const radius = (size - strokeWidth) / 2; + const circumference = 2 * Math.PI * radius; + const ratio = total > 0 ? Math.min(value / total, 1) : 0; + const offset = circumference * (1 - ratio); + + return ( + + + + + ); +} + +export default function StatsWidget({ projectStats, totalIncompleteTodos, totalTodos, weatherData }: StatsWidgetProps) { const navigate = useNavigate(); + const inProgress = projectStats.by_status['in_progress'] || 0; + const completedTodos = (totalTodos || 0) - totalIncompleteTodos; + const statCards = [ { label: 'PROJECTS', @@ -22,22 +60,25 @@ export default function StatsWidget({ projectStats, totalIncompleteTodos, weathe color: 'text-blue-400', glowBg: 'bg-blue-500/10', onClick: () => navigate('/projects'), + ring: null, }, { label: 'IN PROGRESS', - value: projectStats.by_status['in_progress'] || 0, - icon: TrendingUp, + value: inProgress, + icon: null, color: 'text-purple-400', glowBg: 'bg-purple-500/10', onClick: () => navigate('/projects', { state: { filter: 'in_progress' } }), + ring: { value: inProgress, total: projectStats.total, color: 'hsl(270, 70%, 60%)' }, }, { label: 'OPEN TODOS', value: totalIncompleteTodos, - icon: CheckSquare, + icon: null, color: 'text-teal-400', glowBg: 'bg-teal-500/10', onClick: () => navigate('/todos'), + ring: totalTodos ? { value: completedTodos, total: totalTodos, color: 'hsl(170, 70%, 50%)' } : null, }, ]; @@ -59,9 +100,13 @@ export default function StatsWidget({ projectStats, totalIncompleteTodos, weathe {stat.value}

-
- -
+ {stat.ring ? ( + + ) : stat.icon ? ( +
+ +
+ ) : null}
diff --git a/frontend/src/components/dashboard/TodoWidget.tsx b/frontend/src/components/dashboard/TodoWidget.tsx index 1afab55..827d9a0 100644 --- a/frontend/src/components/dashboard/TodoWidget.tsx +++ b/frontend/src/components/dashboard/TodoWidget.tsx @@ -1,9 +1,13 @@ +import { useState } from 'react'; import { format, isPast, endOfDay } from 'date-fns'; import { useNavigate } from 'react-router-dom'; -import { CheckCircle2 } from 'lucide-react'; +import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { toast } from 'sonner'; +import { CheckCircle2, Check } from 'lucide-react'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Badge } from '@/components/ui/badge'; import { cn } from '@/lib/utils'; +import api from '@/lib/api'; interface DashboardTodo { id: number; @@ -31,9 +35,21 @@ const dotColors: Record = { export default function TodoWidget({ todos }: TodoWidgetProps) { const navigate = useNavigate(); + const queryClient = useQueryClient(); + const [hoveredId, setHoveredId] = useState(null); + + const toggleTodo = useMutation({ + mutationFn: (id: number) => api.patch(`/todos/${id}/toggle`), + onSuccess: () => { + queryClient.invalidateQueries({ queryKey: ['dashboard'] }); + queryClient.invalidateQueries({ queryKey: ['upcoming'] }); + toast.success('Todo completed'); + }, + onError: () => toast.error('Failed to complete todo'), + }); return ( - +
@@ -44,31 +60,55 @@ export default function TodoWidget({ todos }: TodoWidgetProps) { {todos.length === 0 ? ( -

- All caught up. -

+
+
+ +
+

Your slate is clean

+
) : (
{todos.slice(0, 5).map((todo) => { const isOverdue = isPast(endOfDay(new Date(todo.due_date))); + const isHovered = hoveredId === todo.id; return (
navigate('/todos', { state: { todoId: todo.id } })} - className="flex items-center gap-2 py-1.5 px-2 rounded-md hover:bg-white/5 transition-colors duration-150 cursor-pointer" + onMouseEnter={() => setHoveredId(todo.id)} + onMouseLeave={() => setHoveredId(null)} + className="flex items-center gap-2 py-1.5 px-2 rounded-md hover:bg-card-elevated transition-colors duration-150 cursor-pointer" >
{todo.title} - - {format(new Date(todo.due_date), 'MMM d')} - {isOverdue && ' overdue'} - - - {todo.priority} - +
+
+ + {format(new Date(todo.due_date), 'MMM d')} + {isOverdue && ' overdue'} + + + {todo.priority} + +
+ {isHovered && ( +
+ +
+ )} +
); })} diff --git a/frontend/src/components/dashboard/TrackedProjectsWidget.tsx b/frontend/src/components/dashboard/TrackedProjectsWidget.tsx index 9d24bbd..9977f53 100644 --- a/frontend/src/components/dashboard/TrackedProjectsWidget.tsx +++ b/frontend/src/components/dashboard/TrackedProjectsWidget.tsx @@ -49,7 +49,7 @@ export default function TrackedProjectsWidget() { if (!tasks || tasks.length === 0) return null; return ( - +
diff --git a/frontend/src/components/dashboard/UpcomingWidget.tsx b/frontend/src/components/dashboard/UpcomingWidget.tsx index 2d821ea..a8d9a60 100644 --- a/frontend/src/components/dashboard/UpcomingWidget.tsx +++ b/frontend/src/components/dashboard/UpcomingWidget.tsx @@ -1,4 +1,4 @@ -import { useState, useMemo, useEffect, useCallback } from 'react'; +import { useState, useMemo, useEffect, useCallback, useRef } from 'react'; import { format, isToday, isTomorrow, isThisWeek } from 'date-fns'; import { useNavigate } from 'react-router-dom'; import { useMutation, useQueryClient } from '@tanstack/react-query'; @@ -62,6 +62,11 @@ export default function UpcomingWidget({ items }: UpcomingWidgetProps) { const [clientNow, setClientNow] = useState(() => new Date()); const [hoveredItem, setHoveredItem] = useState(null); const [snoozeOpen, setSnoozeOpen] = useState(null); + const hasMounted = useRef(false); + + useEffect(() => { + hasMounted.current = true; + }, []); // Update clientNow every 60s for past-event detection useEffect(() => { @@ -69,15 +74,29 @@ export default function UpcomingWidget({ items }: UpcomingWidgetProps) { return () => clearInterval(interval); }, []); - // Toggle todo completion + // Toggle todo completion with optimistic update const toggleTodo = useMutation({ mutationFn: (id: number) => api.patch(`/todos/${id}/toggle`), + onMutate: async (id: number) => { + await queryClient.cancelQueries({ queryKey: ['upcoming'] }); + const previousData = queryClient.getQueryData(['upcoming']); + queryClient.setQueryData(['upcoming'], (old: any) => { + if (!old?.items) return old; + return { ...old, items: old.items.filter((item: UpcomingItem) => !(item.type === 'todo' && item.id === id)) }; + }); + return { previousData }; + }, onSuccess: () => { queryClient.invalidateQueries({ queryKey: ['upcoming'] }); queryClient.invalidateQueries({ queryKey: ['dashboard'] }); toast.success('Todo completed'); }, - onError: () => toast.error('Failed to complete todo'), + onError: (_err, _id, context) => { + if (context?.previousData) { + queryClient.setQueryData(['upcoming'], context.previousData); + } + toast.error('Failed to complete todo'); + }, }); // Snooze reminder @@ -261,6 +280,7 @@ export default function UpcomingWidget({ items }: UpcomingWidgetProps) { {!isCollapsed && (
{dayItems.map((item, idx) => { + const animDelay = Math.min(idx, 8) * 30; const config = typeConfig[item.type] || typeConfig.todo; const itemKey = `${item.type}-${item.id}-${idx}`; const isPast = isEventPast(item, clientNow); @@ -275,9 +295,11 @@ export default function UpcomingWidget({ items }: UpcomingWidgetProps) { onMouseLeave={() => { setHoveredItem(null); setSnoozeOpen(null); }} className={cn( 'flex items-center gap-2 py-1.5 px-2 rounded-md transition-colors duration-150 cursor-pointer', + !hasMounted.current && 'animate-slide-in-row', config.hoverGlow, isPast && 'opacity-50' )} + style={!hasMounted.current ? { animationDelay: `${animDelay}ms`, animationFillMode: 'backwards' } : undefined} > {/* Title */} {item.title} diff --git a/frontend/src/components/dashboard/WeekTimeline.tsx b/frontend/src/components/dashboard/WeekTimeline.tsx index 9e8ee96..7102d23 100644 --- a/frontend/src/components/dashboard/WeekTimeline.tsx +++ b/frontend/src/components/dashboard/WeekTimeline.tsx @@ -49,8 +49,8 @@ export default function WeekTimeline({ items }: WeekTimelineProps) { day.isToday ? 'bg-accent/10 border-accent/30 shadow-[0_0_12px_hsl(var(--accent-color)/0.15)]' : day.isPast - ? 'border-transparent opacity-50 hover:opacity-75' - : 'border-transparent hover:border-border/50' + ? 'border-transparent opacity-50 hover:opacity-75 hover:scale-[1.04] hover:bg-card-elevated' + : 'border-transparent hover:border-border/50 hover:scale-[1.04] hover:bg-card-elevated' )} > {day.dayNum} -
+
{day.items.slice(0, 4).map((item) => (
))} {day.items.length > 4 && ( @@ -85,6 +86,9 @@ export default function WeekTimeline({ items }: WeekTimelineProps) { +{day.items.length - 4} )} + {day.isToday && ( +
+ )}
))} diff --git a/frontend/src/index.css b/frontend/src/index.css index 8e6005e..93454d8 100644 --- a/frontend/src/index.css +++ b/frontend/src/index.css @@ -422,5 +422,44 @@ form[data-submitted] input:invalid + button { .animate-drift-1 { animation: drift-1 25s ease-in-out infinite; } .animate-drift-2 { animation: drift-2 30s ease-in-out infinite; } .animate-drift-3 { animation: drift-3 20s ease-in-out infinite; } +@keyframes pulse-dot { + 0%, 100% { opacity: 0.4; } + 50% { opacity: 1; } +} + +@keyframes slide-in-row { + from { + opacity: 0; + transform: translateX(-6px); + } + to { + opacity: 1; + transform: translateX(0); + } +} + +@keyframes content-reveal { + from { + opacity: 0; + transform: scale(0.98); + } + to { + opacity: 1; + transform: scale(1); + } +} + .animate-slide-up { animation: slide-up 0.5s ease-out both; } .animate-fade-in { animation: fade-in 0.3s ease-out both; } +.animate-pulse-dot { animation: pulse-dot 2s ease-in-out infinite; } +.animate-slide-in-row { animation: slide-in-row 250ms ease-out both; } +.animate-content-reveal { animation: content-reveal 400ms ease-out both; } + +/* Respect reduced motion preferences */ +@media (prefers-reduced-motion: reduce) { + *, *::before, *::after { + animation-duration: 0.01ms !important; + animation-iteration-count: 1 !important; + transition-duration: 0.01ms !important; + } +} diff --git a/frontend/src/types/index.ts b/frontend/src/types/index.ts index bb27b6d..5e7339f 100644 --- a/frontend/src/types/index.ts +++ b/frontend/src/types/index.ts @@ -335,6 +335,7 @@ export interface DashboardData { by_status: Record; }; total_incomplete_todos: number; + total_todos: number; starred_events: Array<{ id: number; title: string;