Commit graph

1003 commits

Author SHA1 Message Date
senke
1420761025 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
2645d32a11 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
fc8aeef3e4 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
56c063cfae 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
00e0f1caa0 small fixes : cors + login loop 2026-02-07 20:36:48 +01:00
senke
1b7d1be65d 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
47ab1157d1 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
6fd4300fc3 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
411defe923 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
a99c4717a4 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
28b5e58043 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
d89895410a 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
1947c3efb1 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
439d1b0f03 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
1772440cc9 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
b58b99a104 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
8fe2c27ba9 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
693e39c91d 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
1613b053ee 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
f820c5218b 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
a9188beea0 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
0d0dc1bfe1 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
75fbac4bc2 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
3f895cea06 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
6ad60da747 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
9134a98fdb 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
1f590bd8f9 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
7cda77a6ad style(player): elevate player components to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 16:01:56 +01:00
senke
8155802452 style(player): elevate player components to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:33:31 +01:00
senke
eebaa842b0 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
b4d710b04e 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
91174e0758 style(studio): elevate CloudFileBrowser to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:20:44 +01:00
senke
4a7f3747ae 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
43139b0407 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
26b1197533 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
c6da22e418 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
47d8100d74 style(ui): elevate Dialog to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:08:52 +01:00
senke
caf067c96c 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
685fd52586 style(studio): elevate ProjectDetailView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:01:03 +01:00
senke
f9d99e0282 style(streaming): elevate PlaybackHeatmap to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:01:00 +01:00
senke
47ec1de44e style(marketplace): elevate ProductDetailView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:58:26 +01:00
senke
6b681a0e30 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
22a9b5adaf style(notifications): elevate NotificationMenu story to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:57:11 +01:00
senke
80daf08b17 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
6889d56d69 style(views): elevate UploadView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:54:19 +01:00
senke
6d2650b18e style(studio): fix ConnectivityViewWebhooks leftover kodo tokens
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:54:17 +01:00
senke
79ef026590 style(settings): elevate TwoFactorSetup to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:42:45 +01:00
senke
c56e975b5a style(studio): elevate ProjectsManager to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:41:25 +01:00
senke
b5fd3abc39 style(studio): elevate CreateProjectModal to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:40:07 +01:00
senke
3fb3815957 style(studio): elevate GoLiveView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:39:24 +01:00
senke
7a9e26087c style(studio): elevate ConnectivityView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:38:15 +01:00
senke
f41c9405a0 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
4c66630b43 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
be68ecc1e1 style(studio): elevate AIToolsView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:25:23 +01:00
senke
d749f7b965 style(studio): elevate CloudSettingsView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:25:20 +01:00
senke
4dd7f1bcb1 style(views): elevate StudioView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:23:54 +01:00
senke
0ac0705330 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
377b2ade4c 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
d7a7b4d8ef style(settings): elevate EditProfile to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:17:10 +01:00
senke
c3e718d1ff style(social): elevate Profile + GroupDetailView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:15:35 +01:00
senke
14e12a2c9e style(player): remove remaining kodo in AudioPlayerFull
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:14:17 +01:00
senke
0b91a137b4 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
0610f33b6c fix(settings): AccountSettingsPreferencesCard syntax and remaining kodo
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:12:39 +01:00
senke
b71fa3a91f 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
d84d8aa24f style(discover): elevate DiscoverView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:05:04 +01:00
senke
e48fa8c5b7 style(player): elevate AudioPlayer to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:04:13 +01:00
senke
4cb457511c style(file-details): elevate FileDetailsView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:03:36 +01:00
senke
8998589b4b style(seller): elevate CreateProductView to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:03:00 +01:00
senke
7531c02e44 style(settings): elevate AccountSettings cards to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:02:15 +01:00
senke
024b415289 style(admin): elevate AdminDashboardView stories to SaaS Premium
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:01:29 +01:00
senke
1e428052ee 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
73c764e04b 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
45c70e5760 style(views): elevate CheckoutView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:46:39 +01:00
senke
78f5e925d4 style(views): elevate LiveView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:45:38 +01:00
senke
520b35291a style(views): elevate AnalyticsView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:44:52 +01:00
senke
2d822263ee style(views): elevate MarketplaceView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:44:12 +01:00
senke
878b65ded4 style(views): elevate SocialView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:43:31 +01:00
senke
533b3bc29a style(views): elevate PurchasesView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:42:37 +01:00
senke
c76ccc1515 style(views): elevate CartView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:41:56 +01:00
senke
09116e8437 style(views): elevate SettingsView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:41:19 +01:00
senke
8e565b914b style(views): elevate EducationView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:40:54 +01:00
senke
812333474e style(views): elevate NotificationsView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:40:29 +01:00
senke
aea9235621 style(views): elevate AdminView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:40:12 +01:00
senke
8a2043fba6 style(views): elevate AuthView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:39:51 +01:00
senke
eb46eea54a style(views): elevate ChatView to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:39:38 +01:00
senke
0a4ff7fa63 style(library): elevate Library to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:39:18 +01:00
senke
4e701cc162 style(ui): elevate Button to SaaS Premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:38:52 +01:00
senke
dc41446a2b style(tracks): align story decorators with KŌDŌ tokens
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:17:00 +01:00
senke
15424f907b style(track-detail-page): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:16:07 +01:00
senke
5ea8493b7c style(TrackCard): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:14:35 +01:00
senke
2f696d8ec3 style(TrackListRow): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:13:34 +01:00
senke
ff1f3b1438 style(track-search): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:12:01 +01:00
senke
a2ba272763 style(TrackListContainer): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:11:47 +01:00
senke
701aeb1d61 style(UploadQuota): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:10:05 +01:00
senke
7bbe699cf9 style(track-grid): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:08:39 +01:00
senke
dbc82e5fb3 style(TrackStatsDisplay): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:07:10 +01:00
senke
10897bea30 style(TrackSort): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:05:27 +01:00
senke
98e767f9fd style(ShareDialog): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:04:19 +01:00
senke
eb5d00890b style(LikeButton): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:03:10 +01:00
senke
7c48665c95 style(TrackListSelectionActions): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:01:35 +01:00
senke
20723c7d83 style(ViewToggle): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 08:59:38 +01:00
senke
9ba46ccd7c style(track-search-filters): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 08:58:24 +01:00
senke
556833cfde style(track-list-pagination): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 08:56:06 +01:00
senke
20a9de8f33 style(track-filters): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 08:54:49 +01:00
senke
18abdc800b style(comment-thread): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 08:52:35 +01:00
senke
1ac1f38a7a style(track-history): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 08:49:21 +01:00
senke
1705c91500 style(tracks): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 08:35:52 +01:00
senke
f3ff72c76d style(comments): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 08:13:59 +01:00
senke
f41980a8c2 style(ui): elevate visual fidelity to premium standards
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 08:03:28 +01:00
senke
ddb4ab8a73 feat(tracks): use TrackListSkeleton for loading state and add Error story
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 07:40:16 +01:00
senke
1efbe18857 test(comments): add comprehensive stories and MSW mocks
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 07:33:05 +01:00
senke
aabc06fc88 feat(comments): add high-fidelity skeletons and Framer Motion transitions
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 07:32:49 +01:00
senke
7dd5c66a72 refactor(comments): modularize CommentSection with atomic sub-components
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 07:32:37 +01:00
senke
7032d658d8 refactor(tracks): split TrackDetailPage into module with Hero, CoverAndActions, Info, Tabs, Skeleton, NotFound
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 06:57:32 +01:00
senke
eae1c85726 refactor(playlists): split PlaylistDetailPage into module with Hero, CoverAndInfo, ActionsBar, Tabs, Skeleton, NotFound
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 06:46:30 +01:00
senke
d6d1b3b4c6 refactor(playlists): split PlaylistActions into module (buttons, edit dialog, skeleton)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 06:09:51 +01:00
senke
2437c1f41e refactor(web): split EquipmentDetailView into module (nav, gallery, specs, header, warranty, docs, service, skeleton)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 05:46:16 +01:00
senke
3e803083cb refactor(web): split TrackListPagination into module (info, nav, utils, skeleton)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 05:03:53 +01:00
senke
d166c9faca refactor(web): split PlaylistAnalytics into module (stat cards, main/advanced, error, skeleton)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 04:53:54 +01:00
senke
3ead0d7d64 refactor(web): split VirtualizedChatMessages into module (item, empty, loading, scroll btn, skeleton)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 04:44:26 +01:00
senke
3d8c98f037 refactor(web): split LibraryPage into module (toolbar, empty, grid, list, skeleton)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 04:31:06 +01:00
senke
d7ed2530e1 refactor(web): split router into module (PublicRoute, ProtectedLayoutRoute, routeConfig)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 04:16:37 +01:00
senke
76a9419e7f refactor(web): split ChatView into chat-view module
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 03:59:32 +01:00
senke
853718e230 refactor(web): split AuthView into auth-view module
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 03:53:59 +01:00
senke
4400a8a58d refactor(web): split AdminView into admin-view module
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 22:31:24 +01:00
senke
75ca4f5bb8 refactor(web): split NotificationsView into notifications-view module
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 22:22:47 +01:00
senke
030c53a24a refactor(web): split EducationView into education-view module
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 22:11:13 +01:00
senke
1a1b4972af refactor(web): split SettingsView into settings-view module
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 21:59:42 +01:00
senke
de9447f3c6 refactor(web): split CartView into cart-view module
- types: CartViewProps, CartDiscount
- useCartView: useCartStore, showPromo, discount, tax/finalTotal, handleApplyPromo
- CartViewEmpty, CartViewHeader, CartViewSummary, CartViewSecure, CartViewSkeleton
- PromoCodeModal in orchestrator; min-h-[60vh] -> min-h-layout-page-sm
- Stories: Default, Empty, Loading (Skeleton); decorator min-h-layout-page
- Re-export from CartView.tsx

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 21:49:55 +01:00
senke
6a51afb0a7 refactor(web): split PurchasesView into purchases-view module
- types: PurchasesViewProps, Purchase
- usePurchasesView: commerceService.getPurchases, search, refund, download
- PurchasesViewHeader, PurchasesViewItem, PurchasesViewList, PurchasesViewSkeleton
- RefundRequestModal in orchestrator; Loading renders Skeleton
- Stories: Default, Empty (initialPurchases []), Loading (Skeleton)
- Re-export from PurchasesView.tsx

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 21:42:35 +01:00
senke
51e017a3d5 refactor(web): split SocialView into social-view module
- types: SocialViewProps, SocialTabKey
- useSocialView: feedTracks (trackService.list), activeTab, playTrack
- SocialViewSidebar, SocialViewFeed, SocialViewFeedItem, SocialViewTrending, SocialViewSkeleton
- Loading renders Skeleton; decorator min-h-layout-page
- Re-export from SocialView.tsx

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 21:34:18 +01:00
senke
ea0daa3c00 refactor(web): split MarketplaceView into marketplace-view module
- types: MarketplaceViewProps, MarketplaceCategory; useMarketplaceView with marketplaceService/fallback
- MarketplaceViewHeader, MarketplaceViewCategories, MarketplaceViewSidebar, MarketplaceViewGrid, MarketplaceViewSkeleton
- allProducts for ProductDetailView similarProducts; min-h-screen -> min-h-layout-page
- Stories: Default, Loading (Skeleton); decorator min-h-layout-page
- Re-export from MarketplaceView.tsx

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 18:42:16 +01:00
senke
eaab9a545e refactor(web): split AnalyticsView into analytics-view module
- types: AnalyticsViewProps, DateRangeKey, GlobalStats, TopTrackRow, TrafficSource, DeviceStats, ChartHoverData
- useAnalyticsView: dateRange, stats, topTracks, trafficSources, deviceStats, loading, hoveredData, handleExport
- AnalyticsViewHeader, AnalyticsViewKpiGrid, AnalyticsViewChart, AnalyticsViewOrigins, AnalyticsViewPlatforms, AnalyticsViewTopTracks, AnalyticsViewSkeleton
- Data via analyticsService; loading renders Skeleton
- text-[10px] -> text-xs, tracking-[0.2em] -> tracking-wide
- Stories: Default, Loading (Skeleton); decorator min-h-layout-page
- Re-export from AnalyticsView.tsx

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 18:33:42 +01:00
senke
0dcf1dc20f refactor(web): split LiveView into live-view module
- types.ts: LiveViewProps, LiveViewChatMessage; mockData: FEATURED_STREAM, CHAT_MESSAGES
- useLiveView: stream, chatMessages, msgInput, handleSend, addToast
- LiveViewPlayer, LiveViewStreamInfo, LiveViewRecommended, LiveViewChat, LiveViewSkeleton
- Layout h-[calc(100vh-120px)] -> min-h-layout-main; text-[10px] -> text-xs
- Stories: Default, Loading (Skeleton); decorator min-h-layout-page
- Re-export from LiveView.tsx

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 18:15:41 +01:00
senke
2d26429417 refactor(web): split CheckoutView into checkout-view module
- types.ts: CheckoutViewProps, CheckoutFormState, INITIAL_CHECKOUT_FORM
- useCheckoutView: form state, cart/tax, handlePurchase, onComplete
- CheckoutViewHeader, CheckoutViewBillingCard, CheckoutViewPaymentCard,
  CheckoutViewOrderSummary, CheckoutViewSkeleton
