senke
6a1686aad8
feat(auth): add OAuth Spotify provider (A1)
2026-02-20 14:48:08 +01:00
senke
134b8979c0
chore(v0.102): consolidate remaining changes — docs, frontend, backend
...
- docs: SCOPE_CONTROL, CONTRIBUTING, README, .github templates
- frontend: DeveloperDashboardView, Player components, MSW handlers, auth, reactQuerySync
- backend: playback_analytics, playlist_service, testutils, integration README
Excluded (artifacts): .auth, playwright-report, test-results, storybook_audit_detailed.json
2026-02-20 13:02:12 +01:00
senke
ef016a07ed
docs(live): document Go Live limitation (A6)
2026-02-20 12:56:29 +01:00
senke
0cf68964a0
feat(player): Lot F - PlaybackSpeedControl, useMediaSession, waveform
...
- Add playbackSpeed to playerStore with setPlaybackSpeed action
- Add setPlaybackRate to AudioPlayerService
- Create PlaybackSpeedControl (0.5x–2x) and integrate in GlobalPlayer
- Create useMediaSession hook for OS controls (title, artwork, play/pause/next/prev)
- Add waveform preview in PlayerBarProgress (placeholder bars client-side)
- Update types, tests, and mocks
2026-02-20 00:40:53 +01:00
senke
118925da71
feat(social): Lot E - Like/Comment API + RoleBadge on profile
...
- Connect SocialViewFeedItem like to socialService.toggleLike(track.id, 'track')
- Connect SocialViewFeedItem comment to socialService.postComment (expandable form)
- Update socialService.postComment to use POST /social/comments (target_id, target_type, content)
- Add RoleBadge component and display on UserProfilePageHeader
- Fetch user roles via getUserRoles in useUserProfilePage
- Add MSW handlers for POST /social/like and POST /social/comments
2026-02-20 00:25:08 +01:00
senke
33e88c3e91
feat(playlists): Lot D - DuplicatePlaylistButton, Export, Share, Recommendations
...
- Add duplicatePlaylist() to playlistService (POST /playlists/:id/duplicate)
- Implement DuplicatePlaylistButton with navigation to new playlist on success
- Add DuplicatePlaylistButton and ExportPlaylistButton to PlaylistDetailPageActionsBar
- Add MSW handlers for duplicate and export endpoints
- SharePlaylistModal and PlaylistRecommendations already wired (flags enabled)
2026-02-20 00:22:42 +01:00
senke
753322b8ed
feat(queue): sync playerStore with backend API, migrate QueueView to usePlayerStore
...
- Add useQueueSync hook: restore queue on login, sync add/remove/reorder/clear
- Extend queueApi.getQueue to return queueItemIds for backend sync
- Migrate QueueView from useAudio to usePlayerStore + usePlayer
- Add ConfirmationDialog for Clear Queue button
- Add MSW handlers for GET/PUT/POST/DELETE queue endpoints
- Wire useQueueSync in DashboardLayout
2026-02-20 00:13:33 +01:00
senke
d0690b2f76
feat(live): replace mock fallback with real API
2026-02-19 23:42:20 +01:00
senke
b934fd9e93
feat(gear): connect CRUD operations and add category filter
2026-02-19 23:41:46 +01:00
senke
df0eb9b0ad
fix(e2e): align CI Go version to 1.24 for v0.101
...
fix(web): resolve lint errors for v0.101
- eslint: add ignores (e2e, scripts, playwright-report, generated types)
- eslint: add browser globals, disable react-hooks in stories
- fix empty catch blocks (Cart, MarketplacePage, RolesPage, SettingsPage)
- fix PlayerExpanded: move useEffect before early return
- fix TrackHistory.test: rename type import to avoid no-redeclare
2026-02-19 16:27:10 +01:00
senke
9b8a4f83be
fix(frontend): resolve failing tests for v0.101
...
- setup: mock HTMLCanvasElement.getContext and HTMLMediaElement.pause for JSDOM
- bitrateService: accept multiple network error message patterns
- TrackDetailPage: use Object.defineProperty for navigator.clipboard
2026-02-19 12:07:02 +01:00
senke
93c9f19b86
fix(storybook): resolve audit errors - usePlaylistSearch loop, MSW handlers, ignore patterns
...
- usePlaylistSearch: use useRef for toastError to avoid infinite loop in useEffect
- handlers-playlists: fix search response format (playlists/total/page/limit)
- handlers-playlists: fix list response (items -> playlists)
- handlers-playlists: add GET playlists/:id/analytics handler
- PlaylistSearch.stories: fix Empty story response format
- audit-storybook: add MSW, swagger, .mdx ignore patterns
- audit-storybook: cap errors per story (MAX_ERRORS_PER_STORY=100)
2026-02-17 22:22:39 +01:00
senke
ceeab72459
refactor(ui): migrate arbitrary values to layout tokens
...
- AstralBackground: w-[60%] h-[60%] → w-3/5 h-3/5
- ChatInput/ChatMessage: h-[28rem]/h-[25rem] → h-96 max-h-layout-list
- ChatMessage: max-w-[80%] → max-w-4/5
2026-02-17 17:05:08 +01:00
senke
2116909be6
refactor(ui): replace gray colors with Sumi tokens
...
- placeholder-gray-500 → placeholder:text-muted-foreground (textarea, SharePostModal, SearchBar)
- text-gray-400 → text-muted-foreground (Card.stories, DashboardLayout.stories)
- TrackInfo: add data-testid for separator, update test selector
- bg-gray-900/bg-gray-100 → bg-background in player stories
2026-02-17 17:03:57 +01:00
senke
e11984898d
chore: consolidate CI, E2E, backend and frontend updates
...
- CI: workflows updates (cd, ci), remove playwright.yml
- E2E: global-setup, auth/playlists/profile specs
- Remove playwright-report and test-results artifacts from tracking
- Backend: auth, handlers, services, workers, migrations
- Frontend: components, features, vite config
- Add e2e-results.json to gitignore
- Docs: REMEDIATION_PROGRESS, audit archive
- Rust: chat-server, stream-server updates
2026-02-17 16:43:21 +01:00
senke
5063a941d2
feat(chat): delivered status display
...
- Add status and delivered_at to ChatMessage
- Handle MessageDelivered WebSocket event
- Send Delivered when receiving NewMessage or loading history
- Display ✓ (sent) / ✓✓ (delivered) in ChatMessageComponent
2026-02-17 16:42:36 +01:00
senke
d89d3d123b
feat(analytics): complete backend analytics, remove frontend mocks
2026-02-15 16:21:20 +01:00
senke
0630dc5617
refactor(frontend): simplify TokenStorage usage for httpOnly cookie auth
2026-02-15 16:04:42 +01:00
senke
cfe1d04b86
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
f85e0f14ec
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
cf81fc12f3
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
0343feab34
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
3298540000
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
44bcaa5b8e
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
7f7b6547bc
chore: consolidate pending changes (Hyperswitch, PostCard, dashboard, stream server, etc.)
2026-02-14 21:45:15 +01:00
senke
cf9c91e26f
fix(tests): resolve playlistService skipped tests, document requestDeduplication flag
2026-02-14 18:13:01 +01:00
senke
04c25aa24f
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
e4e5b00b36
fix(web): stabilize Vitest suite (auth integration: wrap with QueryClientProvider)
2026-02-14 14:21:17 +01:00
senke
670282989b
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
0a29c544af
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
caa23312fe
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
b97c2757ca
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
4b68b2704f
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
d493050dd3
fix: remove as any casts from application components
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 22:17:55 +01:00
senke
e0a4fb979c
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
9898d0438c
refactor: unify loading components -- consolidate Spinner into LoadingSpinner
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 22:04:45 +01:00
senke
d7562ba51f
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
03aad8eefa
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
8dfebb9dd0
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
960e0d255e
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
0a6772602c
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
db0489d322
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
038b637a3f
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
8cbd4f7558
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
382b125c84
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
60225ed5ec
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
dce0654720
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
5cc720be8f
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
309ba5bc8a
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
124b20d670
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
82fff00130
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
178ea79d17
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
22a4095db3
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
b4d7ad9c4c
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
7b315df86c
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
85a40aeed1
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
91d6b08393
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
67775dc2bb
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
13476dda6e
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
e67b861da4
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
9f40182ad1
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
c25448e284
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
186e4b47e6
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
d39ffcbaad
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
401c022844
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
f8a0847584
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
1e089d8193
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
69577e9980
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
77ab0e16fc
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
11b5a83136
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
2d6e217dcb
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
74434239d0
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
5fe81b9333
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
d829e228a8
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
0e063aafb3
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
279b2bc937
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
154bca0a22
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
447389fc95
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
1473d04249
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
1a013ed829
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
e197ba8734
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
93b2eb8980
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
e95075d92c
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
bcf07f1e16
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
27fc9d6bd7
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
0fe87de8bf
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
77758bc51a
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
128a160196
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
e48f8889e0
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
1e897c95a0
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
f9ed6915fc
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
68a4aba534
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
ffc092621e
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
71b4f6b9cc
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
8c3e7c1a36
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
47f325182a
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
4f58f19856
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
8267985824
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
dec0359dcb
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
3afc7e7762
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
b04336129a
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
333aeee226
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
9f102c14bf
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
6d24bd9941
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
83edd463c6
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
2b383b8d3c
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
320c8e3435
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
7ac7b84fe9
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
66a56409ad
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
875df12d8b
small fixes : cors + login loop
2026-02-07 20:36:48 +01:00
senke
01bfea96c2
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
2a0878bee8
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
6695f06a7d
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
ebf40ab134
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
81f1dbf33a
style(player): elevate player components to SaaS Premium
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 16:01:56 +01:00
senke
bd6908f6bf
style(player): elevate player components to SaaS Premium
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:33:31 +01:00
senke
96d6c9dc9e
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
991bfcedb8
style(studio): elevate CloudFileBrowser to SaaS Premium
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:20:44 +01:00
senke
4a0f7eae92
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
9044b9f1d7
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
db5ee629da
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
eaf2e38f65
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
5d9355f5ce
style(streaming): elevate PlaybackHeatmap to SaaS Premium
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:01:00 +01:00
senke
7d6c18cc94
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
16ce8290c8
style(social): elevate Profile + GroupDetailView to SaaS Premium
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:15:35 +01:00
senke
ea036d060f
style(player): remove remaining kodo in AudioPlayerFull
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:14:17 +01:00
senke
5657c30e9d
style(player): elevate AudioPlayer to SaaS Premium
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:04:13 +01:00
senke
daa64dcc0a
style(library): elevate Library to SaaS Premium standards
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:39:18 +01:00
senke
9ae3e1d5a3
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
c7ffd271f8
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
2ae565a360
style(TrackCard): elevate visual fidelity to premium standards
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:14:35 +01:00
senke
3eb5ee7dbb
style(TrackListRow): elevate visual fidelity to premium standards
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:13:34 +01:00
senke
a60e35f02a
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
6cbcda455e
style(TrackListContainer): elevate visual fidelity to premium standards
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:11:47 +01:00
senke
6463ffb6cf
style(UploadQuota): elevate visual fidelity to premium standards
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:10:05 +01:00
senke
4433ec8c9c
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
40a9fa6e56
style(TrackStatsDisplay): elevate visual fidelity to premium standards
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:07:10 +01:00
senke
df26e35623
style(TrackSort): elevate visual fidelity to premium standards
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:05:27 +01:00
senke
cc6dff94fe
style(ShareDialog): elevate visual fidelity to premium standards
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:04:19 +01:00
senke
636ccb06d4
style(LikeButton): elevate visual fidelity to premium standards
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:03:10 +01:00
senke
0757e0eb2e
style(TrackListSelectionActions): elevate visual fidelity to premium standards
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 09:01:35 +01:00
senke
e862516c1b
style(ViewToggle): elevate visual fidelity to premium standards
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 08:59:38 +01:00
senke
26a497464e
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
a9d13be10f
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
8db8c5e6ca
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
ac863c31de
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
58d47f3e38
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
c9cef0f36d
style(tracks): elevate visual fidelity to premium standards
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 08:35:52 +01:00
senke
4b2d86414b
style(comments): elevate visual fidelity to premium standards
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 08:13:59 +01:00
senke
e3dbbbb032
style(ui): elevate visual fidelity to premium standards
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 08:03:28 +01:00