+7
-5
src/TrackItem.tsx
+7
-5
src/TrackItem.tsx
···
26
26
}
27
27
}
28
28
`,
29
-
play
29
+
play,
30
30
);
31
31
32
32
return (
33
33
<div className="group py-3 px-4 hover:bg-zinc-900/50 transition-colors">
34
34
<div className="flex items-center gap-4">
35
35
<div className="flex-shrink-0">
36
-
<AlbumArt releaseMbId={data.releaseMbId} alt={`${data.trackName} album art`} />
36
+
<AlbumArt
37
+
releaseMbId={data.releaseMbId}
38
+
alt={`${data.trackName} album art`}
39
+
/>
37
40
</div>
38
41
39
42
<div className="flex-1 min-w-0 grid grid-cols-2 gap-4">
···
52
55
)}
53
56
</h3>
54
57
<p className="text-xs text-zinc-500 truncate">
55
-
{Array.isArray(data.artists)
56
-
? data.artists.map((a) => a.artistName).join(", ")
57
-
: data.artists}
58
+
{data.artists?.map((a) => a?.artistName).join(", ") ||
59
+
"Unknown Artist"}
58
60
</p>
59
61
</div>
60
62