- CheckoutView orchestrator; re-export from CheckoutView.tsx
- Stories: Loading (Skeleton), Default, Processing, Success
- Decorator min-h-screen -> min-h-layout-page

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 18:04:13 +01:00
senke
9039f15a25 refactor(web): split AdminDashboardView into admin-dashboard-view module
- types: DashboardStats, UploadItem, AuditLogItem, StatCardProps, Report
- useAdminDashboardView: fetchData, handleAction, triggerProtocol
- Header, StatCard, TrafficCard, ProtocolsCard, NodeHealthCard, Tabs
- AdminDashboardSkeleton for Loading state
- max-w-layout-content, text-xs, gap-0.5 (no arbitrary values)
- Stories: Default, Loading (Skeleton). Decorator min-h-layout-page
- Re-export from AdminDashboardView.tsx

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 17:54:02 +01:00
senke
aa5d46895d refactor(web): split AccountSettings (components/settings/account) into module
- account-settings/types: AccountSettingsUserMock, AccountSettingsToggles
- useAccountSettingsPage: view, modals, user, toggles, theme, setThemeOption
- IdentityCard, PreferencesCard, NotificationsCard, PrivacyCard, DangerCard
- AccountSettingsSkeleton for Loading state
- Privacy labels text-xs (no text-[10px])
- Theme selection: isOptionSelected(theme, variant)
- Stories: Default, Loading (Skeleton). Decorator min-h-layout-page
- Re-export from AccountSettings.tsx

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 17:42:57 +01:00
senke
cc8bd68b07 refactor(web): split ChatInterface into chat-interface module
- types.ts: ChatInterfaceProps
- useChatInterface: state, wsService, loadMessages, loadChatStats, handleSendMessage, formatTimestamp
- ChatInterfaceHeader, ChatInterfaceMessages, ChatInterfaceInput
- ChatInterfaceSkeleton for Loading state
- Stories: Default, ProductionRoom, Loading (Skeleton)
- Decorator h-[600px] -> min-h-layout-page
- Re-export from ChatInterface.tsx

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 14:24:41 +01:00
senke
4e4ba02b7b refactor(web): split CreateProductView into create-product-view module
- types.ts: LicenseConfig
- useCreateProductView: form state, updateLicense, handlePublish, handleSaveDraft
- CreateProductViewHeader, CoverCard, FilesCard, DetailsCard, PricingCard
- CreateProductViewSkeleton for Loading state
- Textarea min-h-24 (no arbitrary value)
- MSW: POST marketplace/products for Storybook
- Stories: Default, Loading (Skeleton)
- Re-export from CreateProductView.tsx

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 14:16:38 +01:00
senke
7f9345b4d0 refactor(web): split FileDetailsView into file-details-view module
- types.ts: FileDetailsViewProps, ActivityItem, VersionItem
- mockData.ts: MOCK_ACTIVITY, MOCK_VERSIONS, getMockFile
- useFileDetailsView.ts: hook returning file, activity, versions
- FileDetailsViewHeader, Preview, Metadata, Activity, Versions, Storage
- FileDetailsViewSkeleton for Loading state
- Layout: min-h-layout-page-sm, badge text-xs
- Imports use @/ for Storybook resolution
- Stories: Default, Loading (Skeleton)
- Re-export from FileDetailsView.tsx

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 14:05:44 +01:00
senke
f9db7b1f32 refactor(web): split VirtualizedList into virtualized-list module
- virtualized-list/types.ts: VirtualizedListProps
- virtualized-list/useInfiniteScroll.ts: useInfiniteScroll hook
- virtualized-list/useScrollPosition.ts: useScrollPosition hook
- virtualized-list/VirtualizedList.tsx: main component
- Re-export from virtualized-list.tsx via ./virtualized-list/index
- Test mock extended with getTotalSize, measureElement, key on virtual items
- 4 tests pass

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 13:55:06 +01:00
senke
ed33ba1d85 refactor(web): split AudioContext into context/audio-context module
- types.ts: VisualizerSettings, AudioContextType
- mockTracks.ts: mock track data for initial state
- useAudioContextValue.ts: all state, effects, and actions
- AudioContext.tsx: createContext, useAudio, AudioProvider
- Re-export from context/AudioContext.tsx (useAudio, AudioProvider, VisualizerSettings)
- Fix toggleMute to toggle isMuted (was incorrectly toggling isPlaying)
- 12 tests pass

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 13:46:29 +01:00
senke
d53a049a41 refactor(player): decompose AudioPlayer into audio-player module
- Add audio-player/ with useAudioPlayerLifecycle, AudioPlayerCompact, AudioPlayerFull, AudioPlayerSkeleton
- Re-export and default export from AudioPlayer.tsx
- Story Loading uses AudioPlayerSkeleton; 20 tests pass

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 13:37:04 +01:00
senke
e76667cfd1 refactor(library): decompose UploadModal into upload-modal module
- Add upload-modal/ with useLibraryUploadModal, UploadModalForm, UploadModalFooter, types
- Re-export UploadModal from UploadModal.tsx
- Form ids for a11y (library-upload-*); trigger role=button tabIndex=0

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 13:26:19 +01:00
senke
107d98eeaa refactor(views): decompose DiscoverView into discover-view module
- Add discover-view/ with useDiscoverView, Hero, Trending, NewReleases, Genres, Skeleton, Error
- Re-export DiscoverView from DiscoverView.tsx
- Loading: Skeleton instead of h-[50vh] spinner; Error: min-h-layout-page-sm
- Conformity: UPDATED badge text-[10px] -> text-xs
- Stories: Default, Loading (Skeleton), Error

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 13:19:25 +01:00
senke
8e05e15d19 refactor(profile): decompose UserProfilePage into user-profile-page module
- Add user-profile-page/ with useUserProfilePage, Hero, Header, Tabs, Skeleton, Error
- Re-export UserProfilePage from UserProfilePage.tsx
- Stories: Default (/u/demo), Loading (Skeleton), NotFound (/u/notfound)
- MSW: GET /api/v1/users/by-username/:username (404 for notfound)
- Tests: mock useUserProfilePage, ToastProvider; 7 tests pass

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 13:10:33 +01:00
senke
a8db2eec5d refactor(social): GroupDetailView module, useGroupDetailView, Header, Members, Events, Sidebar, Skeleton, stories
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 12:34:57 +01:00
senke
19033b1e68 refactor(settings): EditProfile module, useEditProfile, ImagesCard, IdentityCard, Sidebar, Skeleton, cropUtils, stories
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 11:45:16 +01:00
senke
6a68d4dc21 refactor(forms): FormBuilder module, useFormBuilder, FormBuilderFieldWidget, re-export, stories, a11y id
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 11:36:20 +01:00
senke
7dfd2e2592 refactor(monitoring): MonitoringDashboardContent split into Header, Stats, ValidationCard, ErrorsCard, PerformanceCard
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 11:27:54 +01:00