Add intelligent caching and auto-refresh for external calendars

Implements server-side database caching with 5-minute refresh intervals to
dramatically improve external calendar performance while keeping data fresh.

Backend changes:
- New external_calendar_cache table with ICS data storage
- Smart cache logic: serves from cache if < 5min old, fetches fresh otherwise
- Cache repository methods for get/update/clear operations
- Migration script for cache table creation

Frontend changes:
- 5-minute auto-refresh interval for background updates
- Manual refresh button (🔄) for each external calendar
- Last updated timestamps showing when each calendar was refreshed
- Centralized refresh function with proper cleanup on logout

Performance improvements:
- Initial load: instant from cache vs slow external HTTP requests
- Background updates: fresh data without user waiting
- Reduced external API calls: only when cache is stale
- Scalable: handles multiple external calendars efficiently

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Connor Johnstone
2025-09-03 22:06:32 -04:00
parent 6a01a75cce
commit 28b3946e86
7 changed files with 289 additions and 91 deletions

View File

@@ -3816,6 +3816,37 @@ body {
white-space: nowrap;
}
.external-calendar-actions {
display: flex;
align-items: center;
gap: 0.5rem;
flex-shrink: 0;
}
.last-updated {
font-size: 0.7rem;
color: rgba(255, 255, 255, 0.6);
opacity: 0.8;
}
.external-calendar-refresh-btn {
background: none;
border: none;
color: rgba(255, 255, 255, 0.7);
cursor: pointer;
font-size: 0.8rem;
padding: 2px 4px;
border-radius: 3px;
transition: all 0.2s ease;
line-height: 1;
}
.external-calendar-refresh-btn:hover {
color: rgba(255, 255, 255, 0.9);
background: rgba(255, 255, 255, 0.1);
transform: rotate(180deg);
}
.external-calendar-indicator {
font-size: 0.8rem;
opacity: 0.7;