feat(web): rework preview page onto tabs + covers + album modal

The standalone /discover/artist/[mbid] preview page was an inconsistent
orphan (no art, no tabs, old inline TRACKS toggle). Rebuild it to mirror the
artist-detail page: category tabs, cover thumbnails, and the album modal for
tracks, with per-release Want. Extract shared categoryOf/TAB_ORDER util.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Jonathan
2026-07-12 17:58:23 +02:00
parent 92d1345503
commit e624d12089
3 changed files with 108 additions and 93 deletions
@@ -4,6 +4,7 @@ import { useEffect, useMemo, useState } from "react";
import { PageHead } from "../../_ui/page-head";
import { CoverArt } from "../../_ui/cover-art";
import { AlbumModal } from "../../_ui/album-modal";
import { categoryOf, TAB_ORDER, type Category } from "../../_ui/categories";
type Release = {
id: string;
@@ -18,19 +19,6 @@ type Release = {
};
type Detail = { id: string; name: string; autoMonitorFuture: boolean; showAllTypes: boolean; releases: Release[] };
type Category = "Albums" | "Singles" | "EPs" | "Live" | "Comps" | "Other";
const TAB_ORDER: Category[] = ["Albums", "Singles", "EPs", "Live", "Comps", "Other"];
function categoryOf(r: Release): Category {
if (r.secondaryTypes.includes("Live")) return "Live";
if (r.secondaryTypes.includes("Compilation")) return "Comps";
if (r.secondaryTypes.length > 0) return "Other";
if (r.primaryType === "Album") return "Albums";
if (r.primaryType === "Single") return "Singles";
if (r.primaryType === "EP") return "EPs";
return "Other";
}
function badge(r: Release): { label: string; cls: string } {
if (r.currentQualityClass !== null) return { label: `Have q${r.currentQualityClass}`, cls: "chip done" };
if (r.monitored) return { label: r.state === "wanted" ? "Wanted" : r.state, cls: "chip working" };