- Add Settings link to desktop nav bar for admin users
- Rewrite Settings page from table layout to responsive card list (fixes unusable mobile state)
- Filter bar (Dashboard + Comparison): collapsible panel on mobile via display:contents trick; stacked full-width dropdowns replace horizontal scroll
- Active filter count badge shown in collapsed filter header
- AltMultiSelect dropdowns go full-width on mobile to prevent viewport overflow
- Chart control separators hidden on mobile to avoid crowding
- Metric grid: 2-col at ≤700px, 1-col at ≤480px
- Comparison period cards: smaller font and tighter padding at ≤680px
- Page shell padding reduced on mobile (48px→20px top, 24px→16px sides)
- Settings page gets correct 80px bottom padding for mobile nav
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Addresses remaining medium and low severity audit findings:
- H2: Dark mode @media selector narrowed to :root:not([data-theme]) so
OS-preference and manual-override blocks are now mutually exclusive
- L2: Remove ~410 lines of dead Slides Builder CSS (no component exists)
- M2: VAT toggle uses flex spacer instead of margin-inline-start:auto,
preventing layout break when filter bar wraps at medium-small widths
- M3: Page content max-width aligned to 1400px (matches nav bar)
- M5: Period picker toggle now has aria-controls="period-picker-panel"
pointing to the InlinePicker root in both Dashboard and Comparison
- M6: Offline badge cache timestamp exposed via sr-only span for
screen reader accessibility (was title-only before)
- M7: chartOpts/barHorizOpts/barNoLegend wrapped in useMemo([baseOpts])
to prevent unnecessary Chart.js re-renders
- L4: Filter bar scrolls horizontally on mobile instead of wrapping
- L5: Metrics grid uses auto-fit/minmax to eliminate orphaned cards
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Replace Dashboard/Comparison with DashboardDemo/PeriodSelectorDemo as primary pages at / and /comparison
- New editorial design: DM Serif Display + Outfit fonts, inline period picker, multi-select filters for museum/channel/district
- Full Arabic RTL support with IBM Plex Sans Arabic; EN/AR toggle synced to global LanguageContext
- Bar/pie chart toggle + absolute/percent toggle for museum, channel, district charts
- Refined top nav: transparent inactive links, accent active state, visual separator between nav links and utilities
- DateRangePicker, MultiSelect, FilterControls shared components added
- NavDemo: sidebar layout alternative (accessible at /nav-demo)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- PATCH /api/users/:id route to update user permissions
- Auth session stores and returns allowedMuseums/allowedChannels
- User type gains AllowedMuseums/AllowedChannels (JSON string fields)
- parseAllowed() with fail-closed semantics (empty string → null → no data)
- Dashboard/Comparison apply permission base filter before user filters
- Filter dropdowns (museums, channels, years, districts) derived from
permission-filtered data — restricted users only see their allowed options
- Settings UserRow component with inline checkbox pickers for access config
- Access badges in users table showing current restriction summary
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Server checks PIN against env (super admin) + NocoDB Users table
- Session stores name + role (admin/viewer)
- Admin: sees Settings page (seasons + users management)
- Viewer: sees Dashboard + Comparison only, no Settings
- Users CRUD on Settings page: add name + PIN + role, delete
- Settings link + nav hidden for non-admin users
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Server: POST /auth/login (verify PIN, set httpOnly cookie)
- Server: GET /auth/check, POST /auth/logout
- Client: Login page shown when not authenticated
- Session persists 7 days via httpOnly cookie
- PIN stored server-side only (ADMIN_PIN env var)
- Dashboard loads data only after successful auth
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Server: seasons CRUD routes + generic NocoDB helpers
- Client: Settings page at /settings with inline add/edit/delete
- Seasons stored in NocoDB Seasons table
- Vite proxy: /api/seasons routed to Express server
- Nav links added (desktop + mobile)
- Locale keys for EN + AR
- Seasons loaded non-blocking on app mount
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Remove Slides route, import, and mobile nav link from App.tsx
- Remove Salla route mounting and console output from server
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Default to light theme instead of system preference, and update
dashboard subtitle to reflect VivaTicket as the data source.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Add prefers-color-scheme: dark media query for automatic dark mode
- Add data-theme attribute for manual override (persisted to localStorage)
- 3-state cycle: system → dark → light → system
- Theme toggle button in nav with contextual icon (sun/moon/half)
- Dark palette: slate-900 bg, slate-800 surfaces, adjusted text/accent/success/danger
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Add aria-labels to icon-only buttons (refresh, language toggle)
- Add aria-hidden to decorative SVGs
- Add aria-label to data source select
- Replace outline:none with visible focus rings on all inputs/selects
- Add <main> landmark for screen reader navigation
- Add prefers-reduced-motion: disable all animations for vestibular safety
- Move error message inline style to CSS class
- Add aria-label to both nav landmarks
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Lazy-load Dashboard, Comparison, Slides via React.lazy + Suspense
- Main bundle reduced from 606KB to 256KB
- Replace full-screen spinner with skeleton cards during load
- Skeleton used for both initial data fetch and route transitions
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Convert all .js files to .tsx/.ts
- Add types for data structures (MuseumRecord, Metrics, etc.)
- Add type declarations for react-chartjs-2
- Configure tsconfig with relaxed strictness for gradual adoption
- All components now use TypeScript
fahed