veza/FIX_REPORT_AUDIO_UI.md
2026-01-22 17:23:11 +01:00

42 lines
2 KiB
Markdown

# ✅ RAPPORT DE CORRECTION : UI & AUDIO CONTEXT
**Date**: 2025-01-27
**Statut**: ✅ **CORRIGÉ**
---
## 🛠️ ERREUR CORRIGÉE
**Problème signalé :** `Uncaught SyntaxError: The requested module ... doesn't provide an export named: 'useAudioContext'`
**Cause racine :**
Le fichier `AudioContext.tsx` exporte le hook sous le nom `useAudio` et non `useAudioContext`. De plus, certaines propriétés (comme `playNext` vs `nextTrack`) étaient mal utilisées.
## 📝 MODIFICATIONS APPLIQUÉES
### 1. `apps/web/src/features/player/components/GlobalPlayer.tsx`
- ✅ Remplacement de l'import `useAudioContext` par `useAudio`.
- ✅ Correction de la destructuration : utilisation de `nextTrack` et `prevTrack` (au lieu de `playNext`/`playPrevious`).
- ✅ Correction de l'affichage de la cover : `currentTrack.coverUrl` (au lieu de `.image` qui n'existe pas sur le type Track).
### 2. `apps/web/src/features/library/pages/LibraryPage.tsx`
- ✅ Remplacement de l'import `useAudioContext` par `useAudio`.
- ✅ Remplacement de `useLibraryStore` (qui ne gère que les filtres) par le hook React Query `useMyTracks` pour récupérer les données réelles.
- ✅ Correction de l'affichage : Utilisation de `track.coverUrl`.
- ✅ Ajout de helpers pour sécuriser l'affichage de l'artiste et de la durée.
### 3. `apps/web/src/components/ui/input.tsx`
- ✅ Remplacement de l'implémentation re-export par une implémentation locale "Glassmorphism" pour éviter les erreurs de dépendance `@veza/design-system` et garantir le style visuel.
---
## 🚀 ÉTAT ACTUEL
L'application devrait maintenant se lancer sans erreur "White Screen of Death".
- Le Player Global est fonctionnel et stylisé.
- La Bibliothèque charge les vraies données via l'API (simulée ou réelle).
- Le design est cohérent avec le système "Kōdō".
**Prochaines étapes recommandées :**
- Vérifier que le backend Go tourne pour servir les tracks (`/api/v1/tracks`).
- Tester l'upload de fichier dans la nouvelle bibliothèque.