diff --git a/.planning/ROADMAP.md b/.planning/ROADMAP.md index 19cdff1..54e4ad7 100644 --- a/.planning/ROADMAP.md +++ b/.planning/ROADMAP.md @@ -43,6 +43,9 @@ This roadmap delivers the My Weekly To Do List application in four phases, start - [x] 02-02-PLAN.md — Add drag-and-drop functionality between days of the week and enhance time allocation visualization. - [x] 02-03-PLAN.md — Final integration, performance optimization, and comprehensive testing of all task management features. +**Status:** Completed +**Completion Date:** 2026-01-25 + **Requirements:** - TASK-01: User can create tasks with title and description - TASK-02: User can edit existing tasks @@ -67,6 +70,12 @@ This roadmap delivers the My Weekly To Do List application in four phases, start ### Phase 3: Calendar Integration **Goal:** Users can connect external calendar accounts and synchronize data +**Plans:** 2 plans + +**Plans:** +- [ ] 03-01-PLAN.md — Implement Google and Apple Calendar OAuth flows for account connection. +- [ ] 03-02-PLAN.md — Implement bidirectional sync between calendar events and tasks. + **Requirements:** - CAL-01: User can connect their Google Calendar account - CAL-02: User can connect their Apple Calendar account diff --git a/.planning/phases/03-calendar-integration/03-01-PLAN.md b/.planning/phases/03-calendar-integration/03-01-PLAN.md new file mode 100644 index 0000000..1995884 --- /dev/null +++ b/.planning/phases/03-calendar-integration/03-01-PLAN.md @@ -0,0 +1,141 @@ +--- +phase: 03-calendar-integration +plan: 01 +type: execute +wave: 1 +depends_on: [] +files_modified: [src/lib/google-calendar.ts, src/lib/apple-calendar.ts, src/app/api/calendar/google/oauth/route.ts, src/app/api/calendar/apple/oauth/route.ts] +autonomous: true +must_haves: + truths: + - "User can connect their Google Calendar account" + - "User can connect their Apple Calendar account" + - "Connected calendars appear in user's calendar settings" + artifacts: + - path: "src/lib/google-calendar.ts" + provides: "Google Calendar OAuth flow and API wrapper" + min_lines: 20 + - path: "src/lib/apple-calendar.ts" + provides: "Apple Calendar OAuth flow and API wrapper" + min_lines: 20 + - path: "src/app/api/calendar/google/oauth/route.ts" + provides: "Google OAuth callback endpoint" + exports: ["GET"] + - path: "src/app/api/calendar/apple/oauth/route.ts" + provides: "Apple OAuth callback endpoint" + exports: ["GET"] + key_links: + - from: "src/app/api/calendar/google/oauth/route.ts" + to: "src/lib/google-calendar.ts" + via: "import and use" + pattern: "import.*google-calendar" + - from: "src/app/api/calendar/apple/oauth/route.ts" + to: "src/lib/apple-calendar.ts" + via: "import and use" + pattern: "import.*apple-calendar" +--- + + +Implement the calendar integration system allowing users to connect Google and Apple calendar accounts with OAuth. + +Purpose: Enable users to view and synchronize their calendar events with the weekly task view. +Output: Google Calendar and Apple Calendar OAuth flows with API wrappers for calendar event retrieval. + + + +@~/.config/opencode/get-shit-done/workflows/execute-plan.md +@~/.config/opencode/get-shit-done/templates/summary.md + + + + +@.planning/PROJECT.md +@.planning/ROADMAP.md +@.planning/STATE.md +@.planning/REQUIREMENTS.md + +# Relevant context from previous phases +@.planning/phases/01-setup-and-authentication/01-01-PLAN.md +@.planning/phases/01-setup-and-authentication/01-02-PLAN.md +@.planning/phases/02-task-management/02-01-PLAN.md + + + + + + Implement Google Calendar OAuth Wrapper + src/lib/google-calendar.ts + Create a TypeScript module that implements Google Calendar OAuth flow using the Google API Client Library for JavaScript. Include functions for: + - Initializing OAuth with client ID and scopes + - Handling authorization redirects + - Retrieving user calendar list + - Fetching upcoming events for a specified time period + + Reference the authentication setup from Phase 1 and the API patterns used in Phase 2. + npm test passes and the module exports required functions without error + Module exports initializeOAuth, getUserCalendars, and getUpcomingEvents functions + + + + Implement Apple Calendar OAuth Wrapper + src/lib/apple-calendar.ts + Create a TypeScript module that implements Apple Calendar OAuth flow using the Apple Developer API. Include functions for: + - Initializing OAuth with client ID and scopes + - Handling authorization redirects + - Retrieving user calendar list + - Fetching upcoming events for a specified time period + + Reference the authentication setup from Phase 1 and the API patterns used in Phase 2. + npm test passes and the module exports required functions without error + Module exports initializeOAuth, getUserCalendars, and getUpcomingEvents functions + + + + Create Google Calendar OAuth Endpoint + src/app/api/calendar/google/oauth/route.ts + Create an API route that handles the Google OAuth callback. The route should: + - Receive the authorization code from Google's OAuth redirect + - Exchange the code for an access token using the Google API + - Store the token in the database associated with the user + - Redirect to the calendar settings page or dashboard with success message + + Follow the API endpoint pattern established in Phase 2 and authentication flow from Phase 1. + curl -X GET http://localhost:3000/api/calendar/google/oauth returns a successful redirect + Route successfully handles Google OAuth and stores token in DB for user + + + + Create Apple Calendar OAuth Endpoint + src/app/api/calendar/apple/oauth/route.ts + Create an API route that handles the Apple OAuth callback. The route should: + - Receive the authorization code from Apple's OAuth redirect + - Exchange the code for an access token using the Apple API + - Store the token in the database associated with the user + - Redirect to the calendar settings page or dashboard with success message + + Follow the API endpoint pattern established in Phase 2 and authentication flow from Phase 1. + curl -X GET http://localhost:3000/api/calendar/apple/oauth returns a successful redirect + Route successfully handles Apple OAuth and stores token in DB for user + + + + + +Verify that all components work in concert: +1. Google and Apple OAuth flows work without errors +2. OAuth tokens are stored in database +3. Calendar list can be fetched for connected accounts +4. Events from calendars are retrievable +5. UI for calendar settings shows connected accounts + + + +- Users can connect Google and Apple calendars via OAuth +- Connected calendars appear in the user's calendar settings +- Calendar events can be retrieved for display in the weekly view +- Tokens are securely stored for accessing calendar data + + + +After completion, create `.planning/phases/03-calendar-integration/03-01-SUMMARY.md` + \ No newline at end of file diff --git a/.planning/phases/03-calendar-integration/03-02-PLAN.md b/.planning/phases/03-calendar-integration/03-02-PLAN.md new file mode 100644 index 0000000..9ae6465 --- /dev/null +++ b/.planning/phases/03-calendar-integration/03-02-PLAN.md @@ -0,0 +1,130 @@ +--- +phase: 03-calendar-integration +plan: 02 +type: execute +wave: 1 +depends_on: [] +files_modified: [src/lib/calendar-sync.ts, src/app/api/calendar/sync/route.ts, src/components/CalendarSettings.tsx] +autonomous: true +must_haves: + truths: + - "User can see calendar events alongside tasks in weekly view" + - "User can manage calendar connection settings from the application" + - "User's tasks and calendar events are synchronized bidirectionally" + artifacts: + - path: "src/lib/calendar-sync.ts" + provides: "Bidirectional synchronization logic for calendars and tasks" + min_lines: 30 + - path: "src/app/api/calendar/sync/route.ts" + provides: "API endpoint for triggering calendar synchronization" + exports: ["POST"] + - path: "src/components/CalendarSettings.tsx" + provides: "UI component to manage calendar connections and sync settings" + min_lines: 40 + key_links: + - from: "src/components/CalendarSettings.tsx" + to: "src/lib/calendar-sync.ts" + via: "import and use" + pattern: "import.*calendar-sync" + - from: "src/app/api/calendar/sync/route.ts" + to: "src/lib/calendar-sync.ts" + via: "import and use" + pattern: "import.*calendar-sync" +--- + + +Implement calendar synchronization features enabling bidirectional syncing of calendar events and tasks. + +Purpose: Allow seamless integration of calendar events with weekly task view and enable users to manage calendar connections. +Output: Bidirectional synchronization logic, sync API endpoint, and calendar settings UI. + + + +@~/.config/opencode/get-shit-done/workflows/execute-plan.md +@~/.config/opencode/get-shit-done/templates/summary.md + + + +@.planning/PROJECT.md +@.planning/ROADMAP.md +@.planning/STATE.md +@.planning/REQUIREMENTS.md + +# Relevant context from previous phases +@.planning/phases/01-setup-and-authentication/01-01-PLAN.md +@.planning/phases/01-setup-and-authentication/01-02-PLAN.md +@.planning/phases/02-task-management/02-01-PLAN.md +@.planning/phases/03-calendar-integration/03-01-PLAN.md + + + + + + Implement Bidirectional Sync Logic + src/lib/calendar-sync.ts + Create a TypeScript module that implements the core synchronization logic: + - Determine which calendars are connected and active + - Fetch events from calendar APIs + - Identify tasks that need to be imported from calendars + - Identify calendar events that need to be converted to tasks + - Handle conflicts in naming, dates, or other attributes + - Handle updates and deletions from both sides + + Reference calendar data structures from Phase 2 and API patterns from Phase 1. + npm test passes and the module exports syncCalendarEvents and syncCalendarTasks functions without error + Module exports syncCalendarEvents and syncCalendarTasks functions that handle bidirectional sync + + + + Create Calendar Sync API Endpoint + src/app/api/calendar/sync/route.ts + Create a POST API endpoint that: + - Validates user authentication + - Triggers the calendar synchronization process + - Calls the sync logic from calendar-sync.ts + - Returns appropriate status codes and responses + - Handles errors gracefully with appropriate messaging + + Follow the API endpoint pattern established in Phase 2 and authentication flow from Phase 1. + curl -X POST http://localhost:3000/api/calendar/sync returns 200 with successful sync status + Endpoint successfully triggers sync process and returns status JSON + + + + Create Calendar Settings UI Component + src/components/CalendarSettings.tsx + Create a React component that: + - Displays a list of connected calendars + - Allows toggling calendar sync settings + - Shows last sync timestamp for each calendar + - Provides a button to trigger manual sync + - Includes options to disconnect calendars + + Follow UI patterns from Phase 1 and component architecture from Phase 2. + Component renders without error in development environment + Component renders properly with all calendar management options + + + + + +Verify that all components work in concert: +1. Calendar settings UI displays connected calendars +2. Manual sync button triggers the sync API endpoint +3. Sync process retrieves events from calendars +4. Events are properly imported as tasks (when applicable) +5. Tasks can be exported to calendars (when configured) +6. Settings persist between sessions + + + +- Users can see calendar events alongside tasks in the weekly view +- Users can manage calendar connections and sync settings from UI +- Bidirectional synchronization works between calendar events and tasks +- Events are properly imported from calendars to tasks +- Tasks can be created from calendar events when configured + + + +After completion, create `.planning/phases/03-calendar-integration/03-02-SUMMARY.md` + \ No newline at end of file