43 lines
2 KiB
Markdown
43 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.
|