dtourolle
ad48d89dfe
Formatting was configured but never enforced: `bun run format:check` reported 199 unformatted files and ran in no workflow and in no git hook, so .prettierrc (printWidth 100, trailing commas) described an intention rather than the tree. This is the one-time sweep that makes the check gateable. Whitespace and token-reflow only -- no behavioural change: `bun run check` reports 0 errors and all 1053 frontend tests pass before and after. Kept out of every other commit on purpose. A 199-file diff mixed with real changes is unreviewable, and the next commit turns format:check into a hard CI gate so this cannot silently accumulate again.
53 lines
1.7 KiB
Svelte
53 lines
1.7 KiB
Svelte
<script lang="ts">
|
|
import { goto } from "$app/navigation";
|
|
import type { ArtistItem } from "$lib/api/types";
|
|
|
|
/**
|
|
* Renders a comma-separated list of artist names. When the artists carry
|
|
* ids (artistItems) each name links to that artist's detail page; otherwise
|
|
* it falls back to plain text from the names-only `artists` array.
|
|
*
|
|
* Consolidates the artist-linking markup used on the player and detail
|
|
* screens so every surface behaves the same way.
|
|
*/
|
|
interface Props {
|
|
artistItems?: ArtistItem[] | null;
|
|
artists?: string[] | null;
|
|
/** Tailwind classes for the link colour/state. */
|
|
linkClass?: string;
|
|
/** Tailwind classes for the non-linkable fallback text. */
|
|
textClass?: string;
|
|
/** Called before navigating (e.g. to close a full-screen player). */
|
|
onNavigate?: () => void;
|
|
}
|
|
|
|
let {
|
|
artistItems = null,
|
|
artists = null,
|
|
linkClass = "text-[var(--color-jellyfin)] hover:underline",
|
|
textClass = "text-gray-400",
|
|
onNavigate,
|
|
}: Props = $props();
|
|
|
|
const linkable = $derived((artistItems ?? []).filter((a) => a.id && a.id.trim() !== ""));
|
|
|
|
function handleClick(artistId: string, e: MouseEvent) {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
onNavigate?.();
|
|
goto(`/library/${artistId}`);
|
|
}
|
|
</script>
|
|
|
|
{#if linkable.length > 0}
|
|
<span class="inline-flex flex-wrap items-baseline gap-1">
|
|
{#each linkable as artist, i (artist.id)}
|
|
<button onclick={(e) => handleClick(artist.id, e)} class={linkClass}>
|
|
{artist.name}
|
|
</button>{#if i < linkable.length - 1}<span class={textClass}>,</span>{/if}
|
|
{/each}
|
|
</span>
|
|
{:else if artists && artists.length > 0}
|
|
<span class={textClass}>{artists.join(", ")}</span>
|
|
{/if}
|