Commit graph

1266 commits

Author SHA1 Message Date
senke
1b2079dcdd chore(frontend): remove or simplify ghost features (Developer Dashboard, Education/Gamification/Studio) 2026-02-15 16:03:43 +01:00
senke
7962c8f1b9 fix(frontend): connect social feed to backend with proper actor mapping 2026-02-15 16:02:49 +01:00
senke
f4c2acdd02 refactor(frontend): document chat store as single source of truth 2026-02-15 16:02:14 +01:00
senke
b9875c5e92 test(e2e): audit 2.10 — flows critiques Auth, Upload, Purchase, Chat
- purchase.spec.ts: add to cart, checkout, success
- chat.spec.ts: load UI, send message (when WebSocket available)
- README: document critical flows and prerequisites
2026-02-15 14:51:29 +01:00
senke
22e5e21757 chore(audit 2.4, 2.5): supprimer code mort Education et cmd/modern-server
- Supprimer routes/handlers/core Education (backend)
- Supprimer handler MSW education, refs Sidebar/locales
- Basculer Makefile, make/dev.mk, scripts vers cmd/api/main.go
- Supprimer veza-backend-api/cmd/modern-server/
2026-02-15 14:39:40 +01:00
senke
8b1644640d refactor(audit-2.1,2.6): unify views and pages to features/*/pages pattern
- Migrate LiveView, GearView, PurchasesView, SocialView, AnalyticsView into features
- Create features: admin, developer, seller; add QueuePage, WishlistPage
- Migrate pages/marketplace to features/marketplace
- Remove components/views/ and pages/ legacy directories
- Update lazyExports, docs (ARCHITECTURE)
- Mark audit 2.1, 2.6 as done

Refs: AUDIT_TECHNIQUE_INTEGRAL_2026_02_15.md items 2.1, 2.6
2026-02-15 14:30:40 +01:00
senke
aceba5d991 fix(security): add JWT auth to HLS endpoints (audit 1.3, P0)
- Add hls_auth_middleware in stream server (Bearer + ?token=)
- Apply auth to /hls/:track_id/* routes
- Update frontend hlsService to use stream server URL + pass JWT via xhrSetup
- Add getHLSXhrSetup() and getHLSURLWithToken() for hls.js integration
- Add VITE_HLS_BASE_URL config (derived from VITE_STREAM_URL when unset)
- Add unit tests for token extraction and HLS helpers
- Mark audit item 1.3 as done
2026-02-15 12:48:58 +01:00
senke
f4c78fdf69 fix(auth): correct 2FA login flow and documentation
- Fix misleading comment in TwoFactorVerify (authApi.verify2FA is for setup, not login)
- Add MSW handler for POST /auth/login/2fa
- Improve error display in AuthViewContent when 2FA verification fails
- Add integration test for 2FA login flow
- Update AUDIT_TECHNIQUE_INTEGRAL

Refs: AUDIT_TECHNIQUE_INTEGRAL_2026_02_15.md item 1.2 (P0)
2026-02-15 12:42:48 +01:00
senke
45ebcb8cad docs: update TODO audit docs after Phase 3 2026-02-14 22:45:48 +01:00
senke
c2296ac1c6 test(e2e): add post-deploy smoke tests
- Add smoke-post-deploy.spec.ts for health checks
- Add playwright.config.smoke.ts (no webServer)
- Add smoke-post-deploy job to cd.yml (runs when STAGING_URL set)
- Document procedure in e2e/README.md
2026-02-14 22:45:10 +01:00
senke
d70f67f2fc feat(web): add CDN support for assets and audio
- Add VITE_CDN_URL, VITE_CDN_ENABLED to .env.example
- Create getAssetURL, getAudioURL in utils/cdn.ts
- Use getAudioURL in hlsService for HLS stream URLs
2026-02-14 22:44:06 +01:00
senke
75c027c5bd feat(web): add Zustand store migration strategy
- Document migration approach in ZUSTAND_MIGRATION_STRATEGY.md
- Add persistWithMigration utility for future stores
- Add version and migrate to authStore, library, ui, cartStore, playerStore
2026-02-14 22:43:06 +01:00
senke
791eedccae feat(web): propagate AbortSignal in TanStack Query hooks
- Add useAbortSignal hook for component lifecycle cancellation
- Pass signal to apiClient in useLibraryItems, useUser, useDashboard,
  useMyTracks, useNotificationMenu
- Prevents memory leaks when navigating away during fetch
2026-02-14 22:41:46 +01:00
senke
8ed5b2848c chore(web): remove ghost features Education, Gamification, Studio
- Remove LazyEducation, education-view, components/education
- Delete educationService, handlers-ghost
- Remove EDUCATION, GAMIFICATION, STUDIO flags from features.ts
- Update FEATURE_STATUS.md
2026-02-14 22:40:12 +01:00
senke
7c7580be4d refactor(auth): consolidate AuthContext to authStore, update Storybook 2026-02-14 22:06:22 +01:00
senke
92f432fb9e chore: consolidate pending changes (Hyperswitch, PostCard, dashboard, stream server, etc.) 2026-02-14 21:45:15 +01:00
senke
abb6668205 fix(web): disable ghost feature routes (Education, Gamification, Studio) 2026-02-14 20:19:23 +01:00
senke
6e06cb4fd7 refactor(frontend): split MarketplaceHome skeleton into separate component 2026-02-14 18:33:52 +01:00
senke
3635fae380 fix(tests): resolve playlistService skipped tests, document requestDeduplication flag 2026-02-14 18:13:01 +01:00
senke
ae586f6134 Phase 2 stabilisation: code mort, Modal→Dialog, feature flags, tests, router split, Rust legacy
Bloc A - Code mort:
- Suppression Studio (components, views, features)
- Suppression gamification + services mock (projectService, storageService, gamificationService)
- Mise à jour Sidebar, Navbar, locales

Bloc B - Frontend:
- Suppression modal.tsx deprecated, Modal.stories (doublon Dialog)
- Feature flags: PLAYLIST_SEARCH, PLAYLIST_RECOMMENDATIONS, ROLE_MANAGEMENT = true
- Suppression 19 tests orphelins, retrait exclusions vitest.config

Bloc C - Backend:
- Extraction routes_auth.go depuis router.go

Bloc D - Rust:
- Suppression security_legacy.rs (code mort, patterns déjà dans security/)
2026-02-14 17:23:32 +01:00
senke
794270597a fix(web): stabilize Vitest suite (auth integration: wrap with QueryClientProvider) 2026-02-14 14:21:17 +01:00
senke
4be5988f8e chore(e2e): run 2FA test when E2E_2FA_CODE (and optional creds) are set, document in README 2026-02-14 14:06:46 +01:00
senke
fa719e31e5 feat(e2e): add play flow test (library/search -> track page or player) 2026-02-14 14:04:36 +01:00
senke
4dcae6ca00 feat(web): add validate:storybook script (build, serve 6007, audit) 2026-02-14 14:02:57 +01:00
senke
2119833779 fix(e2e): stabilize auth, smoke, search, playlists specs
- Global setup no longer throws when API is unavailable; writes empty
  auth state so Playwright can start; specs that need auth use their
  own login or storageState override.
- Ensure e2e/.auth dir exists before writing empty state.
2026-02-14 14:02:13 +01:00
senke
37981c2c17 chore(refactor/sumi-migration): commit pending changes — tests, stream server, dist_verification
- apps/web: test updates (Vitest/setup), playbackAnalyticsService, TrackGrid, serviceErrorHandler
- veza-common: logging, metrics, traits, validation, random
- veza-stream-server: audio pipeline, codecs, cache, monitoring, routes
- apps/web/dist_verification: refresh build assets (content-hashed filenames)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-13 19:39:18 +01:00
senke
de12f5036c fix(web): resolve all 568 TypeScript errors — tsc --noEmit now passes with zero errors
Major categories fixed:
- TS6133 (188): Remove unused imports (React, icons, types) and variables
- TS2322 (222): Fix type mismatches in stories (satisfies Meta -> const meta: Meta),
  add nullish coalescing for optional values, fix component prop types
- TS2345 (43): Fix argument type mismatches with proper null checks and type narrowing
- TS2741 (21): Add missing required properties to mock/story data
- TS2339 (19): Fix property access on incorrect types, add type guards
- TS2353 (13): Remove extra properties from object literals or extend interfaces
- TS2352 (11): Fix type conversion chains
- TS2307 (9): Fix import paths and module references
- Other (42): Fix implicit any, possibly undefined, export declarations

Vite build and tsc --noEmit both pass cleanly.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-13 00:32:08 +01:00
senke
09bb663659 chore: enable noUncheckedIndexedAccess, isolate ghost MSW handlers, document go-clamd tech debt
- Enable TypeScript noUncheckedIndexedAccess and fix 133 resulting errors
  across 46 files with proper null guards, optional chaining, and fallbacks
- Extract education/gamification ghost feature MSW handlers into handlers-ghost.ts
- Add Storybook test plugin documentation in vitest.config.ts
- Document abandoned go-clamd dependency (2017) as tech debt in upload_validator.go

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 23:12:35 +01:00
senke
1695606e24 refactor(ui): remove unused design-system package and create STORYBOOK_CONTRACT
- Remove packages/design-system/ directory (superseded by SUMI tokens
  in apps/web/src/index.css, confirmed no imports exist)
- Update package.json keywords from kodo-design-system to sumi-design-system
- Create docs/STORYBOOK_CONTRACT.md defining mandatory story structure:
  Default, Loading, Error, Empty states for feature components
- Typography audit: SUMI utility classes defined in index.css, codebase
  correctly uses Tailwind classes with SUMI tokens via @theme — no
  migration needed

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 23:00:26 +01:00
senke
34e9d69af3 fix(tests): add missing component tests and fix failing tests
- Fix setTimeout memory leak in ChatRoom.tsx by storing timeout in
  useRef and cleaning up on unmount
- Add tests for Accordion, Collapsible, FloatingInput, AnimatedNumber,
  and FAB components (5 new test files, all passing)
- Fix socialService methods (deleteComment, markRead, markAllRead) to
  return values matching test expectations
- Fix MSW handlers for chat/token and notification endpoints to use
  proper { success: true, data: ... } envelope format
- Fix invalid CSS selector in TrackList.test.tsx that caused JSDOM crash
- Document excluded test files with TODO tickets in vitest.config.ts

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 22:59:09 +01:00
senke
45bdf060ca feat(backend): add social groups, wishlist, cart, and playlist export endpoints
- Add Group and GroupMember models with CRUD service methods
- Implement social group endpoints: create, list, get, join, leave
- Add WishlistItem model with get/add/remove service methods
- Add CartItem model with get/add/remove/checkout service methods
- Create handlers for marketplace wishlist and cart operations
- Register playlist export (JSON/CSV) and duplicate routes
- Enable PLAYLIST_SHARE and NOTIFICATIONS feature flags

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 22:48:50 +01:00
senke
8365cbfa6f refactor: LoadingState delegates all spinner rendering to LoadingSpinner
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 22:23:16 +01:00
senke
0faa20d644 fix: resolve ts-ignore directives and unsafe type casts
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 22:21:55 +01:00
senke
24b2c2fb84 test: add tests for ErrorDisplay, LoadingState, ComingSoon
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 22:19:54 +01:00
senke
a68e776797 a11y: enhance global prefers-reduced-motion support
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 22:18:36 +01:00
senke
1acfca86b1 fix: remove as any casts from application components
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 22:17:55 +01:00
senke
2f46712789 fix: type authService.login, replace remaining console.error with logger
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 22:15:10 +01:00
senke
958d40896c perf: improve bundle splitting -- separate framer-motion, axios, dompurify, i18n chunks
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 22:04:56 +01:00
senke
df85544a8f refactor: unify loading components -- consolidate Spinner into LoadingSpinner
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 22:04:45 +01:00
senke
53c9e42d9c refactor: complete Modal to Dialog migration for 6 modals
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 22:01:05 +01:00
senke
ed6d209b92 refactor: replace console.log with logger, fix TrackCard type, memoize DashboardPage
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 21:57:02 +01:00
senke
e5fd019edf a11y: skip link exists in App, ChatInput aria-label, sidebar focus trap, MiniPlayer aria-live
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 21:55:25 +01:00
senke
9f7a42cdb5 fix: memory leaks -- add setTimeout cleanup in ChatInput, SocialViewFeedItem, PostCard
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 21:54:06 +01:00
senke
d919f8c7c9 fix: critical bugs -- ChatInput var, authService types, dep placement
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 21:53:39 +01:00
senke
37dae9e646 fix(a11y): Sprint 7 — semantic HTML and accessibility deep-dive
S7.1: Replace div onClick with semantic button in DialogTrigger.tsx
S7.2: Replace role="button" divs with native <button> elements in 12 files
      (PlaylistCard, TrackCard, ConversationItem, NotificationMenuItem,
       AudioPlayerTrackInfo, SearchPageResults, ProjectsManagerAddCard,
       ProjectsManagerCard, GearInventoryGrid, UploadModal, dropdown.tsx,
       LibraryPageGrid)
S7.3: Add focus-visible:ring-2 to 14 form inputs with outline-none across
      9 modal files (CreateGroupModal, DataExportModal, EditPlaylistModal,
      AddToPlaylistModal, BanUserModal, RefundRequestModal, FlashSaleModal,
      TipStreamerModal, CreatePostModal)
S7.4: Add semantic landmarks — <section> in DashboardPage, <article> in
      PostCard and CourseCard

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 10:34:39 +01:00
senke
5f88c56113 fix: UI remediation Phase 1 (S0-S5) + Phase 2 Sprint 6 shadow system
Phase 1:
- S0: Fix open redirect (safeNavigate), delete AuthContext/legacy auth, encrypt API keys, gitignore .env files
- S1: Split client.ts god object into 5 modules, unify toast system, delete unused Sidebar
- S2: Add glass button variant, migrate 32 z-index to SUMI tokens, fix card dark mode
- S3: Skip nav link, aria-hidden on icons, focus-visible ring fixes, alt attrs, aria-live regions
- S4: React.memo on list items, fix key={index}, loading=lazy on images
- S5: Branded loading screen, page transitions respect reduced-motion, LikeButton micro-interaction, i18n sidebar/header

Phase 2 Sprint 6:
- Wire Tailwind shadow utilities to SUMI tokens in @theme block (fixes 50+ files)
- Define shadow-card/shadow-card-hover tokens
- Remove dark:shadow-none workarounds from card.tsx (SUMI handles per-theme shadows)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 10:13:44 +01:00
senke
34e1f41091 refactor: Phase 8 — Update docs, ESLint, Storybook config for SUMI
- DESIGN_TOKENS.md: Complete rewrite to document --sumi-* token system
- APP_SHELL.md: Update layout shell docs (glass bg, backdrop-blur, z-index)
- DESIGN_DIRECTION.md: Update aesthetic direction to SUMI philosophy
- .storybook/preview.tsx: Remove deleted CSS imports, update bg colors
- eslint.config.js: Update color rule message from Kodo to SUMI tokens
- tailwind.config.ts: Fix comment referencing deleted design-tokens.css

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 02:15:11 +01:00
senke
73e8372b0e refactor: Phase 7 — Clean up legacy components and remove dead tokens
- Bulk replace text-white → text-foreground across 116 component files
  (preserving text-white/ opacity variants)
- Remove hover-glow-cyan, shadow-card-glow-cyan, shadow-button-primary-glow
  classes from all components
- Replace --duration-normal/--duration-immersive/--duration-slow with
  --sumi-duration-normal/--sumi-duration-slow across 130+ files
- Replace --ease-out/--ease-in-out with --sumi-ease-out/--sumi-ease-in-out
- Replace focus:ring-blue-500 → focus:ring-primary (4 files)
- Remove hover:scale-105/110 and hover:-translate-y-1/0.5 transforms
  (SUMI anti-pattern: no scale on hover)
- Clean up stale kodo- references in comments

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 02:09:29 +01:00
senke
69e40e3c04 refactor: Phase 6 — Migrate feature modules to SUMI tokens
- auth: Replace gray-* with muted/border tokens, text-foreground
- settings: TwoFactorSettings + NotificationSettings text-foreground
- chat: ChatInput, ConversationItem, ChatPage — text-foreground,
  remove kodo references
- player: PlayerExpanded, PlayerQueue, PlayerControls — text-foreground,
  remove cyan/magenta gradients
- playlists: All components — text-foreground for badges/headings
- tracks: TrackCard, TrackListRow — text-foreground, remove glow effects
- studio: FileGridCard — text-foreground
- library: LibraryPageGrid — remove hover-glow-cyan, shadow-card-glow-cyan
- profile: UserProfilePageHeader — text-foreground

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 02:06:28 +01:00
senke
3c2e3fdf4f refactor: Phase 5 — Migrate layout shell to SUMI tokens
- Sidebar: bg-raised, border-faint tokens
- Header: glass bg + backdrop-blur-12px, z-200 sticky, SUMI durations
- PlayerBarGlass: glass-bg + blur-16px, accent colors, remove glow
- PlayerBarProgress: solid accent fill, SUMI border tokens
- PlayerBarRight/TrackInfo: text-foreground, SUMI border tokens
- MiniPlayer: glass-bg, border-faint, z-200, SUMI shadows
- GlobalPlayer: SUMI z-index and duration tokens
- DashboardLayout: SUMI z-raised, duration tokens

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 02:01:39 +01:00
senke
39a99168d9 refactor: Phase 4 — Update UI primitives to SUMI design system
- button.tsx: Remove gaming/terminal/nature/glass variants, add link variant,
  add focus-visible glow, remove scale transforms and neon shadows
- card.tsx: Remove glass/glow/glowMagenta variants, update radius to rounded-lg,
  remove hover translate transforms
- modal.tsx: Update backdrop to bg-black/60 + blur(4px), bg-popover,
  SUMI easing curves and durations
- badge.tsx: Terminal variant aliased to success, doc updates
- avatar.tsx: Already migrated, doc updates
- progress.tsx: Fix gradient colors to SUMI semantics
- input.tsx: bg-background, border-border, SUMI focus glow
- textarea.tsx: Add SUMI focus glow

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 01:58:15 +01:00
senke
fe63c7188e refactor: Phase 3 — Semantic color + hex + z-index migration
Phase 3b: Replace hardcoded hex colors with SUMI palette values
- #66FCF1 (neon cyan) → #7c9dd6 (sumi-accent) across all files
- #3b82f6 (blue-500) → #7c9dd6 in chart components
- #36E5D1 → #7a9e6c (sage), #E4B314 → #c9a84c (gold)
- #E63946 → #d4634a (vermillion)
- Update ThemeSwitcher, AppearanceSettings, SwaggerUI, chart components

Phase 3c: Normalize z-index to SUMI scale
- z-[100] (modals) → z-[400] (--sumi-z-modal)
- z-[110] (player expanded, search) → z-[500] (--sumi-z-popover)
- z-[200] (image viewer) → z-[500]
- z-[35] (navbar overlay) → z-[300] (--sumi-z-overlay)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 01:54:47 +01:00
senke
fa56dfa77e refactor: Phase 3a — Global color class migration to SUMI semantics
- Replace all kodo-* color classes across ~100 TSX files:
  kodo-void → background, kodo-ink → card, kodo-graphite → muted,
  kodo-steel → muted-foreground, kodo-cyan → primary, kodo-magenta → destructive,
  kodo-lime → success, kodo-red → destructive, kodo-gold → warning
- Replace cyan-500, magenta-500, lime-500 default Tailwind colors with
  semantic equivalents (primary, destructive, success)
- Fix WaveformVisualizer hardcoded hex colors to SUMI values
- Delete global-effects.css (conflicting, redundant with index.css)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 01:51:49 +01:00
senke
24b4cce8ea refactor: Phase 2 — Font migration to SUMI stack
- Update Google Fonts: Inter + Space Grotesk + JetBrains Mono + Noto Serif JP
- Remove: Orbitron, Barlow, Source Serif 4, IBM Plex Mono, Noto Sans JP
- Replace all font-display (Orbitron) references with font-heading (Space Grotesk)
  across ~70 TSX files

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 01:49:07 +01:00
senke
f64a85414c refactor: Phase 1 — SUMI token foundation
- Rewrite index.css with complete SUMI token system (dark + light themes)
- All --sumi-* variables: backgrounds, surfaces, borders, text, pigments,
  spacing, radius, shadows, glass, scrollbar, motion, z-index, layout
- shadcn/Radix semantic mapping (--background, --foreground, etc.)
- Tailwind @theme mapping with new fonts (Inter, Space Grotesk, JetBrains Mono)
- SUMI keyframe animations (sumi-fade-in, sumi-slide-up, sumi-scale-in, etc.)
- Delete 11 redundant CSS files (design-system.css, design-tokens.css,
  button.css, card.css, input.css, badge-avatar.css, header.css,
  fix-input-focus.css, fix-login-form.css, visual-enhancements.css,
  premium-utilities.css)
- Update main.tsx: single CSS import (index.css only)
- Update ThemeProvider: data-theme attribute instead of .dark class toggle
- Update index.html FOUC script: data-theme attribute

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 01:48:01 +01:00
senke
576873d319 chore: stub educationService to fix broken build
Add a minimal educationService stub that returns empty data,
unblocking the build before the SUMI design system migration.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 01:43:16 +01:00
senke
c707779273 chore(web): remove ghost frontend services for unimplemented features
Delete service files and their tests for features with no backend:

- educationService.ts + test (Education feature)
- gamificationService.ts + test (Gamification/XP feature)
- gearService.ts + test (Gear/Equipment feature)

The routes for these features are now gated behind ComingSoon
placeholders (C8), so these service modules are unreachable dead code.

Note: The corresponding UI components (gamification/, inventory/,
education-view/) still exist but are orphaned. They can be removed
in a separate cleanup pass.

Addresses audit finding D14: ghost frontend services.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 23:25:33 +01:00
senke
e56f63168d chore(web): remove orphaned legacy test files for deleted services
Delete 3 test files that import from service modules that no longer exist
after the previous service consolidation:

- services/__tests__/trackService.test.ts (imports ../trackService)
- services/__tests__/playlistService.test.ts (imports ../playlistService)
- services/playlistService.test.ts (imports ./playlistService)

These caused import resolution failures in test runs.

Addresses audit finding D6: orphaned test files.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 23:23:48 +01:00
senke
2501babba1 fix(web): gate ghost routes behind ComingSoon placeholder component
- Create ComingSoon.tsx: simple placeholder showing feature name and
  "under development" message with proper Tailwind styling
- Replace LazyGear, LazyLive, LazyEducation, LazyQueue, LazyDeveloper
  route elements with <ComingSoon feature="..." />
- Remove unused lazy imports for ghost components

Users navigating to /gear, /live, /education, /queue, /developer will
now see a clear "Coming Soon" message instead of broken components
that depend on non-existent backend APIs.

Addresses audit finding D5: 5 ghost routes without backend.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 23:23:26 +01:00
senke
03c9d97b90 chore(web): document ghost routes with no backend implementation
Mark /gear, /live, /education, /queue, /developer routes as PLANNED
with a comment indicating no backend exists yet. These routes render
frontend components but have no corresponding API endpoints.

No routes removed — this is documentation only, zero regression risk.

Addresses audit finding: section 2 (product/code inconsistencies).

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 22:56:48 +01:00
senke
5f7afd6b53 fix(web): enable noUncheckedIndexedAccess in tsconfig
Enable the TypeScript strict flag `noUncheckedIndexedAccess` which ensures
that indexed access (arrays, Record types) includes `| undefined` in the
result type, catching potential runtime errors at compile time.

Current state:
- 493 pre-existing type errors (before this flag)
- ~234 additional errors introduced by this flag
- Errors should be fixed progressively, prioritizing features/ and services/
- Pattern: use optional chaining (value?.) or null checks (if (value != null))

This flag was previously commented out with a TODO. Enabling it now ensures
new code is written safely, even as existing errors are addressed over time.

Addresses audit finding: debt item 10 (TypeScript strictness).

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 22:56:26 +01:00
senke
0a269ed664 chore: remove dead code, backups, and deprecated docker-compose files
Removed files:
- apps/web/src/utils/storeSelectors.ts.backup (committed backup file)
- apps/web/desy/ (69 files, unused legacy design system)
- docker-compose.production.yml (root, superseded by docker-compose.prod.yml)
- config/docker/docker-compose.production.yml (deprecated copy)
- veza-stream-server/docker-compose.production.yml (deprecated copy)

Annotated ghost features in MSW handlers:
- Education endpoints marked as GHOST FEATURE (no backend)
- Gamification endpoints marked as GHOST FEATURE (no backend)

Not removed (out of scope for this commit):
- veza-desktop/ and veza-mobile/ (separate issue)
- Root-level audit markdown reports (product owner decision)

Addresses audit findings: debt items 12-18 (dead code, ghost features).

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 22:52:59 +01:00
senke
32029d5718 refactor(web): consolidate duplicate services into feature modules
- Migrate 5 files from legacy services/trackService to feature-based
  tracks/services/trackService
- Migrate 1 file from legacy services/playlistService to feature-based
  playlists/services/playlistService
- Add missing functions to feature trackService: search, like, unlike,
  recordPlay, download, upload, getStatus
- Add backward-compatible `trackService` and `playlistService` object
  exports that match legacy API signatures (no call-site changes needed)
- Delete legacy apps/web/src/services/trackService.ts
- Delete legacy apps/web/src/services/playlistService.ts

Addresses audit finding: debt item 6 (duplicate services).

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 22:52:09 +01:00
senke
c02e30b417 chore(web): update .env.local and .env.storybook for domain config
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 22:20:31 +01:00
senke
8a0f008345 chore: playwright workflow, docs, rapports audit, visual-tests, tmt unit
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 22:19:34 +01:00
senke
3c742c3576 test(web): player, playlists, tracks tests; feat(playlists): permissions utils
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 22:19:24 +01:00
senke
3b2ff9faa8 test(web): add unit tests for chat feature (P3.3)
- ChatMessages: fix mock structure, align with store shape (messages Record, conversations)
- ChatInput: add tests for render, submit, disabled state
- ChatMessage: add tests for content, reactions, addReaction
- fix ChatMessage.tsx: remove stray // ... comment

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 22:15:13 +01:00
senke
a6bafcbcc5 feat(web): externalize feature flags via VITE_FEATURE_* env vars (P3.2)
- Parse VITE_FEATURE_* from env with fallback to current defaults
- Add all flags to .env.example and ENV_CONFIG.md
- parseFeatureEnv accepts true/1/yes for enabled

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 22:11:38 +01:00
senke
ceec16fbd5 fix(security): upgrade axios to fix CVE
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 19:51:39 +01:00
senke
c458b7c597 fix(tests): cycle 20 – PlaylistForm flaky tests
- fireEvent.change/click au lieu de userEvent pour create/update/custom onSubmit
- description max length: fireEvent pour éviter timeout (2001 chars)
- expect.objectContaining pour assertions plus résilientes
- RAPPORT: cycle 20

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 09:51:44 +01:00
senke
1e2093f79b fix(tests): cycle 19 – playlistService MSW et handlers
- Supprimer handler wildcard playlists* qui masquait les spécifiques
- Réordonner: search et recommendations avant :id (évite id=search/recommendations)
- Handlers: GET recommendations, POST :id/share, search avec query empty
- list items: ajout title
- create: body.title → data.title/name, track_count, like_count
- Tests: addTrack(plId,trackId), removeTrack, createShareLink(plId)
- Assertions: getRecommendations.playlists, update retourne objet
- RAPPORT: cycle 19

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 09:48:36 +01:00
senke
ccc233e1ea fix(tests): cycles 12–18 – corrections services, mocks et design tokens
- chatService: getChannels → getServers
- commerceService: getOrders/getOrderDetails/getSalesStats → getPurchases/getSellerStats
- marketplaceService: mock réponse, params API, getDownloadLink → listOrders
- config/env.test: vi.stubEnv, import dynamique
- useAuth.test: mock useAuthStore
- TrackStatsDisplay, UploadQuota: mock du bon service (analyticsService, uploadService)
- TrackListEmpty, TrackListRow, TrackSearch: design tokens, assertions
- trackDownloadService, chunkedUploadService: MSW/server.use
- trackListService, trackSearchService, trackShareService: assertions
- ErrorBoundary, LoginForm, PlaylistErrorBoundary, PlaylistRecommendations
- RAPPORT_RESOLUTION_TESTS_CYCLE1.md

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-11 09:43:55 +01:00
senke
ef430d9f16 style(ui): pixel-perfect alignment for Sidebar, Header, Player via Spotify/Discord standard
- PlayerBarGlass: use semantic tokens (--player-glass-bg, --player-glass-border)
- Replace arbitrary OKLCH with CSS vars; backdrop-blur-md; rounded-xl
- Transitions: duration-[var(--duration-*)], ease-[var(--ease-out)]
- Sidebar: add border-r border-[var(--sidebar-border)] for depth
- Header: border-[var(--glass-border)] for subtle separation
- index.css: add --player-glass-bg, --player-glass-border (light + dark)
- visual baselines updated (0% diff Playwright)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 23:09:24 +01:00
senke
47f2c7c30b feat(ui): DeveloperDashboard skeleton, EmptyState, ErrorDisplay, Header transitions
- DeveloperDashboardViewSkeleton: premium skeleton for loading state
- EmptyState for API keys when none exist (variant card, Create action)
- ErrorDisplay with retry on fetch failure
- Header: duration-[var(--duration-fast)] on all interactive elements
- DeveloperDashboardView: table row hover, copy button transitions

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 22:59:51 +01:00
senke
c65da4fea6 refactor(ui): Design tokens - gradients, duration, textarea
- Replace cyan/magenta/purple gradients with primary/secondary
- duration-200/300 → duration-[var(--duration-normal)]
- Textarea: min-h-[100px] → min-h-24
- SearchPageHeader, DashboardPage, PlaylistHeader
- UserProfilePageHeader/Hero, PlaylistDetailPageHero
- SocialViewFeedItem, WishlistView, PostCard, ProductCard, CourseCard
- SearchPageResults, MarketplaceHome

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 22:56:30 +01:00
senke
2c6e5fddb1 refactor(ui): SearchPageHeader use primary/secondary tokens
- Replace cyan-400/magenta-500 with from-primary to-secondary
- Add duration token for clear button transition

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 22:53:15 +01:00
senke
149e616183 refactor(ui): Design tokens in PlaylistCard + TrackCard polish
- PlaylistCard: duration tokens, primary/secondary gradient (KŌDŌ)
- TrackCard: hover:-translate-y-0.5, ease-out token
- Remove arbitrary purple-500/pink-500, duration-200/300

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 22:52:57 +01:00
senke
557e254931 feat(ui): Header search navigates to /search on Enter
- Press Enter in header search → navigate to /search?q=query
- Add role=search, aria-label, focus-visible ring
- Use duration token for transition

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 22:52:31 +01:00
senke
95e31646cb feat(ui): Sidebar refactor, premium skeletons, ContentFadeIn transitions
- Sidebar: useSidebarNavigation hook, ARIA, token-based layout
- Layout: lg:ml-main-expanded/collapsed (replace arbitrary ml-64)
- TrackCardSkeleton + PlaylistCardSkeleton: KŌDŌ tokens, min-heights for CLS
- ContentFadeIn: 200ms fade-in with --ease-out
- TrackGrid, PlaylistList, LibraryPage: integrate skeletons + fade-in
- Player: player-bar subcomponents, useAudioAnalyser
- Tests: TrackGrid wrapper (QueryClient, ToastProvider)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 22:51:51 +01:00
senke
0f25d3c551 fix(webhooks): add DB migration and avoid 500 toast on developer portal
Backend:
- Add migrations/075_create_webhooks.sql: webhooks + webhook_failures tables
- Fixes GET /webhooks 500 (relation "webhooks" did not exist)

Frontend:
- Skip toast for 5xx on /webhooks so developer portal shows empty state
  instead of 'Une erreur serveur s'est produite' when table is missing

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 21:11:32 +01:00
senke
ae4e184fad fix(web): silence console for expected failures (CSRF, webhooks 5xx)
- csrf: no log when backend returns HTML (wrong server / not running)
- webhookService: no log for 5xx on list webhooks
- api client: no log for 5xx on /webhooks (main + queued request)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 19:51:20 +01:00
senke
ee3225a75d fix(web): reduce webhook/CSRF console noise
- webhookService: treat parsed error.code (500) as 5xx and log at DEBUG
- csrf: log 'backend may not be running' at DEBUG instead of WARN

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 19:48:48 +01:00
senke
dcaaeec962 fix(web): close Create API Key modal after successful key creation
- handleCreateKey now returns the new key so the modal receives result
- Modal handles undefined result and api_key shape; no more TypeError on result.key
- On error, parent still shows toast and rethrows so modal stays on step 1

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 19:46:32 +01:00
senke
d744715f38 fix(web): rename duplicate status variable in api client error handler
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 19:38:54 +01:00
senke
8f3b562edb fix(web): reduce developer portal console errors
- CSRF: hint uses VITE_BACKEND_PORT instead of hardcoded 8080
- Proxy: add /swagger to Vite dev server for Swagger doc.json (fixes YAMLException)
- playerService: validate media URL before load to avoid Invalid URI errors
- usePlayer: log invalid URL/network audio errors at DEBUG level
- SwaggerUI: log HTML-instead-of-JSON parse errors at DEBUG
- webhookService: log 5xx backend errors at DEBUG
- api client: log 5xx /webhooks errors at DEBUG (reduces duplicate noise)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 19:38:13 +01:00
senke
f979c6fa8f fix(web): reduce console noise when backend unavailable
- Skip retry for ERR_BAD_RESPONSE / HTML instead of JSON (wrong server)
- Log only first API retry attempt instead of all 3
- CSRF: friendly warn when wrong server, avoid duplicate logs
- App init: skip CSRF warn when wrong server (already shown)
- API client: skip CSRF refresh error log when wrong server
- ReactQuerySync: INFO → DEBUG for enable/disable messages

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 19:29:10 +01:00
senke
64fbb81ddf ui(design): Phase 3 - rounded tokens, min-w/min-h, stories, NavigationProgress
- rounded-[var(--radius-xl/md/lg/sm)] → rounded-xl, rounded-md, rounded-lg, rounded-sm
- Timeline: min-w-[200px] → min-w-50
- AddEquipmentView, MetadataForm: min-h-[100px] → min-h-25
- NavigationProgress: shadow-[...] → shadow-button-primary-glow
- Stories: ActivityGraph, StatCard, NotificationBell, LoadingState, ScrollArea, Skeleton, FileUploadZone
- Reduced arbitrary values from ~60+ to 11 (5 files, exceptions documented)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 19:24:07 +01:00
senke
4b9d0a341d ui(design): migrate ImageCropper, PlaybackSummary to layout tokens
- ImageCropper: h-[80vh] → h-layout-modal-sm (80vh)
- PlaybackSummary: h-[200px] → min-h-50 (scale Tailwind)
- Add h-layout-modal-sm utility class

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 14:07:19 +01:00
senke
298a90c763 ui(design): migrate layout arbitrary values to tokens - Phase 1
- Add layout tokens: h-layout-chat, h-layout-chat-main, h-layout-stream, h-layout-modal-full
- ChatPage: use h-layout-chat and h-layout-chat-main instead of calc(100vh-6.25rem/6rem)
- LiveStreamDetailView: use h-layout-stream
- Modal full size: use h-layout-modal-full
- ChatRoom empty state: use h-layout-lyrics-sm (50vh)
- ChatInput attachment: min-w-36 instead of min-w-[150px]
- Update DESIGN_TOKENS.md and add AUDIT_UI_SPOTIFY_DISCORD_20260210.md

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 14:06:30 +01:00
senke
a7209770bf fix(web): detect wrong server (HTML instead of JSON) and reduce console noise
- Detect when API returns HTML (e.g. another app on port 8080): show clear
  toast and reject so callers get an error instead of broken state
- Gate verbose API request/response/slow/error logs on VITE_DEBUG so
  console is quiet by default in dev; set VITE_DEBUG=true for full logs
- Avoid double toast and HTML dump in logs for wrong-server errors
- .env.example: clarify VITE_DEBUG enables API request/response logging

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 13:52:23 +01:00
senke
02edc2584b fix(ui): SearchPageHeader input text-foreground for theme consistency
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 09:55:21 +01:00
senke
0c020a03cd feat(ui): semantic tokens on library, chat, dashboard, search
PlaylistDetailView: hero border, overlay, sort buttons, table header, row hover → border-border, bg-background/50, hover:bg-muted/50
ChatMessage: action buttons hover, own/other bubbles, attachment preview, context menu, modal → muted/border/foreground
ChatRoom: header bar, channel item hover, input pill → bg-card/90 border-border, hover:bg-muted/50, bg-muted/30
TrackList: play icon and title when not current → text-foreground
SearchPageHeader: title, search container, input, clear button → text-foreground, bg-card/80 border-border, hover:bg-muted/50
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 09:53:17 +01:00
senke
335b51521d feat(ui): semantic tokens on track detail and profile pages
Track detail: cover border, overlay, action cards, stats cards, skeleton; tabs list and count badge; back button hover; info metadata row, waveform container, metadata card → border-border, bg-card/80, bg-muted/*
Profile: skeleton card and tabs; tabs list, count badges, card borders; track/playlist/post cards (aspect-video bg, titles, overlay); header card, stats strip, divider → border-border, bg-card/80, text-foreground, muted

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 09:51:02 +01:00
senke
4f387d03ef feat(ui): semantic tokens on Dashboard and Marketplace
Dashboard: stat cards (title hover, value), activity rows, recent tracks skeleton and list (hover, borders, text), quick actions (card bg, icon bg, label hover) → foreground/muted/border
Marketplace: skeleton filter bar and cards, glass filters card, search input, filter/clear buttons, active filter badges and remove buttons, expanded filters section → card/80, border, muted, foreground
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 09:49:07 +01:00
senke
60d451ec52 feat(ui): semantic tokens in RolesPage, SettingsPage, Toast, QueueView
- SecuritySettings: row bg-white/5 → bg-muted/30
- Toast: close button hover:bg-black/10 → hover:bg-muted/50
- QueueView: autoplay toggle thumb bg-white → bg-background
- RolesPage: cards/headers border-white/5, bg-black/40 → border-border, bg-card/80; headings text-white → text-foreground; row hover, inputs, badge → semantic
- SettingsPage: wrapper and tabs border/bg → border-border, bg-card/80, bg-muted/20; section cards; System Config title text-foreground

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 09:45:30 +01:00
senke
51804f89b7 feat(ui): semantic tokens in settings views + XPBar
Gamification:
- XPBar: track bg-kodo-void → bg-muted (gold gradient and pattern kept)

Settings:
- CloudIntegrationView, BackupsView: toggle thumb bg-white → bg-background
- AccessibilitySettingsView: hover:bg-white/5 → hover:bg-muted/50
- AppearanceSettingsView: density option hover + kodo-magenta → primary
- IntegrationsView: icon container bg-white → bg-muted/50
- DeleteAccount*: labels/titles text-white → text-foreground, destructive btn → text-destructive-foreground, disabled → bg-muted
- ChangeEmailModal, DataExportModal: titles, labels, text → text-foreground; DataExport input bg-kodo-void → bg-muted
- SessionManagement, LoginHistory, SecuritySettings: headings text-white → text-foreground, row hover → hover:bg-muted/50
- TwoFactorSetupStep2: QR container bg-white → bg-card
- LoginHistory: table cell text-white → text-foreground

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 09:43:22 +01:00
senke
8f525fc8ca docs(ui): document typography utility classes in DESIGN_TOKENS
- Add table for .text-display, .text-heading-1..4, .text-body-lg, .text-body, .text-caption, .text-label
- Update hierarchy section to reference utility classes instead of raw Tailwind

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 09:38:09 +01:00
senke
928585eacb feat(ui): semantic tokens in admin views (audit logs, users, dashboard)
- AdminAuditLogsView: border/divide/bg white/5 → border-border, bg-muted/*
- AdminSettingsView: toggle indicators bg-white → bg-background
- AdminUsersView: glass cards, table, pagination → border-border, bg-muted/*
- UserTableRow: text-white → text-foreground, hover states → muted/50
- AdminDashboardHeader: text-white, divider, button → foreground/border/muted
- AdminDashboardTabs: tabs list, cards, table → semantic tokens
- AdminDashboardTabs: remove unused React import

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 09:37:16 +01:00
senke
3abac7b6a1 feat(ui): semantic tokens in modal, button, card, alert
- Modal: title text-white → text-foreground
- Button: secondary/ghost/glass use bg-muted/30, border-border
- Card: spotlight bg-black/40 → bg-card/80; surface border-white/* → border-border
- Alert: AlertTitle text-white → text-foreground

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 09:29:48 +01:00
senke
fa8cef26f0 feat(ui): semantic tokens in loading states, header, sidebar, navbar
- LoadingState: bg-kodo-slate → bg-muted for skeleton variant
- PlayerLoading: fullScreen overlay bg-black/50 → bg-background/80 backdrop-blur-sm
- Header: bg-white/5 → bg-muted/30, border-white/* → border-border, focus:ring-ring
- Sidebar: overlay bg-black/60 → bg-background/80, hover:text-white → hover:text-foreground
- Navbar: text-white → text-foreground, ring-white/5 → ring-border

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 09:28:43 +01:00
senke
b5006fe38f fix: resolve TypeScript errors from UI polish subagents
- Remove 12 unused imports (React, Activity, Upload, useRef, isSubmitting)
- Fix framer-motion Variants type with satisfies + as const on ease arrays
- Fix AchievementCard: variant="gaming" → variant="elevated"
- Fix NotificationMenuDropdown: error ?? null for type narrowing

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 00:52:48 +01:00
senke
186301d4ba fix: add override modifier to ErrorBoundary.render()
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 00:49:59 +01:00
senke
b38cc2544d feat(ui): education, gamification, developer, admin views polish
Education:
- CourseCard: lessons count badge, progress bar, backdrop-blur on badges
- EducationView: framer-motion stagger on grid
- Filters: interactive color-coded pills (Beginner/Intermediate/Advanced)
- MyCoursesView: stagger animation, semantic token migration

Gamification:
- LeaderboardView: gold/silver/bronze podium styling with glow + accents
- AchievementCard: shine sweep animation on hover, lift effect
- AchievementsView: stagger animation with filter re-animation
- XPBar: semantic token fix

Developer dashboard:
- API key copy-to-clipboard with icon toggle
- Status indicator badges with animated pulse dot

Commerce/Admin:
- WishlistView: stagger animation, hover lift
- PurchasesView: stagger on list items
- Admin views: consistent headers, semantic tokens (text-white → text-foreground)

18 files modified, all text-white → text-foreground migrations

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 00:48:45 +01:00
senke
3c361389b6 feat(ui): marketplace premium polish
ProductCard (both versions):
- "NEW" badge for recent products, "Hot" with Zap icon
- Prominent price (text-lg), star rating with fill-warning
- Hover-reveal "Add to Cart" button with slide animation
- Cover image hover zoom

Categories: pill shape, smooth scroll, active shadow
Grid: responsive 2/3/4 columns, stagger pop-in animation
Cart: slide-out AnimatePresence on remove, icon quantity controls
MarketplaceHome: active filter badges, search focus glow, stagger grid
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 00:39:26 +01:00
senke
4fffdad11a feat(ui): social feed premium polish
PostCard:
- Hover lift + shadow + border glow
- Avatar with online status, clickable author name
- Relative timestamps (2h ago, 1d ago)
- Media: rounded corners + hover zoom
- Like bounce animation, share "Shared!" confirmation

Feed:
- "New posts available" banner with AnimatePresence
- Load More button with icon + spinner
- Per-post stagger animation on feed load

CreatePost:
- Avatar with status, character counter (red at 90%)
- Post button loading state, colored action buttons

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 00:39:11 +01:00
senke
9f108e2430 feat(ui): premium auth pages polish
AuthLayout:
- Full-screen gradient background with animated pulse blobs
- Glass-morphism card (bg-card/80, backdrop-blur-md, shadow-2xl)
- New animate-auth-enter animation (fade + scale + translateY)

OAuth buttons: real provider icons (Google SVG, GitHub, Discord)
Password strength: 4-segment bar, color-coded labels, checklist icons
Login: Checkbox component for Remember Me, animated error alerts
Register: migrated to AuthInput, username check with spinner/icons
Verification notice: Mail icon, success-tinted circle, AuthButton

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 00:33:35 +01:00
senke
cfe1fce255 feat(ui): error boundary with premium fallback + scroll-to-top button
ErrorBoundary:
- Class-based React error boundary with animated destructive icon
- Collapsible technical details, Try again + Go home actions
- Supports custom fallback and onReset callback
- Replaces old ErrorBoundary with premium version

ScrollToTop:
- Floating button appears after 400px scroll
- framer-motion entry/exit animation
- Responsive positioning (above mobile nav on small screens)

Layout:
- Auto scroll-to-top on route change
- ScrollToTop button integrated

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 00:33:21 +01:00
senke
f8db7c4c0f feat(ui): track detail page Spotify-grade polish + dashboard welcome
Track detail page:
- Hero: dual-layer ambient blur with cinematic gradient
- Cover: floating play overlay on hover with glow
- Actions: integrated LikeButton with bounce, rounded-full action bar
- Info: waveform visualization (80 sine-wave bars), genre pill badge,
  responsive metadata grid (duration, format, bitrate, sample rate)
- Tabs: icons alongside labels, icon badges on section headers
- Layout: stagger entrance animation on columns
- Skeleton: updated to match all new sections

Dashboard:
- WelcomeBanner: time-of-day greeting with user name + gradient bg
- QuickActions: 4 cards (Upload, Create Playlist, Discover, Chat)
  with stagger animation and route links
- SectionHeader: reusable with "View all →" links

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 00:26:10 +01:00
senke
8f26a2b3e9 feat(ui): animated number counters + navigation progress bar
Animated numbers:
- New useAnimatedCounter hook (requestAnimationFrame, ease-out cubic)
- New AnimatedNumber component with tabular-nums
- Applied to: DashboardPage (4 stats), UserProfilePageHeader (3 stats),
  StatCard, AdminDashboardStatCard (numeric values auto-animate)

Navigation progress bar:
- YouTube/GitHub-style thin bar at top of page
- Simulated progress on route changes (framer-motion)
- Primary color with glow shadow
- Integrated into Layout as first child

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 00:19:18 +01:00
senke
6ef9089905 feat(ui): profile page premium polish + keyboard shortcuts panel
Profile page:
- Hero: gradient upgrade, animated shimmer sweep, pulsing glow orb, bottom fade
- Header card: avatar ring glow, stats with icons (data-driven), tabular-nums
- Tabs: stagger animation on grid items, tab trigger transitions
- Skeleton: consistent with loaded state styling
- Page entry animation (fade-in)

Keyboard shortcuts panel (Discord-style):
- New KeyboardShortcutsPanel component with framer-motion animations
- Groups: General, Playback, Navigation
- Styled kbd badges with semantic tokens
- ARIA: role=dialog, aria-modal, aria-label
- Replaces old KeyboardShortcutsHelp component
- Fix: ? key handler no longer blocked by !e.shiftKey guard

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 00:15:50 +01:00
senke
c2c5b91a46 feat(ui): sidebar premium polish + player bar enhancements
Sidebar:
- Discord-style active indicator pill (left edge, primary color)
- Hover micro-animations: icon scale-110, bg transition
- Section dividers between nav groups
- Notification badge pill (primary/15 bg, font-semibold)
- Footer items (Settings, Sign Out) consistent with main nav

Player bar:
- Progress bar: time preview tooltip on hover, scale-y on drag
- Volume: Spotify-style hover-reveal slider, 3-level icon states
- Now playing: ambient glow behind album art on hover
- Track info: clickable artist name with hover underline
- Keyboard shortcuts: N/P (next/prev), Arrow Up/Down (volume), M (mute)
- Shortcut hints in control tooltips (<kbd> badges)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 00:11:11 +01:00
senke
b70cfed10d feat(ui): unsaved changes warning + chat date separators
Unsaved changes:
- New useUnsavedChanges hook: browser beforeunload warning
- New useFormDirtyState hook: isDirty/markDirty/markClean tracking
- SettingsPage: wired up dirty tracking with markClean on save

Chat date separators:
- DateSeparator component with centered date label and hr lines
- Inserted between messages from different days
- Formats: Today, Yesterday, or full date (e.g. "Monday, February 10")

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 00:07:19 +01:00
senke
45e350a292 feat(ui): chat status indicators, notification grouping, feature discovery
Chat status indicators:
- ChatMessage: Avatar with online status on incoming messages
- VirtualizedChatMessageItem: proper Avatar component with status
- ChatInterfaceMessages: added status="online" to existing avatars
- ConversationItem: Avatar with status for DM conversations

Notification polish:
- AnimatePresence + motion.div on dropdown (scale+fade, 150ms)
- Date grouping: Today, Yesterday, This Week, Earlier
- Sticky section headers with backdrop-blur

Feature discovery (new FeatureHighlight component):
- One-time spotlight tooltip with localStorage persistence
- Applied to: search bar (Ctrl+K), keyboard shortcuts (?), track context menu
- framer-motion animation with 0.5s delay

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-10 00:04:23 +01:00
senke
c3cd478508 feat(ui): contextual skeleton loading + list stagger animations
Skeleton loading (5 pages migrated from spinner):
- SettingsPage: tabs + profile + settings cards skeleton
- RolesPage: table header + 6 data rows + assign role skeleton
- MarketplaceHome: filter bar + category pills + 8 product cards
- TrackSearchResults: results count + 8 track card grid
- PlaybackSummary: 3-column stats skeleton

List stagger animations (5 lists):
- New stagger-fade-in CSS keyframe (translateY 8px, 250ms, ease-out)
- 50ms per item delay, capped at 500ms (10+ items render together)
- Applied to: NotificationsPage, PlaylistList, PlaylistTrackList (static),
  dashboard TrackList, NotificationMenuList
- Respects prefers-reduced-motion

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:59:54 +01:00
senke
2fd7935957 feat(ui): remaining polish — DnD feedback, typography headings, lightbox, share dialog
Includes changes from previous session that weren't fully staged:
- PlaylistDetailView + QueueView: drag-over visual feedback
- PlaylistTrackListSortableItem: DnD opacity + shadow + insertion line
- ImageViewerModal: zoom toggle, keyboard nav, image counter, loading skeleton
- Badge: dismissible, pulse, dot-only enhancements
- ShareDialog: useCopyToClipboard integration
- SessionsPage, NotificationsPage, SettingsPage, DashboardPage: typography utility classes
- index.css: like-bounce, shake, empty-state-in, marquee, typography utilities

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:54:39 +01:00
senke
8f69e0ab0a feat(ui): badge polish, DnD feedback, typography system, image lightbox
Badge component:
- Dismissible variant with X button (onDismiss prop)
- Pulse animation variant (pulse prop)
- Enhanced dot-only mode for standalone colored circles

Drag-and-drop visual feedback:
- PlaylistTrackListSortableItem: opacity + shadow + ring on drag, border insertion line
- QueueView: dragOverIndex tracking, bg-primary/5 drop zone highlight
- PlaylistDetailView: same DnD feedback pattern

Typography standardization:
- 9 utility classes: text-display, text-heading-1..4, text-body-lg, text-body, text-caption, text-label
- Applied to 8 page headings (Dashboard, Settings, Library, Search, etc.)
- DESIGN_TOKENS.md updated with typography reference

Image lightbox:
- Keyboard navigation: ArrowLeft/Right for gallery, Escape to close
- Image counter pill: "2 / 5" with backdrop-blur
- Zoom toggle: click to zoom in/out with scale transition
- Loading skeleton: pulse placeholder while image loads

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:52:33 +01:00
senke
a08a0081f8 feat(ui): avatar polish, smooth accordion, modal animation consistency
Avatar improvements:
- Image loading skeleton with animate-pulse overlay
- Fade-in transition on image load (opacity 0→1, 200ms)
- Error fallback shows initials when image fails
- Click animation: active:scale-95
- Badge overlay prop: count/dot/color at top-right corner

Accordion/Collapsible smooth animation:
- Replaced max-h-[5000px] hack with CSS grid-template-rows trick
- grid-rows-[0fr] → grid-rows-[1fr] for content-aware smooth collapse
- 200ms ease-out transition on both Collapsible and AccordionContent

Modal animation consistency (5 modals migrated):
- CreatePlaylistModal → base Modal (focus trap, AnimatePresence, portal)
- AutoMetadataDetectionModal → base Modal
- ReviewProductModal → base Modal
- ChangeUsernameModal → base Modal
- TagSuggestionsModal → base Modal
- Skipped: SharePostModal (multi-view pattern, would lose layout flexibility)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:46:46 +01:00
senke
18e94ce6f0 feat(ui): table polish + mobile bottom navigation
Table improvements (8 files):
- Sticky headers: bg-background/95 backdrop-blur-sm on all thead elements
- Sort indicators: SortableTableHead with ChevronsUpDown/ChevronUp/ChevronDown
- Row hover: hover:bg-muted/50 duration-150 with active state
- Borders softened: border-border/50, last row no border
- Header typography: text-xs font-medium uppercase tracking-wider
- Consistent cell padding: px-4 py-3 for body, px-4 py-2.5 for headers
- Applied to: ui/table, data/table, TrackList, TrackListRow, FileManager, studio files

Mobile bottom navigation:
- New MobileBottomNav component (5 items: Home, Search, Library, Chat, Profile)
- Only visible on mobile (lg:hidden), z-40 below player
- 48px touch targets, safe-area-inset-bottom for iPhone
- Active state with primary color + top indicator bar
- Integrated into Layout with pb-20 lg:pb-0 main padding
- Header touch target fix: theme toggle min-h-10 min-w-10

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:37:25 +01:00
senke
cb9a8a85f7 feat(ui): form polish + micro-interactions for premium feel
Forms quality:
- Password visibility toggle (Eye/EyeOff) on FloatingInput, AuthInput
- Applied to LoginForm and RegisterForm password fields
- Focus glow effect on all inputs (primary color shadow ring)
- Error shake animation (0.4s spring shake on validation errors)

Micro-interactions:
- Like button bounce animation (scale 1→1.3→0.9→1.1→1)
- useCopyToClipboard hook — reusable copy with visual feedback
- Applied to CreateAPIKeyModal, ShareDialog, SharePostModal (Check icon swap)
- Universal button press effect: active:scale-[0.98] on all variants

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:31:52 +01:00
senke
2131da1a9a feat(ui): header glassmorphism, card hover effects, content transitions, badge animations
Header polish:
- Glassmorphism: bg-background/80 backdrop-blur-lg + subtle border
- Search bar focus-within ring on container
- Avatar hover: ring-primary/50 + scale-105
- Notification badge animate-pulse

Card hover effects:
- Interactive Card variant: hover border-primary/20 tint
- ProductCard: lift (-translate-y-1) + shadow-lg + cover scale-105
- PlaylistCard: lift + shadow-lg + cover scale-105
- CourseCard: lift + shadow-xl + cover scale-105

ContentTransition component (new):
- Reusable skeleton-to-content crossfade with AnimatePresence
- Applied to DashboardPage as proof-of-concept

Notification badge pulse:
- Sidebar collapsed badges: radar-ping effect (animate-ping behind solid dot)
- Header notification bell: matching ping animation on unread count

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:25:52 +01:00
senke
cd764d32cb feat(ui): premium empty states + focus ring consistency
Empty states enhanced:
- EmptyState component gains variant prop (default/centered/card)
- Soft entry animation (fade + scale) via new CSS keyframe
- Icon wrapped in muted background circle
- Library: "Your library is empty" + "Upload Track" action
- Search: "No results found" + improved description
- Wishlist: "Explore the marketplace" + Browse button
- Queue: "Nothing in your queue" with autoplay context
- Chat: improved no-conversation and no-messages states

Focus ring consistency (6 files fixed):
- input.tsx: ring-primary/30 → ring-ring + ring-offset
- checkbox.tsx: peer-focus → peer-focus-visible + ring-ring
- textarea.tsx: focus:ring-1 → focus-visible:ring-2 + ring-ring
- List.tsx: added ring-offset-background
- TrackListRow.tsx: full focus-visible on rows + action buttons
- PlaylistCard.tsx: focus-visible on checkbox button

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:23:09 +01:00
senke
b1f5fbf0bf feat(ui): hover cards, Spotify player layout, scrollbar tokens, context menu integration
HoverCard component (new):
- Rich preview cards on hover with framer-motion animation
- Viewport-aware positioning, portal rendering, open/close delays
- UserHoverContent: Discord-style user preview (avatar, bio, stats, follow)
- TrackHoverContent: Spotify-style track preview (cover, stats, play)

Audio player — Spotify-like 3-column layout:
- grid-cols-3 layout: track info | controls | volume+queue
- Progress bar moved to top edge (minimal variant)
- Glassmorphism (bg-background/95 backdrop-blur-md)
- Prominent centered play button (h-10 w-10 rounded-full, active:scale-95)
- Title marquee animation for long track names
- Reduced padding for tighter premium feel

Scrollbar styling:
- Migrated hardcoded rgba() to semantic tokens via color-mix(in oklch)
- Added transition on thumb hover for smooth visual feedback

ContextMenu integration:
- TrackListRow wrapped with ContextMenu (play, like, more actions)
- Dynamic items based on available callbacks

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:18:46 +01:00
senke
aeade50247 feat(ui): tooltip adoption + search highlighting & skeleton loading
Tooltip adoption (18 conversions across 11 files):
- Player controls: shuffle, repeat, mute, expand, close, lyrics, auto-scroll
- Navbar: theme toggle
- File browser: download, add tag, AI auto-tag, watermark, process with AI
- Notifications: mark as read
- Share links: open link, revoke link
- Chat: scroll to bottom

Search polish:
- New highlightMatch utility — wraps matching text in <mark> with primary color
- Applied to track titles, artist names, playlist names in SearchPageResults
- Applied to suggestion dropdown titles and subtitles
- Replaced spinner loading state with content-aware SearchPageSkeleton
- Skeleton matches actual results layout (tab bar, track cards, artist circles)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:14:00 +01:00
senke
c8d88e7f44 feat(ui): premium polish — route transitions, context menu, slider, sidebar tooltips
Route transitions:
- New PageTransition component with framer-motion fade+slide (0.2s)
- Layout wraps children in AnimatePresence mode="wait" for smooth page changes

Context menu (new component):
- Right-click menu with portal rendering and viewport clamping
- Keyboard navigation (arrows, Home/End, Enter/Space, Escape)
- framer-motion scale+fade animation matching dropdown aesthetic
- ARIA compliant (role=menu/menuitem), destructive/disabled item support

Sidebar polish:
- Replaced browser-native title tooltips with custom Tooltip component
- position="right" tooltips on collapsed nav items, Settings, Sign Out
- Tooltips auto-disabled when sidebar is expanded

Slider — Spotify-style hover:
- Track thins to h-1 by default, expands to h-1.5 on hover
- Thumb hidden by default, scales in on hover (group-hover)
- Filled portion gains subtle primary glow on hover

Toast enhancements:
- New ToastAction interface with label + onClick
- Action button renders below message, auto-dismisses on click
- Enables "Undo" / "View" patterns

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:10:10 +01:00
senke
592cc94b63 feat(ui): polish, animations & performance optimizations
Sprint 4.1 — Exit animations with framer-motion AnimatePresence:
- modal.tsx: overlay fade + panel scale/fade entry/exit
- dropdown.tsx: slide/fade entry/exit

Sprint 4.2 — Missing hover transitions on PostCard:
- Added transition-colors to author name + tags hover states

Sprint 4.3 — Button loading prop:
- Added loading?: boolean with Loader2 spinner + auto-disable

Sprint 4.4 — OptimizedImage replacement:
- PostCard, ProductCard, CourseCard, PlaylistDetailView content images

Sprint 4.5 — React.memo on list components:
- ProductCard, PlaylistCard, TrackCard, CourseCard, PostCard

Sprint 4.6 — Consolidate duplicates:
- Deleted KodoEmptyState (redundant with EmptyState)
- Documented Spinner vs LoadingSpinner distinction (complementary)
- Confirmed Dialog delegates to Modal (correct architecture)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:05:26 +01:00
senke
bfdc785ccc refactor(tokens): complete design token migration to semantic system
Sprint 3.1 — Default colors → semantic (~15 files, ~99 replacements):
- lime-500 → success, red-500 → destructive, cyan-500 → primary

Sprint 3.2 — Hardcoded colors → semantic (~13 files, ~99 replacements):
- text-white → text-foreground, bg-black → bg-background, bg-white → bg-card

Sprint 3.3 — Legacy kodo-* → semantic (~27 files, ~122 replacements):
- bg-kodo-ink → bg-card, bg-kodo-void → bg-background, text-kodo-steel → text-muted-foreground
- Preserved kodo-cyan/magenta/lime/gold palette accents and gradients

Sprint 3.4 — Arbitrary values → Tailwind scale (5 replacements):
- min-h-[600px] → min-h-layout-page, min-h-[400px] → min-h-layout-page-sm
- left-[50%] → left-1/2, min-h-[80px] → min-h-20, min-h-[40px] → min-h-10

Sprint 3.5 — Border-radius standardization (4 replacements):
- Modal/dialog skeletons: rounded-lg → rounded-xl (convention)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:05:09 +01:00
senke
503e6f00b6 feat(a11y): comprehensive accessibility & view states improvements
Sprint 1 — Quick A11y wins:
- progress.tsx: role=progressbar + aria-value* + aria-label
- switch.tsx: role=switch + aria-checked
- skeleton.tsx: aria-hidden=true
- alert.tsx, Toast.tsx, SelectTrigger.tsx: aria-labels on close buttons
- PostCard.tsx: alt on images + aria-labels on icon buttons
- ProductCard.tsx: aria-labels on play/view buttons
- modal.tsx: role=dialog + aria-modal + aria-labelledby
- input.tsx: error state + aria-invalid + aria-describedby
- FAB.tsx: forward aria-label from label prop

Sprint 2 — Structural A11y + View States:
- tabs/: full ARIA tablist/tab/tabpanel + arrow key navigation
- radio-group.tsx: role=radio + arrow key navigation
- select/: aria-activedescendant + full keyboard navigation
- List.tsx + card.tsx: focus-visible states on interactive elements
- DashboardPage, LibraryPage, LiveView, QueueView: error states
- WishlistView, AdminDashboard, AnalyticsView, SellerDashboard: loading/empty states

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:04:35 +01:00
senke
f81756455c ui(tokens): migrate text-white to text-foreground in settings and content headings (10 files)
Replace hardcoded text-white with theme-aware text-foreground on page
titles, section headings, and primary content text in settings views,
playlist views, and social components.

These elements use card/transparent backgrounds where text-foreground
adapts correctly to both light and dark themes.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:23:00 +01:00
senke
55c88cd8b4 docs: update UI_QUALITY_LOG with levers 26-28 and session 2 assessment
Document kodo-cyan→primary, kodo-red/lime bg/border variants, and
kodo-gold→warning migrations. Add end-of-session quality assessment
(~80-82% premium) with remaining lever inventory.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:21:44 +01:00
senke
50f41beec5 ui(tokens): migrate kodo-gold to warning (43 files, 84 instances)
Replace legacy text-kodo-gold/border-kodo-gold/bg-kodo-gold with semantic
text-warning/border-warning/bg-warning across 43 components.

Warning states now use the design system token for theme adaptability.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:20:32 +01:00
senke
dd6333d540 ui(tokens): migrate kodo-cyan to primary (51 files, 88 instances)
Replace legacy text-kodo-cyan/border-kodo-cyan/bg-kodo-cyan with semantic
text-primary/border-primary/bg-primary across 51 components.

The brand primary color now uses the design system token, enabling proper
theme adaptation. Covers UI primitives, search, dashboard, chat, playlists,
settings, social, marketplace, and auth components.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:19:12 +01:00
senke
fc4259a827 ui(tokens): migrate bg/border-kodo-red → destructive, bg/border-kodo-lime → success (25 files)
Complete semantic color token migration for background and border variants:
- bg-kodo-red → bg-destructive
- border-kodo-red → border-destructive
- bg-kodo-lime → bg-success
- border-kodo-lime → border-success

Covers UI primitives (badge, alert), forms, settings, social, playlists,
admin, education, and marketplace components.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:17:14 +01:00
senke
c444a6203c docs: update UI_QUALITY_LOG with levers 17-25
Document: empty state batch 2-3, hover transitions, dropdown animation,
and massive token elimination campaign (text-kodo-content-dim,
border-kodo-steel, bg-kodo-steel, text-kodo-secondary, text-kodo-red,
text-kodo-lime, Toast tokens).

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:15:56 +01:00
senke
7e4bcbdb65 ui(tokens): migrate text-kodo-red → text-destructive, text-kodo-lime → text-success (56 files)
Replace remaining legacy semantic color tokens:
- text-kodo-red → text-destructive (36 files, 50 instances): errors,
  deletions, validation, destructive actions
- text-kodo-lime → text-success (36 files, 48 instances): success states,
  confirmations, positive indicators

These tokens now adapt to theme changes instead of being hardcoded.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:14:40 +01:00
senke
ceb7eec364 ui(tokens): migrate text-kodo-secondary to text-muted-foreground (11 files)
Replace legacy text-kodo-secondary with semantic text-muted-foreground
across chat, notifications, developer tools, and PWA components.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:13:27 +01:00
senke
db4883e0a7 ui(tokens): migrate Toast component to semantic design system tokens
Replace legacy color tokens in Toast component:
- border-kodo-lime → border-success
- border-kodo-red → border-destructive
- text-kodo-lime → text-success
- text-kodo-red → text-destructive
- text-kodo-steel → text-muted-foreground
- text-white → text-foreground
- bg-kodo-ink/90 → bg-card/90
- hover:text-white → hover:text-foreground

Toast now adapts correctly to light/dark theme.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:12:29 +01:00
senke
06313c5d72 ui(motion): add scaleIn animation to Dropdown menu, fix Collapsible tokens
Dropdown: add animate-scaleIn entrance animation with origin based on
alignment (top-left, top-right, or top-center). Menu now fades+scales
instead of popping instantly.

Collapsible: migrate focus ring from kodo-cyan/kodo-void to ring/background
tokens. Migrate chevron text from kodo-secondary to muted-foreground.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:11:25 +01:00
senke
e1d901e087 ui(components): migrate 4 inline empty states to EmptyState in profile and marketplace
UserProfilePageTabs: replace 3 inline empty divs (tracks, playlists, posts)
with EmptyState component using Music, Library, MessageSquare icons.

ProductDetailViewReviews: replace inline "No reviews yet" text with
EmptyState using Star icon and call-to-action description.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:10:09 +01:00
senke
6d9a4b0a5a ui(tokens): migrate bg-kodo-steel to bg-muted (46 files, 76 instances)
Replace legacy hardcoded bg-kodo-steel (RGB 59,69,84, theme-unaware)
with semantic bg-muted token across 46 user-facing components.

This completes the kodo-steel elimination from source files: text, border,
and background variants are now all on semantic design system tokens.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:08:42 +01:00
senke
68417c667c ui(tokens): migrate border-kodo-steel to border-border (86 files, 269 instances)
Replace legacy hardcoded border-kodo-steel (RGB 59,69,84, theme-unaware)
with semantic border-border token across 86 user-facing components.

Covers UI primitives (checkbox, badge, modal, table, textarea, alert,
radio-group, avatar), all modals, settings views, social features,
playlist views, inventory, chat, commerce, and cloud file browser.

Only story/test files retain the legacy token.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:07:00 +01:00
senke
7113d35a4a ui(tokens): complete text-kodo-content-dim → text-muted-foreground migration (52 files)
Eliminate all remaining text-kodo-content-dim from user-facing source files.
This legacy token (hardcoded Gray-400) is now fully replaced by the
theme-aware text-muted-foreground token across UI primitives, settings,
social features, playlists, modals, inventory, and admin views.

Only story files (.stories.tsx) retain the old token for reference.
Total migration: ~345 instances across 87 files (this + previous commit).

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:04:51 +01:00
senke
a508dde511 ui(tokens): migrate text-kodo-content-dim to text-muted-foreground (35 files, 160 instances)
Replace legacy hardcoded `text-kodo-content-dim` (Gray-400, theme-unaware)
with semantic `text-muted-foreground` across 35 user-facing components.

This ensures all secondary/muted text adapts correctly to light/dark theme
changes instead of staying fixed at a single gray value.

Covers: SearchBar, PlaylistsView, NotificationBell, TrackAnalyticsView,
LiveStreamDetailView, LicenceCard, FilePreviewCard, PasswordStrengthIndicator,
NotificationItem, TrackList, CourseCard, GroupCard, AchievementCard, XPBar,
EquipmentCard, SellerDashboardView, APIPlaygroundView, DeveloperDashboardView,
CreatorModal, AddToPlaylistModal, LicenceDetailsModal, QuizModal,
CertificateModal, FlashSaleModal, CreateAPIKeyModal, LyricsEditorModal,
WatermarkSettingsModal, ProfileXPView, LeaderboardView, PostCard,
ExploreView, FeedView, MessageSearch, TypingIndicator, PlaylistTrackItem.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:03:33 +01:00
senke
2a0d9aa1f3 ui(motion): add transition-colors to QueuePanel items and Header mobile toggle
Ensure smooth hover background transitions on interactive elements that
were snapping instead of transitioning:

- QueuePanel: queue list items now smooth-transition on hover
- Header: mobile sidebar toggle button smooth-transitions on hover

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:01:36 +01:00
senke
e82c89fdd0 ui(components): migrate 5 more inline empty states to EmptyState component
Replace inline "no items" fallbacks with the shared EmptyState component
in high-visibility views:

- PlayerQueue: ListMusic icon + "Your queue is empty"
- WishlistView: Heart icon + "Your wishlist is empty"
- WebhooksView: Activity icon + "No endpoints registered"
- AdminModerationView: ShieldAlert icon + "All caught up!"
- RolesPage: improved empty message text

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:00:21 +01:00
senke
633fe7c582 docs: update UI_QUALITY_LOG with session 2 levers 13-16
Document: skeleton shimmer migration (43 files), EmptyState migration,
text-destructive token migration, SearchPageResults/UserCard a11y.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 23:58:01 +01:00
senke
2619aafe5a ui(a11y): add focus-visible and keyboard support to SearchPageResults and UserCard
SearchPageResults: add tabIndex, role="button", focus-visible ring, and
onKeyDown (Enter/Space) to all interactive Card elements across all tabs.

UserCard: convert clickable div/h3 to semantic <button> elements with
focus-visible ring. Migrate hardcoded text-white/text-kodo-content-dim
to design system tokens (text-foreground/text-muted-foreground).

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 23:57:26 +01:00
senke
c5b14dc09b ui(tokens): migrate text-red-500 to text-destructive across 11 components
Replace hardcoded red-500/red-400 color references with the semantic
`destructive` design token. This ensures error and danger states adapt
correctly to theme changes and maintain consistency across the UI.

Files: PlayerExpanded, PlayerQueue, WebhooksView, RolesPage, ChatPage,
AdminDashboardStatCard, NotificationsViewItem/Header, AnalyticsViewTopTracks,
AdminDashboardTabs, AdminDashboardHeader.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 23:26:34 +01:00
senke
47164e5f3c ui(components): migrate remaining 27 skeleton files to Skeleton shimmer
Complete the migration of all inline `animate-pulse bg-muted` patterns
to the shared `<Skeleton>` component with premium shimmer animation.

Covers: UserProfilePage, SearchPage, CourseDetailView, ProductDetailView,
NotificationsPage, ChatMessages, SessionsPage, RegisterPage, AudioPlayer,
DataList, AccountSettings, Dialog, CourseLearningView, TwoFactorSetup,
ProjectsManager, GoLiveView, ConnectivityView, AIToolsView,
CloudSettingsView, EquipmentDetailView, NotificationMenu, PlaybackHeatmap,
ProjectDetailView, AvatarUpload, ShareLinkManager, OptimizedImage, BlurPlaceholder.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 23:21:33 +01:00
senke
bdf7466082 ui(components): migrate inline empty states to EmptyState component
Replace bare text "No X found" messages with the shared EmptyState
component (icon + title + description + optional action). This gives
empty moments a designed, intentional feel instead of a raw fallback.

- EmptyState: use design system tokens (text-foreground, text-muted-foreground)
- MarketplaceHome: EmptyState with ShoppingBag icon
- MarketplaceViewGrid: EmptyState with clear filters action
- ProfileViewTracksTab: EmptyState with Music icon
- ProfileViewPlaylistsTab: EmptyState with ListMusic icon
- PurchasesViewList: EmptyState with ShoppingCart icon
- SessionManagement: centered empty text with padding

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 23:15:53 +01:00
senke
0d0046f48c ui(components): migrate 16 skeleton files from animate-pulse to Skeleton shimmer
Replace raw `animate-pulse bg-muted` divs with the `<Skeleton>` component
across all major page and section skeletons. Every loading state now uses
the premium sweeping shimmer animation instead of the basic pulse.

Files: TrackDetailPageSkeleton, LibraryPageSkeleton, PlaylistDetailPageSkeleton,
DiscoverViewSkeleton, PlaybackDashboardSkeleton, StudioViewSkeleton,
MonitoringDashboardSkeleton, LibraryManagerSkeleton, UploadViewSkeleton,
FileManagerViewSkeleton, TrackSearchFiltersSkeleton, TrackListPaginationSkeleton,
TrackFiltersSkeleton, TrackHistorySkeleton, PlaylistActionsSkeleton, TrackGrid.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 23:12:58 +01:00
senke
9a0c7643fb docs: update UI_QUALITY_LOG with levers 10-12
Document: PlaylistCard hover fix, Switch/Toast/Spinner design system
migration, and Skeleton shimmer animation.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 23:02:05 +01:00
senke
b80b06f073 ui(components): add shimmer animation to Skeleton component
Replace static animate-pulse with a sweeping gradient shimmer overlay
for a premium loading experience (Spotify/Discord-like).

Skeleton: bg-kodo-steel/50 → bg-muted/50 (design system token), adds
a child div with .skeleton-shimmer class for the gradient sweep.

index.css: add .skeleton-shimmer utility class with linear-gradient
animation (1.8s ease-in-out infinite). Respects prefers-reduced-motion
by disabling animation.

Existing inline skeletons using animate-pulse are unaffected.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 23:01:31 +01:00
senke
27107245a6 ui(components): migrate Switch, Toast, LoadingSpinner to design system
Switch:
- w-[44px] h-[24px] → w-11 h-6 (exact Tailwind equivalents)
- bg-kodo-cyan/kodo-steel → bg-primary/bg-muted (design system tokens)
- ring-kodo-cyan/kodo-void → ring-ring/ring-offset-background

Toast:
- min-w-[300px] → min-w-72 (288px, closest Tailwind value)

LoadingSpinner:
- min-h-[200px] → min-h-48 (192px)
- border-t-blue-600 → border-t-primary (design system token)
- border-kodo-steel → border-muted

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:56:36 +01:00
senke
fec4d3dd12 ui(components): fix PlaylistCard hover transition and add focus-visible
- Remove transition-opacity that was overriding Card's shadow/color
  transitions (hover:shadow-xl was not animating)
- Add focus-visible ring to selectable wrapper and Link wrapper
- Replace ring-blue-500 (arbitrary color) with ring-primary (design system)
  for selected state

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:55:23 +01:00
senke
f0d8d5a1e5 docs: add UI_QUALITY_LOG.md tracking premium quality progress
Documents 9 completed levers: contrast improvement, text-[10px] migration,
modal height tokens, shell refinements, player sidebar-awareness,
focus-visible rings, arbitrary value cleanup, scrollbar unification,
and fixDisplayIssues cleanup.

Each entry lists: affected files, visual impact, and risks avoided.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:53:34 +01:00
senke
edb73769a6 ui(shell): strip destructive CSS injection from fixDisplayIssues
Rewrite fixDisplayIssues.ts from 719 → 70 lines. Removed:
- Nuclear CSS injection (background-image: none !important on *,
  border removal on all non-input elements, display: none on narrow
  elements)
- MutationObserver watching all DOM mutations
- setInterval(1000ms) scanning every element in the document
- 50+ debug log statements

Kept: grid overlay removal (harmless), 3 opt-in diagnostic console
commands (__enableCleanMode, __disableCleanMode, __findVerticalLines).

Also reduce aggressiveVisualFix.ts to a documented no-op (was already
disabled but still contained ~190 lines of dead code).

The original vertical line issue was fixed at the CSS source
(global-effects.css gradient removal + input focus styles).

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:51:11 +01:00
senke
e82560c547 docs: add UI/UX audit reports and design system documentation
- AUDIT_UI_UX_VISUEL_COMPLET.md: comprehensive visual audit with
  structured analysis (shell, rhythm, typography, colors, components,
  motion) and Top 10 improvement roadmap
- UI_UX_AUDIT_DISCORD_SPOTIFY_QUALITY.md: detailed gap analysis vs
  Discord/Spotify with phased action plan
- A11Y_AUDIT.md: accessibility audit baseline
- EMPTY_ERROR_PATTERNS.md: unified empty/error state pattern guide
- codemod-typography-arbitrary.mjs: migration script for text-[10px]

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:49:40 +01:00
senke
4305d66aa2 ui(storybook): add allowedHosts config and update DESIGN_TOKENS docs
- .storybook/main.ts: add viteFinal with allowedHosts for veza.fr/com
  domains
- DESIGN_TOKENS.md: document modal max-height tokens and typography
  exceptions (avatar xs text-[10px])
- capture-visual-baseline.mjs: fix locator selectors for sidebar and
  player captures

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:49:24 +01:00
senke
3a893103f3 ui(tokens): unify scrollbar to single source in index.css
Remove duplicate scrollbar definitions from:
- global-effects.css: replaced cyan scrollbar block with comment pointing
  to index.css as the single source
- fixDisplayIssues.ts: removed JS-injected scrollbar override that
  conflicted with the CSS source of truth

The canonical scrollbar definition (6px, white/12 thumb, transparent
track) now lives exclusively in index.css @layer base.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:49:13 +01:00
senke
a0bf68535f ui(tokens): migrate remaining arbitrary min-w values to Tailwind scale
- min-w-[140px] → min-w-36 (AdminModerationView)
- min-w-[100px] → min-w-24 (PlaylistFollowButton, FollowButton)
- min-w-[80px] → min-w-20 (PasswordStrengthIndicator)
- collapsible.tsx: eslint-disable comment for max-h-[5000px] animation
  technique (documented exception)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:48:37 +01:00
senke
034a2769c5 ui(a11y): add focus-visible ring to 16 interactive components
Add consistent focus-visible:ring-2 focus-visible:ring-ring pattern to
elements using role="button" / tabIndex={0} that lacked visible focus
indicators.

Affected: TrackCard, 2FA setup steps, ProjectsManager cards,
NotificationMenuItem, SelectOptionItem, DropdownMenuItem,
ConversationItem, VirtualizedChatMessageItem, GearInventoryGrid,
UploadModal, SearchPageResults, SocialViewFeedItem, SocialViewSidebar,
FileManagerViewTable.

Improves keyboard navigation across the application.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:48:24 +01:00
senke
64916e43f2 ui(components): sidebar-aware player bar, synced lyrics, queue positioning
GlobalPlayer: sidebar-aware floating bar (lg:left-main-expanded/collapsed),
centered controls in flex flow, always-visible progress track, entrance
animation (slide-in-from-bottom-4 + fade-in), compact responsive layout.

PlayerExpanded: new synced lyrics panel with toggle, auto-scroll,
click-to-seek. Album art shrinks when lyrics are displayed.

PlayerQueue: sidebar-aware positioning matching GlobalPlayer pattern.

types.ts: add lyrics field (time/text pairs) to Track interface.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:48:08 +01:00
senke
bf4112c76f ui(shell): refine DashboardLayout scroll architecture and Header transparency
DashboardLayout: add min-w-0 to flex child (prevents overflow), use
max-lg:ml-0 for responsive specificity, absolute-positioned player at
bottom of content area.

Header: bg-background/80 → bg-transparent with backdrop-blur-md for a
seamless Spotify-like header that blends with the page content below.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:47:53 +01:00
senke
1f4b731e38 ui(tokens): replace arbitrary max-h/h viewport values with layout tokens
Migrate all max-h-[XXvh] and h-[XXvh] to design system tokens:
- max-h-[85vh] → max-h-layout-modal (9 modals)
- max-h-[80vh] → max-h-layout-modal-sm (4 modals + notification bell)
- max-h-[70vh] → max-h-layout-modal-xs (AddToPlaylistModal)
- max-h-[90vh] → max-h-layout-modal-lg (CreatorModal)
- max-h-[400px] → max-h-layout-list (QueuePanel, OfflineQueueManager)
- max-h-[500px] → max-h-layout-drawer (APIPlaygroundView)
- h-[60vh] → h-layout-lyrics (FullPlayer, TrackDetailPageHero/Skeleton)
- max-w-[400px] → max-w-lg (FullPlayer)

Zero arbitrary viewport heights remain in modals and panels.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:47:41 +01:00
senke
dc88ea6805 ui(tokens): migrate text-[10px] to text-xs across 23 components
Replace all arbitrary text-[10px] / text-[9px] with the standard Tailwind
text-xs token. Also migrates nearby arbitrary width values where applicable
(max-w-[200px] → max-w-48, max-w-[120px] → max-w-32, h-[1px] → h-px).

Only documented exceptions remain: avatar xs (text-[10px] for w-6 h-6
initials) and badge JSDoc reference.

Affected areas: admin views, marketplace, player, settings, chat, upload,
education, commerce, library, PWA, search, navbar, user card.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:47:19 +01:00
senke
680bb3976a ui(tokens): improve muted-foreground contrast for WCAG AA+ readability
Dark mode: oklch(0.65) → oklch(0.70) — closer to Spotify/Discord secondary text.
Light mode: oklch(0.45) → oklch(0.42) — stronger contrast on white backgrounds.
Sidebar-foreground synced with muted-foreground for consistency.

Also includes previously integrated but uncommitted token work:
- Modal max-height tokens and utility classes (max-h-layout-modal*)
- Lyrics height tokens (h-layout-lyrics*)
- Responsive lg: margin-left / left utility classes for shell
- prefers-reduced-motion support for transition-shell and player-bar-entrance
- Main offset-bottom adjusted to 9rem (144px) for player clearance

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:43:47 +01:00
senke
39b2b642d2 feat(web): UI premium Discord/Spotify-like — tokens, shadows, focus, layout
Plan UI premium 6–8 semaines (design system, shell, Storybook, a11y):

- Design system: DESIGN_TOKENS.md, APP_SHELL.md, FULL_LAYOUT_PAGE.md. Single source
  for layout/shell (index.css), shadows (design-system.css), durations/easing.
- Tokens: shadow-cover-depth, shadow-gold-glow, shadow-fab-glow; layout max-height
  (max-h-layout-drawer, max-h-layout-panel, max-h-layout-list). All duration-200/300/500
  replaced by --duration-fast/normal/slow. Arbitrary shadows replaced by token classes.
- Shell & player: Sidebar, Header, GlobalPlayer, MiniPlayer, PlayerQueue, PlayerControls,
  AudioPlayer use tokens; focus-visible on Sidebar, PlayerQueue, DropdownMenuTrigger/Item,
  TabsTrigger. Typography: text-[10px]/[9px] → text-xs where applicable.
- ESLint: no-restricted-syntax (warn) for w-/h-/rounded-/shadow-/text-/spacing arbitrary.
- Scripts: report-arbitrary-values.mjs, capture/compare/generate visual; visual-complete.spec.ts.
- Stories full layout: Dashboard, Playlists, Library, Settings, Profile in DashboardLayout.stories.
- .cursorrules + README: DESIGN_TOKENS, APP_SHELL, visual commands, no arbitrary without justification.
- apps/web/.gitignore: e2e test artifacts (test-results-visual, playwright-report-visual).

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 17:15:58 +01:00
senke
b1ed46b142 small fixes : cors + login loop 2026-02-07 20:36:48 +01:00
senke
1efafe0cc5 test(storybook): Playwright suite for full Storybook + Spotify/Discord polish
- Add playwright.config.storybook.ts: runs against storybook-static on :6007
- Add e2e/tests/storybook/storybook-all.spec.ts: one test per story (load iframe, no errors)
- Add scripts/serve-storybook-static.cjs: serves build or stub (empty index) when no build
- npm run test:storybook:playwright (after build-storybook) for full coverage
- Storybook decorator: use bg-background / design tokens for dark (#121212)
- Preview: default dark background #121212
- Button: secondary/ghost/glass aligned to Spotify/Discord (white/5, white/10 hover)
- KodoEmptyState: softer orbs, compact copy, primary CTA without heavy glow

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 20:30:49 +01:00
senke
37c5acc302 style(ui): Spotify-like palette, player, sidebar and dashboard polish
- Dark palette: background 0.11, card 0.14, sidebar 0.08 (Spotify #121212 feel)
- MiniPlayer: h-16, thinner progress bar, compact cover/times, rounded actions
- Sidebar: minimal header, lighter section labels, clean nav hover (no heavy border)
- Header: h-16, rounded search pill, compact user pill and dropdown
- Dashboard: pt-20 to match header, StatCard typography and spacing tweaks
- Visual: register-page snapshot + small maxDiffPixels tolerance for font variance

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 20:19:59 +01:00
senke
be7d7b02cc feat(e2e): Playwright + pixelmatch stack for pixel-perfect visual regression
- playwright.config.visual.ts: dedicated config, viewport 1280x720, Chromium only,
  snapshots in e2e/tests/visual/__snapshots__
- e2e/tests/visual/visual-regression.spec.ts: login, register, dashboard (full/header/sidebar),
  player bar, playlists, 404, mobile/tablet viewports; dark theme + reduceMotion
- scripts/visual-diff.js: optional pixelmatch script to generate diff image from two PNGs
- docs/VISUAL_TESTING_STRATEGY.md: strategy, commands, CI, workflow
- npm scripts: test:visual, test:visual:update, test:visual:report
- deps: pixelmatch, pngjs; @playwright/test aligned to 1.58.1
- baseline snapshots added for login, dashboard, playlists, 404, viewports

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 20:01:30 +01:00
senke
f31d204f6c feat(ui): dashboard StatCard surface + KodoEmptyState tokens (Spotify/Discord)
- StatCard: variant surface, rounded-xl icon box, text-foreground
- KodoEmptyState: variant surface, primary orbs/icon/CTA, no kodo-*

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 19:52:24 +01:00
senke
09f954951e feat(ui): login immersive — tokens, rounded-xl, surface card, primary CTA
- AuthInput: bg-card border-border focus:border-primary rounded-xl, 200ms transition
- AuthLayout: Card variant surface, logo bg-primary + glow
- AuthButton: rounded-xl, primary glow shadow, 200ms ease-in-out
- fix-login-form: inputs/button/checkbox rounded-xl, checkbox accent primary

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 19:52:12 +01:00
senke
1360199bed feat(ui): refactor global layout with immersive glassmorphism (Spotify/Discord-like)
- Palette: Discord-like deep cold grays (background 0.12, sidebar 0.09, card 0.16)
- Transitions: --duration-immersive 200ms ease-in-out for micro-interactions
- Sidebar: bg from var(--sidebar), rounded-xl, backdrop-blur-md; icons
  text-muted-foreground/60 → text-primary on hover/active; 2px teal active bar
- Header: backdrop-blur-md, 200ms transitions
- MiniPlayer: h-20, backdrop-blur-md, bg-background/80, border-white/5 (no harsh border)
- Play button: teal pill with diffuse glow (shadow primary/0.4)
- Card: new 'surface' variant (border white/5, hover lighter + diffuse shadow)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 19:44:40 +01:00
senke
3600f97b6d style(ui): P3 AdminSettingsView kodo-* → semantic tokens
- Borders/labels: kodo-steel → border-border, kodo-content-dim → text-muted-foreground
- Inputs/selects: bg-kodo-ink border-kodo-steel → bg-card border-border focus:border-primary
- Feature Flags: icon text-primary, rows bg-muted/50, toggle track bg-success
- Maintenance card: border-destructive/30, icon text-destructive, toggle bg-destructive/bg-muted
- Headings text-foreground for consistency

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 19:37:41 +01:00
senke
ca3aa6a1ce style(ui): P3 AdminModerationView kodo-* → semantic tokens
- border/text: kodo-steel → border-border, kodo-content-dim → text-muted-foreground
- kodo-text-main → text-foreground, kodo-red → destructive (tabs, card, reason, Ban button)
- Report block: bg-kodo-ink border-kodo-steel → bg-muted/50 border-border
- Loader and empty state use muted-foreground

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 19:36:27 +01:00
senke
ea1841a526 style(ui): P3 AdminAuditLogsView semantic tokens + elevated card
- Replace all text-kodo-content-dim with text-muted-foreground (audit P3)
- Card glass → elevated for consistency with admin dashboard

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 19:35:33 +01:00
senke
fb1c18dd69 style(ui): P3 Rajdhani fallback, dashboard StatCard semantic tokens
- index.css: add 'Inter' to --font-sans fallback (audit P3 glyph robustness)
- dashboard/StatCard.tsx: replace kodo-* with semantic tokens (primary,
  secondary, success, warning, destructive, muted-foreground)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 19:34:45 +01:00
senke
e0ed872e3c style(ui): dashboard cards elevated, progress bar contrast (audit §7.2, §6.1)
- Admin dashboard: StatCard, TrafficCard, ProtocolsCard, NodeHealthCard
  glass → elevated for main content depth (audit §7.2)
- MiniPlayer: progress rail bg-muted → bg-white/10, h-1 → h-1.5, fill
  bg-white → bg-primary for accessibility and consistency (§6.1)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 19:32:00 +01:00
senke
2c68b1ecab style(ui): P2 contrast muted-foreground, sidebar spacing, dashboard gap, compact play button
- index.css: --muted-foreground 0.70 → 0.73 in dark for better secondary text readability (audit §5.2)
- PlayerControls: compact play w-10→w-9, icon w-5→w-4; use bg-primary/text-primary-foreground
- Sidebar: space-y-6→space-y-8, section title mb-2→mb-3 mt-1 (audit §4.2)
- AdminDashboardView: stats grid gap-6→gap-8 (audit §4.3)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 19:30:13 +01:00
senke
3ddff494dc style(ui): unify sidebar badges to primary, improve card depth and affordance
Phase 1 audit (P0 & P1):
- Sidebar: badges use primary (teal) instead of secondary (magenta)
- AdminDashboardStatCard: 0% trend shown as muted, never red
- AdminDashboardTrafficCard: remove fake Math.random() data, show empty state
- Dark theme: increase card luminance (0.21), stronger borders
- Card variants: add border-white/10 to glass, border-border to default
- Header: search input bg-card + border-white/10, migrate kodo-* to semantic tokens
- MiniPlayer: h-20 max (was h-24)

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 19:28:12 +01:00
senke
746610fbb6 ci(storybook): implement batch processing and retry logic for audit script
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 17:07:28 +01:00
senke
47e535fb46 feat(ui): Zone 15 - Live & Checkout polish (Chat/Recommended/StreamInfo glass+glow, OrderSummary Card)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 16:47:18 +01:00
senke
b7c78618d0 feat(ui): Zone 14 - AdminView polish (Sidebar glass/glow, dashboard motion, UserTableRow tokens)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 16:46:36 +01:00
senke
be5ef43cee feat(ui): Zone 13 - Settings view polish (Header glass, Tabs container, Content/Skeleton sync)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 16:45:35 +01:00
senke
68179a5912 feat(ui): Zone 12 - Library & Analytics polish (min-h-layout-page, motion, glass/glow, skeleton sync)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 16:45:06 +01:00
senke
17234b6222 feat(ui): Zone 11 - MarketplaceView SaaS polish (glass, glow, motion, fix allProducts, ProductCard tokens)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 16:44:13 +01:00
senke
c1ce0c4b5a feat(ui): Zone 10 - SocialView SaaS polish (glass, glow, motion, error/empty)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 16:43:04 +01:00
senke
a3a3dd6546 style(commerce,upload,error): elevate Commerce, Upload, Error to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 16:07:09 +01:00
senke
8eac80ffb2 style(settings,auth): elevate Security and Auth to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 16:02:52 +01:00
senke
740f5b6308 style(player): elevate player components to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 16:01:56 +01:00
senke
823a0fe1ee style(player): elevate player components to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:33:31 +01:00
senke
e8864fdb25 style(playlists,ui): elevate PlaylistListToolbar, DataList, Select to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:26:55 +01:00
senke
7b545f34d1 style(layout): elevate Header, Navbar, AudioPlayer, Sidebar to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:25:44 +01:00
senke
cdc9890257 style(studio): elevate CloudFileBrowser to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:20:44 +01:00
senke
8cf22aa90c style(chat): elevate ChatSidebar and related stories to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:18:31 +01:00
senke
a69f9d1c89 style: fix leftover kodo in ProfileView, FileTableRow.stories, FocusTrap.stories
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:17:47 +01:00
senke
e293cc9366 style(stories): replace kodo decorators with design tokens in all story files
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:10:32 +01:00
senke
0218035f53 style(settings,views): elevate AccountSettings and ProfileView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:09:53 +01:00
senke
8a3da49fbd style(ui): elevate Dialog to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:08:52 +01:00
senke
aa81603276 style: fix leftover kodo tokens in ProjectDetailView, ProductDetailView, CourseDetailView, UploadViewStepper
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:08:19 +01:00
senke
3446af4b31 style(studio): elevate ProjectDetailView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:01:03 +01:00
senke
0da580ef6d style(streaming): elevate PlaybackHeatmap to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:01:00 +01:00
senke
ca856d807a style(marketplace): elevate ProductDetailView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:58:26 +01:00
senke
cd719fb960 style(education): elevate CourseDetailView and CourseLearningView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:57:13 +01:00
senke
945dc8d30c style(notifications): elevate NotificationMenu story to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:57:11 +01:00
senke
d600e3858c style(playlists): elevate playlist batch/track-list to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:54:46 +01:00
senke
9387af64d4 style(views): elevate UploadView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:54:19 +01:00
senke
d5f1fdaa90 style(studio): fix ConnectivityViewWebhooks leftover kodo tokens
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:54:17 +01:00
senke
95d261b2da style(settings): elevate TwoFactorSetup to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:42:45 +01:00
senke
73cc80b020 style(studio): elevate ProjectsManager to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:41:25 +01:00
senke
85dc9a49d7 style(studio): elevate CreateProjectModal to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:40:07 +01:00
senke
007eba6157 style(studio): elevate GoLiveView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:39:24 +01:00
senke
5159b9f34c style(studio): elevate ConnectivityView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:38:15 +01:00
senke
e96c3f5ceb style(settings,studio): remove remaining kodo in EditProfileIdentityCard and AIToolsViewSkeleton
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:37:35 +01:00
senke
91b4f50ed1 chore(storybook): exclude sb-common-assets from audit to reach 0 app errors
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:36:49 +01:00
senke
64061aff64 style(studio): elevate AIToolsView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:25:23 +01:00
senke
9a58d20198 style(studio): elevate CloudSettingsView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:25:20 +01:00
senke
6b762173c8 style(views): elevate StudioView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:23:54 +01:00
senke
c25b0e957f style(ui): elevate Dropdown, DropdownMenu, Tooltip to SaaS Premium; update test
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:23:04 +01:00
senke
688a4fe67d style(ui): elevate Tabs and Accordion to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:17:49 +01:00
senke
5ac6931999 style(settings): elevate EditProfile to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:17:10 +01:00
senke
a51f67a843 style(social): elevate Profile + GroupDetailView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:15:35 +01:00
senke
98eab26fa6 style(player): remove remaining kodo in AudioPlayerFull
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:14:17 +01:00
senke
3dc15ed2d8 style(discover): remove remaining kodo in DiscoverView Trending, Genres, types
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:13:58 +01:00
senke
92faee36e6 fix(settings): AccountSettingsPreferencesCard syntax and remaining kodo
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:12:39 +01:00
senke
33ba8d0612 style(ui): elevate OptimizedImage to SaaS Premium and update test
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:05:38 +01:00
senke
58f5f2a306 style(discover): elevate DiscoverView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:05:04 +01:00
senke
d169d71cd5 style(player): elevate AudioPlayer to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:04:13 +01:00
senke
2452ff3239 style(file-details): elevate FileDetailsView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:03:36 +01:00
senke
dda00ad565 style(seller): elevate CreateProductView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:03:00 +01:00
senke
95b5773477 style(settings): elevate AccountSettings cards to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:02:15 +01:00
senke
900151efc7 style(admin): elevate AdminDashboardView stories to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:01:29 +01:00
senke
f66dd3d638 style(checkout): elevate CheckoutView BillingCard and Header to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:01:11 +01:00
senke
f775c00a3b fix(views): remove remaining kodo in Purchases/Cart/Live/Marketplace/Social
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:00:55 +01:00
senke
0eb5260c9b style(views): elevate CheckoutView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:46:39 +01:00
senke
ac48d83c99 style(views): elevate LiveView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:45:38 +01:00
senke
cb3abd31e8 style(views): elevate AnalyticsView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:44:52 +01:00
senke
477b9c0fdf style(views): elevate MarketplaceView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:44:12 +01:00
senke
871be67446 style(views): elevate SocialView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:43:31 +01:00
senke
1131390437 style(views): elevate PurchasesView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:42:37 +01:00
senke
b8fb871465 style(views): elevate CartView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:41:56 +01:00
senke
6fadfb722c style(views): elevate SettingsView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:41:19 +01:00
senke
18c8feda19 style(views): elevate EducationView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:40:54 +01:00
senke
972372259f style(views): elevate NotificationsView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:40:29 +01:00
senke
073779116f style(views): elevate AdminView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:40:12 +01:00
senke
3ddf813275 style(views): elevate AuthView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:39:51 +01:00
senke
677163b11f style(views): elevate ChatView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:39:38 +01:00
senke
4dbab85804 style(library): elevate Library to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:39:18 +01:00
senke
6e9bacff54 style(ui): elevate Button to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:38:52 +01:00