mARTin
43e5296db4
Address gaps found in verification: - Fix Google and Apple OAuth callbacks to use real API token exchanges - Complete calendar event fetching with real API integrations - Implement bidirectional sync with actual database/calendar operations - Enable functional calendar connection UI with real OAuth triggers
200 lines
8.7 KiB
Markdown
200 lines
8.7 KiB
Markdown
---
|
|
phase: 03-calendar-integration
|
|
plan: 05
|
|
type: execute
|
|
wave: 1
|
|
depends_on: []
|
|
files_modified:
|
|
- src/lib/calendar-events.ts
|
|
- src/lib/google-calendar.ts
|
|
- src/lib/apple-calendar.ts
|
|
- src/lib/calendar-sync.ts
|
|
- src/components/WeeklyView.tsx
|
|
autonomous: true
|
|
gap_closure: true
|
|
|
|
must_haves:
|
|
truths:
|
|
- "User can connect their Google Calendar account"
|
|
- "User can connect their Apple Calendar account"
|
|
- "User can view 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-events.ts"
|
|
provides: "Real calendar event fetching from APIs"
|
|
- path: "src/lib/google-calendar.ts"
|
|
provides: "Real Google Calendar API integration functions"
|
|
- path: "src/lib/apple-calendar.ts"
|
|
provides: "Real Apple Calendar API integration functions"
|
|
- path: "src/lib/calendar-sync.ts"
|
|
provides: "Complete bidirectional sync implementation"
|
|
- path: "src/components/WeeklyView.tsx"
|
|
provides: "Dynamic calendar event display from connected calendars"
|
|
key_links:
|
|
- from: "src/components/WeeklyView.tsx"
|
|
to: "src/lib/calendar-events.ts"
|
|
via: "fetching calendar events for display"
|
|
pattern: "getCalendarEvents"
|
|
- from: "src/lib/calendar-events.ts"
|
|
to: "src/lib/google-calendar.ts"
|
|
via: "fetching events from Google Calendar API"
|
|
pattern: "getUpcomingEvents.*google"
|
|
- from: "src/lib/calendar-events.ts"
|
|
to: "src/lib/apple-calendar.ts"
|
|
via: "fetching events from Apple Calendar API"
|
|
pattern: "getUserCalendars.*apple"
|
|
- from: "src/lib/calendar-sync.ts"
|
|
to: "src/lib/google-calendar.ts"
|
|
via: "importing events from Google Calendar API"
|
|
pattern: "getUpcomingEvents.*google"
|
|
- from: "src/lib/calendar-sync.ts"
|
|
to: "src/lib/apple-calendar.ts"
|
|
via: "importing events from Apple Calendar API"
|
|
pattern: "getUserCalendars.*apple"
|
|
---
|
|
|
|
# Gap Closure: Calendar Event Fetching and Sync Implementation
|
|
|
|
## Objective
|
|
Complete calendar event fetching and bidirectional sync implementations to enable real calendar integration.
|
|
|
|
## Purpose
|
|
Enable users to view real calendar events in the weekly view and synchronize tasks with their connected calendars.
|
|
|
|
## Output
|
|
Functional calendar event fetching and bidirectional sync that integrates with real calendar APIs.
|
|
|
|
## Tasks
|
|
|
|
<task type="auto">
|
|
<name>Fix Calendar Events Fetching to Use Real APIs</name>
|
|
<files>src/lib/calendar-events.ts</files>
|
|
<action>
|
|
Replace mock implementations with real API integration:
|
|
|
|
1. Remove hardcoded mock data from getCalendarEvents function
|
|
2. Implement real API calls to fetch calendar events from connected providers
|
|
3. Integrate with both Google and Apple calendar libraries
|
|
4. Properly handle different calendar event structures from different providers
|
|
5. Add error handling for network failures or authentication issues
|
|
6. Implement caching strategy to avoid excessive API calls
|
|
|
|
The implementation should:
|
|
- Check for connected calendars and their providers
|
|
- Call appropriate functions from google-calendar.ts or apple-calendar.ts
|
|
- Aggregate events from all connected calendars
|
|
- Transform events to standardized format for display
|
|
</action>
|
|
<verify>Run `npm test` for calendar events utility and verify it can fetch real events instead of returning mock data</verify>
|
|
<done>Calendar events utility fetches real events from connected calendars</done>
|
|
</task>
|
|
|
|
<task type="auto">
|
|
<name>Complete Google Calendar API Integration</name>
|
|
<files>src/lib/google-calendar.ts</files>
|
|
<action>
|
|
Ensure the Google Calendar library properly implements real API integration:
|
|
|
|
1. Fix any type annotation issues (remove 'any' types where possible)
|
|
2. Ensure proper API calls to Google Calendar API with access tokens
|
|
3. Add proper response handling for different Google API responses
|
|
4. Add retry logic for transient network errors
|
|
5. Implement proper error handling for unauthorized access or quota limits
|
|
|
|
The implementation should:
|
|
- Use actual Google API endpoints through googleapis library
|
|
- Handle API response structures correctly
|
|
- Provide clear error messages when API calls fail
|
|
- Follow Google's API best practices
|
|
</action>
|
|
<verify>Run `npm test` for google-calendar.ts and verify all functions properly interact with Google Calendar API</verify>
|
|
<done>Google Calendar API integration functions work with real Google Calendar API calls</done>
|
|
</task>
|
|
|
|
<task type="auto">
|
|
<name>Complete Apple Calendar API Integration</name>
|
|
<files>src/lib/apple-calendar.ts</files>
|
|
<action>
|
|
Ensure the Apple Calendar library properly implements real API integration:
|
|
|
|
1. Fix any type annotation issues (remove 'any' types where possible)
|
|
2. Implement proper API calls to Apple Calendar API
|
|
3. Add proper response handling for Apple API responses
|
|
4. Add retry logic for transient network errors
|
|
5. Implement proper error handling for unauthorized access or API rate limits
|
|
|
|
The implementation should:
|
|
- Make actual HTTP requests to Apple Calendar API endpoints
|
|
- Handle Apple's authentication flow properly
|
|
- Provide clear error messages when API calls fail
|
|
- Follow Apple's API best practices
|
|
</action>
|
|
<verify>Run `npm test` for apple-calendar.ts and verify all functions properly interact with Apple Calendar API</verify>
|
|
<done>Apple Calendar API integration functions work with real Apple Calendar API calls</done>
|
|
</task>
|
|
|
|
<task type="auto">
|
|
<name>Complete Bidirectional Sync Implementation</name>
|
|
<files>src/lib/calendar-sync.ts</files>
|
|
<action>
|
|
Replace console.log operations with actual database and calendar API operations:
|
|
|
|
1. Implement actual database storage of sync results instead of console logging
|
|
2. Implement actual API calls to import calendar events into tasks
|
|
3. Implement actual API calls to export tasks to calendar events
|
|
4. Add proper transaction handling for data consistency
|
|
5. Add conflict resolution for duplicate events/tasks
|
|
6. Implement proper error handling for sync failures
|
|
7. Add metrics collection for sync operations
|
|
|
|
The implementation should:
|
|
- Use Prisma ORM to persist sync results
|
|
- Call appropriate functions from google-calendar.ts and apple-calendar.ts to fetch/submit events
|
|
- Handle both directions of sync (calendar → tasks and tasks → calendar)
|
|
- Provide detailed sync results with counts and conflicts
|
|
</action>
|
|
<verify>Run `npm test` for calendar-sync.ts and verify it performs actual operations instead of just console logging</verify>
|
|
<done>Bidirectional sync performs actual database/calendar API operations</done>
|
|
</task>
|
|
|
|
<task type="auto">
|
|
<name>Update Weekly View to Display Real Calendar Events</name>
|
|
<files>src/components/WeeklyView.tsx</files>
|
|
<action>
|
|
Replace mock data with dynamic fetching from real calendar sources:
|
|
|
|
1. Remove hardcoded mock events from useEffect that populates calendarEvents
|
|
2. Implement proper API call to fetch real calendar events from connected calendars
|
|
3. Add loading states and proper error handling
|
|
4. Ensure events are properly formatted and styled according to their provider
|
|
5. Add loading indicators while fetching events
|
|
6. Implement fallbacks for failed API calls
|
|
|
|
The implementation should:
|
|
- Fetch calendar events from the appropriate API libraries
|
|
- Dynamically populate the calendarEvents state with real data
|
|
- Display events correctly with provider-specific styling
|
|
- Handle loading and error states gracefully
|
|
</action>
|
|
<verify>Verify WeeklyView component fetches and displays actual calendar events from connected calendars instead of mock data</verify>
|
|
<done>WeeklyView component displays real calendar events from connected calendars</done>
|
|
</task>
|
|
</tasks>
|
|
|
|
## Verification
|
|
|
|
After completing these tasks, the following checks should pass:
|
|
- Calendar events are fetched from real calendar APIs instead of using mocked data
|
|
- WeeklyView component displays actual calendar events instead of mock data
|
|
- Bidirectional sync performs real operations instead of just logging to console
|
|
- All calendar API integration functions properly interact with their respective services
|
|
- Proper error handling is implemented for API failures
|
|
|
|
## Success Criteria
|
|
|
|
All gaps identified in the VERIFICATION.md for calendar event fetching and sync implementations are resolved:
|
|
- Calendar events are fetched from real APIs instead of mock data
|
|
- WeeklyView component displays real calendar events
|
|
- Bidirectional sync performs actual database/calendar API operations
|
|
- All calendar API integrations work with real services |