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