Issue: ActivityPage and route guards showed "not authenticated"
even when Plex was linked via Settings page.
Root cause: Plex user data stored in localStorage but route guards
and ActivityPage only checked Vuex store (state.settings.plexUserId).
Changes:
- Update routes.ts hasPlexAccount() to check both:
1. Vuex store (user/plexUserId)
2. localStorage (plex_user_data) as fallback
- Update ActivityPage plexUserId computed to check both:
1. Vuex store first
2. localStorage plex_user_data.id as fallback
Why two sources?
- Vuex store: Set from JWT token (backend user settings)
- localStorage: Set immediately when linking Plex account
- localStorage persists across page reloads
- Provides seamless experience without backend round-trip
Now Activity page correctly shows data when Plex is linked ✓
Major improvements to Plex integration:
- Replace Vuex store dependency with localStorage-based connection detection
- Fetch and display real Plex user data (username, email, subscription, 2FA status)
- Add user badges: Plex Pass, member years, 2FA, experimental features
- Properly format Unix timestamp joined dates
- Remove success message box, add elegant checkmark icon next to username
- Add Plex connection badge to main user profile
Real-time Plex API integration:
- Fetch actual library counts from Plex server (movies, shows, music)
- Display real server name from user's Plex account
- Load recently added items with actual titles, years, and ratings
- Calculate real genre statistics from library metadata
- Compute actual duration totals from item metadata
- Count actual episodes (TV shows) and tracks (music)
- Sync library on demand with fresh data from Plex API
Interactive library modal:
- Replace toast messages with rich modal showing library details
- Display recently added items with poster images
- Show genre distribution with animated bar charts
- Add loading states with animated dots
- Disable empty library cards
- Modal appears above header with proper z-index
- Blur backdrop for better focus
- Fully responsive mobile design
Store Plex data in localStorage:
- Cache user profile data including subscription info
- Store auth token in secure cookie (30 day expiration)
- Load from cache for instant display on page load
- Refresh data on authentication and manual sync
Add Plex connection indicator to user profile:
- Orange Plex badge in settings profile header
- Shows 'Connected as [username]' below member info
- Loads username from localStorage on mount
* On every route change, update local variables from query params
* ResultSection is keyed to query to force re-render
* Resolved lint warnings
* replace webpack w/ vite
* update all imports with alias @ and scss
* vite environment variables, also typed
* upgraded eslint, defined new rules & added ignore comments
* resolved linting issues
* moved index.html to project root
* updated dockerfile w/ build stage before runtime image definition
* sign drone config
