Calendar View

The calendar provides an interactive task visualization powered by FullCalendar.

Features

• Month, week, and day views — switch between calendar granularities
• Task cards — each task is displayed on its due date with title and status-based color
• Click to view — clicking a task opens the task detail panel
• Locale-aware — calendar locale switches between English and Russian based on the app's i18n setting

Frontend

Route

Route	View	Description
/calendar	CalendarView	Full calendar with tasks

Calendar Store

const store = useCalendarStore()
const { events, loading } = storeToRefs(store)

await store.fetchEvents()  // Loads tasks with due dates

Implementation Details

• The calendar fetches all tasks with due dates across the user's projects
• Each task is rendered as an event with:
  • Title
  • Status color (todo=gray, in_progress=blue, in_review=yellow, done=green, cancelled=red)
  • Click handler that navigates to the task detail view
• Locale is bound reactively to the i18n locale — switching language also switches calendar month names and UI text
• FullCalendar is imported from @fullcalendar/core with @fullcalendar/daygrid, @fullcalendar/timegrid, and @fullcalendar/interaction plugins