Calendar

Calendar is an iCal-inspired date management application for ryOS that lets you view weeks and months, create events, and organize your schedule with color coding. It provides week and month views, cloud sync, AI integration, and persistent event storage.

Overview

Calendar is an iCal-inspired date management application with week and month views, event creation with color coding, cloud sync, and AI integration. It helps ryOS users track appointments, deadlines, and events in an Apple iCal-inspired interface with brushed metal and Aqua styling. Events sync to the cloud and Ryo can create and manage events via chat. The app supports week view as the primary view, month view for overview, and offers Spotlight search integration for finding events quickly.

Features

Week View & Month View: iCal-style week view as the primary view with smooth navigation between weeks and months

Create, Edit, and Delete Events: Double-click a date or use File > New Event to add events; edit and delete with color coding for visual organization
Cloud Sync: Calendar events sync to the cloud
AI Integration: Calendar AI tool—Ryo can create and manage events via chat
Spotlight Search: Calendar events appear in Spotlight search results
Brushed Metal + Aqua Styling: Matches classic macOS aesthetics
Mobile-Responsive: Horizontal scrolling in week view on smaller screens
Today Indicator: Red highlight for the current day
Translucent Event Colors: Overlap visibility when events conflict
Sync Menu Items: File menu includes sync options
Date/Range Label: Displayed in the title bar (moved from bottom toolbar)
Auto-Save: Events are automatically saved and persist between sessions

User Guide

Getting Started

Launch Calendar from the application launcher. Use the week or month navigation to move between time periods, or click Today to return to the current date. Week view is the default primary view with an iCal-inspired layout.

Key Actions

Add Event: Double-click any date in the week or month view, or use File > New Event
Sync Events: Use File menu sync options to sync calendar data with the cloud
Organize with Colors: Select an event and choose a color from the color options
Remove Events: Select an event and use Edit > Delete Event
Search Events: Use Spotlight to find calendar events from anywhere in ryOS

Tips & Shortcuts

Events auto-save as you create and edit them—no manual save needed
Use colors to distinguish between work, personal, and other event types
Ask Ryo in chat to create or manage events—AI integration handles the details

Technical Details

Window Configuration

Default size: 700×520px
Minimum size: 300×380px

Component Architecture

src/apps/calendar/components/CalendarAppComponent.tsx — Main app with week and month views
src/apps/calendar/components/CalendarMenuBar.tsx — Menu bar with File, Edit, View options and sync
src/apps/calendar/components/EventDialog.tsx — Event create/edit dialog

Hooks

src/apps/calendar/hooks/useCalendarLogic.ts — Calendar state, navigation, and event management

Utilities

src/apps/calendar/utils/parseIcal.ts — iCal format parsing

State Management

useCalendarStore (src/stores/useCalendarStore.ts) — Zustand store with IndexedDB persistence for events, calendars, and todos.

Related Apps

Stickies: For quick reminders alongside scheduled events

Dashboard: Includes a mini calendar widget that can show your events
Chats: Ask Ryo to create or manage calendar events via the AI integration