animations + cards

app/store/data.ts

@@ -13,17 +13,24 @@ export const useDataStore = defineStore('data', {
 
   actions: {
     async loadData() {
-      if (this.isLoaded) return  // Avoid re-fetching if already loaded
+      if (this.isLoaded) return
 
-      // Fetch your data once (e.g., from an API or local JSON)
-      const { data: compilations } = await useFetch('/api/compilations')
-      const { data: artists } = await useFetch('/api/artists')
-      const { data: tracks } = await useFetch('/api/tracks')
+      const { data: compilations } = await useFetch<Compilation[]>('/api/compilations')
+      const { data: artists } = await useFetch<Artist[]>('/api/artists')
+      const { data: rawTracks } = await useFetch<{ id: number, compilationId: string, title: string, artist: number, start: number, url: string, coverId: string }[]>('/api/tracks')
+
+      // Stocker les données de base
+      this.compilations = compilations.value ?? []
+      this.artists = artists.value ?? []
+
+      // Mapper les tracks pour remplacer l'artistId par l'objet Artist
+      const artistMap = new Map(this.artists.map(a => [a.id, a]))
+
+      this.tracks = (rawTracks.value ?? []).map(track => ({
+        ...track,
+        artist: artistMap.get(track.artist) ?? { id: track.artist, name: 'Unknown', url: '', coverId: '' }
+      }))
 
-      // Set the data in the store
-      this.compilations = compilations.value
-      this.artists = artists.value
-      this.tracks = tracks.value
       this.isLoaded = true
     }
   },
@@ -44,8 +51,8 @@ export const useDataStore = defineStore('data', {
     getArtistById: (state) => (id: number) => state.artists.find(artist => artist.id === id),
 
     // Obtenir toutes les pistes d'un artiste donné
-    getTracksByArtistId: (state) => (artistId: string) => {
-      return state.tracks.filter(track => track.artistId === artistId)
+    getTracksByArtistId: (state) => (artistId: number) => {
+      return state.tracks.filter(track => track.artist.id === artistId)
     },
   },
 })