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
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
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
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
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
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
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
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
276229a0e4
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
0527eb76e5
test(comments): add comprehensive stories and MSW mocks
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 07:33:05 +01:00
senke
9573b8261c
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
65e8a69db2
refactor(comments): modularize CommentSection with atomic sub-components
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 07:32:37 +01:00
senke
1c4b35a51e
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
79eed88e57
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
f0d3a2786c
refactor(tracks): TrackHistory module, re-export, stories, tests
...
- Module track-history: types, useTrackHistory, Header, Empty, ItemRow, Pagination, Skeleton, trackHistoryUtils
- Re-export from TrackHistory.tsx
- Stories: Default, Loading, Empty, Error (MSW)
- Tests: mock @/features/tracks/services/trackHistoryService, formatHistoryDate defensive, pagination/error tests fixed
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 01:34:58 +01:00
senke
9f97bbfc0b
refactor(tracks): split TrackSearchFilters into module (Basic, Advanced, Skeleton)
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-05 23:09:36 +01:00
senke
c71da0bc92
refactor(tracks): extract TrackFilters into track-filters module
...
- Add track-filters/ with useTrackFilters, TrackFiltersHeader, TrackFiltersSearch,
TrackFiltersGrid, TrackFiltersClear, TrackFiltersSkeleton, types
- Re-export from TrackFilters.tsx for backward compatibility
- Stories: Default, Collapsible, Loading (skeleton)
- Layout primitive min-h-layout-story for skeleton; no arbitrary values
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-05 22:46:11 +01:00
senke
8835b5d1c5
test(tracks): add stories and mocks for CommentThread
...
- Stories: EmptyReplies, LoadingReplies, ReplyError; decorator uses max-w-2xl, min-h-layout-story
- CommentThreadSkeleton.stories.tsx
- MSW: PUT */api/v1/comments/:id for update; useUser mock in CommentThread.test
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-05 19:20:58 +01:00
senke
ae86c0a123
refactor(tracks): decompose CommentThread into sub-components
...
- Add comment-thread module: types, useCommentReplies, useCommentActions
- Presentational components: CommentThreadHeader, CommentThreadContent,
CommentThreadActions, CommentReplyForm, CommentRepliesList
- CommentThreadSkeleton for Loading state
- CommentThread.tsx becomes orchestrator (~170 lines); re-export from module
- FE-COMP-012 preserved; no breaking change for CommentSection
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-05 19:20:47 +01:00
senke
2964cec09a
chore(dx): add .cursorrules and design system audit documentation
2026-02-05 14:20:06 +01:00
senke
e772d81226
refactor(storybook): remove duplicate providers from stories (Phase 2)
...
Stories no longer wrap with QueryClientProvider, ToastProvider,
ThemeProvider, or MemoryRouter; global StorybookDecorator provides them.
- Route-specific pages use parameters.router.initialEntries
(ResetPasswordPage, VerifyEmailPage) or minimal MemoryRouter+Route
where useParams is needed (TrackDetailPage, PlaylistDetailPage).
- Stories that seeded query cache use useQueryClient() from global
decorator (FollowButton, CollaboratorManagement, CommentSection).
- Navbar, AuthLayout, DashboardLayout, Header, and 25+ story files
simplified to layout divs only.
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-05 13:08:17 +01:00
senke
765497ea31
fix(storybook): remediate crashes and improve mock stability
...
- Add global AuthProvider and QueryClientProvider
- Fix Loader2 reference error in CommentThread
- Fix coverUrl crash in ProductCard
- Fix double-slash URL bug in logger
- Improve MSW handlers and environment config
2026-02-04 19:33:00 +01:00
senke
9b4e66cd43
chore(storybook): improve configuration and cleanup
2026-02-04 00:44:40 +01:00
senke
0e9b206389
stabilisation: fix commit
2026-02-03 09:56:11 +01:00
senke
c73165196c
feat(storybook): complete comprehensive ui coverage for auth, player, tracks, and groups
2026-02-02 20:55:57 +01:00
senke
d42a7b3c24
feat(storybook): complete UI coverage with Batches 26-30
...
- Batch 26 (Tracks List/Grid): added stories for row, grid, sort, toggle, skeleton, empty states.
- Batch 27 (Dashboard): added stories for ActivityGraph, TrackList widget.
- Batch 28 (Education): added stories for CourseCard, MyCoursesView, QuizModal, CertificateModal.
- Batch 29 (Inventory): added stories for EquipmentCard, InventoryView.
- Batch 30 (Seller/Live): added stories for SellerDashboardView, FlashSaleModal, LiveStreamDetailView, TipStreamerModal.
- Verified build and fixed AudioProvider/service dependencies.
2026-02-02 20:47:47 +01:00
senke
5ed179cfa8
feat(storybook): add stories for Auth, Player, Tracks, Dashboard (Batches 22-25)
...
- Batch 22 (Auth/Settings): OAuthButtons, PasswordStrengthIndicator, ThemeSwitcher, TwoFactorSettings
- Batch 23 (Player): TimeDisplay, RepeatShuffleButtons, NextPreviousButtons, QualitySelector
- Batch 24 (Tracks): LikeButton, TrackFilters, TrackStatsDisplay
- Batch 25 (Dashboard): StatCard
- Fixed build issues with sonner dependencies.
2026-02-02 20:42:51 +01:00
senke
27c6e6b67f
feat(storybook): expanded coverage for feature components (batches 10-12)
...
- Batch 10 (Auth): AuthButton, AuthInput, LoginForm, RegisterForm
- Batch 11 (Chat): ChatMessage, ChatInput, TypingIndicator
- Batch 12 (Player/Tracks): PlayPauseButton, VolumeControl, ProgressBar, TrackCard
- Achieved extensive functional component coverage.
2026-02-02 20:19:10 +01:00
senke
d0c270314e
improving UI: adding API doc to Developer Page
2026-01-26 14:12:17 +01:00
senke
fee6904e7e
feat(frontend): complete design system migration and cleanup old pages
2026-01-25 12:33:46 +01:00
senke
5dedc2ce4e
fix: Corriger URL Swagger et finaliser implémentation DeveloperPage
...
- Ajouter fallback pour Swagger UI si doc.json ne fonctionne pas
- Améliorer message d'erreur avec bouton pour ouvrir Swagger UI directement
- Les fonctionnalités API Keys et Usage Stats sont maintenant complètes et fonctionnelles
- Tous les onglets de DeveloperPage sont maintenant implémentés
2026-01-18 13:55:28 +01:00
senke
c5a3f8206d
fix: Corriger extraction des données de recherche depuis réponse API imbriquée
...
- Gérer la structure imbriquée response.data.data.pagination et response.data.data.tracks
- Ajouter fallback pour structure plate si nécessaire
- Corriger extraction pour tracks et users search
- Les résultats de recherche s'affichent maintenant correctement
2026-01-18 13:29:02 +01:00
senke
7c69474cf9
aesthetic-improvements: align spacing to 8px grid (Action 11.2.1.3)
...
- Created automated script (scripts/align-8px-grid.py) to align all spacing to 8px grid
- Replaced non-8px-aligned spacing: gap-3/p-3/m-3 (12px) → gap-4/p-4/m-4 (16px), gap-5/p-5/m-5 (20px) → gap-6/p-6/m-6 (24px), gap-10/p-10/m-10 (40px) → gap-12/p-12/m-12 (48px), gap-20/p-20/m-20 (80px) → gap-24/p-24/m-24 (96px)
- Preserved: 4px values (gap-1, p-1, m-1) as they may be intentional fine-tuning, responsive breakpoints (sm:, md:, lg:), test files, documentation
- Modified files across all components to ensure consistent 8px grid alignment
- Action 11.2.1.3: Align all elements to 8px grid - COMPLETE
2026-01-16 11:50:46 +01:00
senke
41b1cfaedd
aesthetic-improvements: automated replacement of decorative cyan with steel (80/20 rule, Action 11.3.1.3)
...
- Created automated script (scripts/replace-decorative-cyan.py) to systematically replace decorative/informational kodo-cyan instances with kodo-steel variants
- Script intelligently preserves active/functional states, design system variants, semantic indicators, and interactive states
- Modified 85 files, replaced 145 decorative instances, preserved 47 functional instances
- No linter errors, type safety maintained
- Action 11.3.1.3 significantly advanced (total: ~302 instances replaced across ~229 files including previous batches)
2026-01-16 11:40:13 +01:00
senke
3250cc7f70
aesthetic-improvements: reduce decorative cyan in track detail and library (80/20 rule, batch 7)
...
- TrackDetailPage: decorative empty state icon (text-kodo-cyan → text-kodo-steel) and informational play count text (text-kodo-cyan → text-kodo-steel)
- LibraryPage: decorative genre badges (bg-kodo-cyan/10 text-kodo-cyan → bg-kodo-steel/10 text-kodo-steel, 2 instances: grid view and list view)
- Total: ~2 files, ~4 instances replaced
- Preserved: Active/selected states (LibraryPage view mode selection, selected tracks, TrackList selected tracks, TrackListRow selected state, QualitySelector selected quality, PlaybackSpeedControl selected speed, PlaylistBatchActions batch mode banner, ChatSidebar selected conversation, TrackFilters active filters badge, PlaylistList selected view mode, TrackGridDensitySelector selected density, ViewToggle selected view mode), semantic status indicators (TrackHistory updated action), functional loading indicators (PlayerLoading spinner), primary actions, design system variants
- Action 11.3.1.3 in progress (seventh batch: track detail and library genre badges)
2026-01-16 11:17:46 +01:00
senke
bcf8ded605
aesthetic-improvements: replace remaining secondary cyan hover states with steel
...
- TrackListSelectionActions: clear selection button hover (1 instance)
- CreateGroupModal: upload zone placeholder text hover (1 instance)
- AddToPlaylistModal: new playlist button icon hover (1 instance)
- Total: ~3 files, ~3 instances replaced
- Preserved: Primary send button (ChatInput), all primary player controls, all primary CTAs
- Action 11.3.1.2 in progress (sixth batch complete)
2026-01-16 11:00:12 +01:00
senke
77dfbaedf1
aesthetic-improvements: replace secondary cyan hover states with steel (batch 4)
...
- LibraryPage: card hover border, title hover text (3 instances, also removed scale transform)
- ProductCard: title hover text (1 instance)
- TrackListSelectionActions: action button hovers (5 instances: play, like, download, more, clear) - replaced with hover:bg-white/5
- AuthLayout: footer link hover text (1 instance)
- Pages: SocialPage, GearPage, DeveloperPage outline button hovers (3 instances)
- SocialPage: comment button hover text (1 instance)
- Total: ~8 files, ~14 instances replaced
- Preserved: Primary buttons (cyan), player control buttons (cyan - primary actions), AuthButton primary variant (cyan)
- Action 11.3.1.2 in progress (fourth batch complete)
2026-01-16 10:57:14 +01:00
senke
af96f59c88
aesthetic-improvements: remove excessive hover effects from high-priority files
...
- Removed scale transforms (hover:scale-[1.02], hover:scale-110, group-hover:scale-110/105) from cards and images
- Removed decorative shadow/glow effects (hover:shadow-neon-cyan/20, hover:shadow-lg) from cards
- Removed hover-lift class (translateY + shadow) from base Card and Button components
- Replaced excessive effects with subtle hover:bg-white/5 or hover:opacity-90
- Preserved functional hover states (group-hover:opacity-100 for play overlays, hover:bg-accent/50 for interactive feedback)
- Updated 14 files: ProductCard, TrackCard, CourseCard, EquipmentCard, PostCard, ProfileView, card.tsx, SearchPage, PlayerControls, OrderSummary, DiscoverView, PlaylistCard, Sidebar, button.tsx
- Effects are now subtle and purposeful, aligning with Surgical Minimalism
- Action 11.4.1.3 complete
2026-01-16 10:34:41 +01:00
senke
fdb080ae00
consistency: fix remaining Tailwind default colors in auth and features components
2026-01-16 01:59:31 +01:00
senke
bb46cedb3d
consistency: auto-migrate Tailwind default colors (Batch 14, 50 instances)
2026-01-16 01:57:08 +01:00
senke
6208283c49
consistency: auto-migrate Tailwind default colors (Batch 13, 110 instances)
2026-01-16 01:57:04 +01:00
senke
c046887bc1
consistency: auto-migrate Tailwind default colors (Batch 12, 62 instances)
2026-01-16 01:57:01 +01:00
senke
b29f659180
consistency: migrate Tailwind default colors to Kodo (Action 9.1.1.3 - batch 2)
...
Migrated high-usage feature components:
- TrackFilters.tsx: Replaced all gray/blue colors with kodo colors (39 instances)
- PlaybackHeatmap.tsx: Replaced heatmap gradient colors with kodo colors (28 instances)
Progress: 132 instances migrated total (1,492 → 1,360 remaining)
Batch 1: 65 instances (Alert, Toast, PasswordStrengthIndicator, GearView)
Batch 2: 67 instances (TrackFilters, PlaybackHeatmap)
2026-01-16 01:18:04 +01:00
senke
511937aee6
ui: use Spinner component in loading states (Action 8.3.1.5 partial)
...
- Replaced Loader2 with Spinner in high-leverage locations:
- LibraryPage (addToPlaylist)
- CommentSection (create comment)
- CommentThread (reply, edit)
- PlaylistForm (submit)
- AddCollaboratorModal
- CollaboratorList (remove)
- PlaylistFollowButton
- PlaylistActions (edit, delete)
- PlaylistBatchActions (share, delete)
- SharePlaylistModal
- AddTrackToPlaylistModal
- ShareLinkManager (create)
- Spinner provides consistent Kodo design system styling
- Remaining Loader2 usages can be migrated incrementally
- Part of Action 8.3.1.5: Use Spinner in loading states
2026-01-16 00:48:39 +01:00
senke
3110dc7789
ui: add loading state to delete comment button (Action 8.3.1.3 partial)
...
- Added isLoading prop to ConfirmationDialog for delete comment
- Uses deleteCommentMutation.isPending to show loading state
- Follows existing pattern for confirmation dialogs
- Part of Action 8.3.1.3: Add loading states to all mutation buttons
- Many buttons already have loading states (verified during implementation)
2026-01-16 00:44:08 +01:00
senke
5d03196171
scalability: update feature API files to use service layer
...
- Updated features/auth/api/authApi.ts to re-export from services/api/auth.ts
- Added deprecation comments to features/tracks/api/trackApi.ts
- Added documentation comments to webhooks, sessions, and admin API files
- All feature API files now document their relationship to the service layer
- Maintains backward compatibility
- No breaking changes
- Action 6.1.1.10 complete
2026-01-15 20:45:59 +01:00
senke
3b2c86132d
scalability: replace direct track API calls with tracksApi service
...
- Replaced imports in UploadModal.tsx (uploadTrack → tracksApi.create)
- Replaced imports in ShareDialog.tsx (createTrackShare → tracksApi.createShare)
- Replaced imports in LibraryPage.tsx (getTracks, batchDeleteTracks, batchUpdateTracks → tracksApi.list, tracksApi.batchDelete, tracksApi.batchUpdate)
- Replaced imports in UserProfilePage.tsx (getTracks → tracksApi.list)
- All function calls updated to use tracksApi methods
- Types re-exported from tracksApi for convenience
- No direct imports from @/features/tracks/api/trackApi remain in feature components
- Test files still use direct imports (acceptable - tests can use implementation details)
- No TypeScript errors related to tracksApi
- Action 6.1.1.2 complete
2026-01-15 20:27:02 +01:00
senke
1ada555f7a
security: disable mutation buttons when rate limited
...
- Created useIsRateLimited() hook to check rate limit state
- Updated CommentSection submit button to disable when rate limited
- Updated LikeButton to disable when rate limited
- Updated PlaylistForm submit button to disable when rate limited
- Updated ChatInput send button to disable when rate limited
- Updated UploadModal upload button to disable when rate limited
- All buttons check isLimited from rate limit store
- Hook uses Zustand selector for efficient re-renders
- Pattern established for future mutation buttons
- Action 5.4.1.4 complete
2026-01-15 20:01:47 +01:00
senke
01ffae2d2a
state-ownership: add optimistic updates to comment and collaborator mutations
...
- Added optimistic updates to comment mutations:
- createCommentMutation: Optimistically adds comment to list
- createReplyMutation: Optimistically adds reply to replies list
- updateCommentMutation: Optimistically updates comment content
- deleteCommentMutation: Optimistically removes comment from list
- Added optimistic updates to collaborator mutations:
- useAddCollaborator: Optimistically adds collaborator to list
- useRemoveCollaborator: Optimistically removes collaborator from list
- useUpdateCollaboratorPermission: Optimistically updates permission
- All mutations include:
- onMutate: Cancel queries, snapshot previous state, apply optimistic update
- onError: Rollback to previous state
- onSuccess: Invalidate queries for consistency
- Action 4.4.1.5 in progress (11/14+ mutations complete: playlists, comments, collaborators)
2026-01-15 19:46:20 +01:00
senke
1ed6e7f07b
state-ownership: delete unused optimisticStoreUpdates.ts file
...
- Deleted apps/web/src/utils/optimisticStoreUpdates.ts (unused file)
- File was unused - no imports found in codebase
- Mutations already use React Query's onMutate pattern
- No TypeScript errors after deletion
- Actions 4.4.1.2 and 4.4.1.3 complete
2026-01-15 19:26:53 +01:00
senke
617cdb95f8
api-contracts: replace Track interface with generated type base
...
- Update Track type in types/api.ts to extend VezaBackendApiInternalModelsTrack
- Update Track type in features/tracks/types/track.ts to extend generated type
- Preserve UI-specific computed fields (coverUrl, plays, likes, etc.)
- Support backward compatibility for duration (number|string)
- All existing imports continue to work without changes
- No Track-specific TypeScript errors introduced
2026-01-15 17:07:50 +01:00
senke
4cc73b0d12
api-contracts: replace ApiError interface with Zod-inferred type
...
- Replace manual ApiError interface with Zod-inferred type from apiSchemas
- Update all imports (15+ files) to use ApiError from @/schemas/apiSchemas
- Remove ApiError interface from types/api.ts
- Update ApiResponse to import ApiError from schemas
- All TypeScript checks pass for ApiError-related code
2026-01-15 17:03:35 +01:00
senke
e4711d684b
state-ownership: replace all useAuthStore().user with useUser() hook
...
- Migrated all hooks: useAuth, useChat, useLogin
- Migrated all components: Header, ProfileForm, FollowButton, LikeButton, PlaylistFollowButton, ChatMessage, ChatMessages, CommentThread, CommentSection, PlaylistList, ChatSidebar, SettingsPage, DashboardPage
- Updated storeSelectors.ts useAuthUser() to use React Query
- All production code now uses useUser() hook instead of Zustand store
- Action 4.1.1.3 and 4.1.1.4 complete
2026-01-14 01:45:42 +01:00
senke
39f7967e1e
incus deployement fully implemented, Makefile updated and make fmt ran
2026-01-13 19:47:57 +01:00
senke
f54003ed9f
state-ownership: audit track queries React Query usage - only comments/likes use React Query
2026-01-11 18:18:15 +01:00
senke
a833aebe17
error-propagation: implement retry for failed mutations (ShareDialog, CommentSection)
2026-01-11 17:38:54 +01:00
senke
95b6f005c3
error-propagation: replace toast.error with ErrorDisplay in ShareDialog and CommentSection
2026-01-11 17:08:04 +01:00
senke
d5bf823037
error-propagation: replace toast.error and inline error with ErrorDisplay in TrackDetailPage
2026-01-11 17:05:23 +01:00
senke
0eca0729b5
feat: Visual masterpiece - true light mode & premium UI
...
🎨 **True Light/Dark Mode**
- Implemented proper light mode with inverted color scheme
- Smooth theme transitions (0.3s ease)
- Light mode colors: white backgrounds, dark text, vibrant accents
- System theme detection with proper class application
🌈 **Enhanced Theme System**
- 4 color themes work in both light and dark modes
- Cyber (cyan/magenta), Ocean (blue/teal), Forest (green/lime), Sunset (orange/purple)
- Theme-specific glassmorphism effects
- Proper contrast in light mode
✨ **Premium Animations**
- Float, glow-pulse, slide-in, scale-in, rotate-in animations
- Smooth page transitions
- Hover effects with depth (lift, glow, scale)
- Micro-interactions on all interactive elements
🎯 **Visual Polish**
- Enhanced glassmorphism for light/dark modes
- Custom scrollbar with theme colors
- Beautiful text selection
- Focus indicators for accessibility
- Premium utility classes
🔧 **Technical Improvements**
- Updated UIStore to properly apply light/dark classes
- Added data-theme attribute for CSS targeting
- Smooth scroll behavior
- Optimized transitions
The app is now a visual masterpiece with perfect light/dark mode support!
2026-01-11 02:32:21 +01:00
senke
7452bd637a
stabilisation commit A
2026-01-07 19:39:21 +01:00
senke
0eacac84b1
chore: resolve property mismatches and type conflicts for snake_case alignment
2026-01-07 11:15:48 +01:00
senke
c1f60e6481
chore: remove production logs in features
2026-01-07 10:32:53 +01:00
senke
f576deff56
[T0-003] fix(frontend): Corriger erreurs TypeScript/React
...
- Variables non utilisées préfixées avec _
- Badge variants corrigés (outline -> default/secondary)
- Types ApiError corrigés (rate_limit supprimé)
- Logger errors corrigés (LogContext au lieu de Error)
- Types PaginatedResponse corrigés (items au lieu de data)
- Types génériques complexes corrigés (stateCleanup, undoRedo)
- Fichiers .example.ts exclus du typecheck
- Status undefined vérifié dans client.ts
Résultats:
- npm run build ✅ (réussit)
- npm run typecheck ✅ (0 erreurs)
- npm run lint ⚠️ (1521 erreurs restantes - style/variables non utilisées)
Files: 35 fichiers modifiés
Hours: 6 estimated, 6 actual
2026-01-04 01:44:20 +01:00
senke
6e8c901976
[FIX] PROD-007: Corriger erreurs TypeScript critiques - imports et exports manquants
2026-01-04 01:44:18 +01:00
senke
f54e5e558f
[INT-CLEANUP-002] Consolidate type definitions in single location
2025-12-26 09:22:05 +01:00
senke
563eb264b6
[INT-AUTH-002] Remove duplicate auth store - migrate to features/auth/store/authStore.ts
2025-12-26 09:11:46 +01:00
senke
2fd5b3935f
[INT-API-004] Add request timeout configuration per endpoint type
2025-12-25 22:42:56 +01:00
senke
38eccdfcaa
[INT-TYPE-004] Create TrackStatus enum aligned with backend
2025-12-25 22:36:20 +01:00
senke
961149d837
[INT-TYPE-002] Standardize Track.id to string everywhere
2025-12-25 22:34:55 +01:00
senke
e4e5d5b80c
[FE-TEST-010] test: Add integration tests for track upload flow
...
- Created comprehensive integration tests for complete track upload flow
- Added 11 tests covering:
- Complete upload flow with valid audio file
- Upload with metadata using trackApi
- Upload progress tracking
- Error handling (validation, network, server, quota errors)
- Async upload with status polling
- Retryable errors
All 11 tests pass. Tests cover end-to-end upload functionality using
trackService and trackApi services.
Phase: PHASE-5
Priority: P2
Progress: 247/267 (92.51%)
2025-12-25 17:36:08 +01:00
senke
71e63cfa4e
[FE-TEST-006] test: Add component tests for track components
...
- Created comprehensive tests for CommentThread component
- Created comprehensive tests for ShareDialog component
All 30 tests pass. These components are used in TrackDetailPage for comments and sharing functionality.
Phase: PHASE-5
Priority: P2
Progress: 243/267 (91.01%)
2025-12-25 17:18:28 +01:00
senke
cfbf005d80
[FE-COMP-019] fix: Correct TypeScript errors in TrackCard keyboard handlers
2025-12-25 12:11:38 +01:00
senke
66258d3bd7
[FE-COMP-019] fe-comp: Add accessibility (a11y) improvements
2025-12-25 12:11:08 +01:00
senke
dbeae31400
[FE-COMP-016] fe-comp: Add track like/unlike button
2025-12-25 12:04:49 +01:00
senke
f45514d6ce
[FE-COMP-012] fix: Remove unused refetchReplies variable
2025-12-25 11:52:13 +01:00
senke
f86e19fe4d
[FE-COMP-012] fe-comp: Add comment system UI
2025-12-25 11:51:52 +01:00
senke
a893e51911
[FE-COMP-003] fe-comp: Add empty states to all list views
...
- Created reusable EmptyState component with icon, title, description, and action support
- Improved empty state in PlaylistList with better messaging and icons
- Improved empty states in UserProfilePage for tracks and playlists tabs
- Added contextual messages based on whether viewing own profile or others
- Added helpful descriptions and icons to all empty states
- Empty states now provide clear guidance on what users can do next
- All list views now have consistent and helpful empty state messaging
2025-12-24 14:33:20 +01:00