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.
109 lines
2.7 KiB
Svelte
109 lines
2.7 KiB
Svelte
<!-- TRACES: UR-036 | JA-030, JA-031 | DR-041 -->
|
|
<script lang="ts">
|
|
import type { MediaItem, Library } from "$lib/api/types";
|
|
import { auth } from "$lib/stores/auth";
|
|
import { onMount } from "svelte";
|
|
import LibraryGrid from "./LibraryGrid.svelte";
|
|
import CachedImage from "$lib/components/common/CachedImage.svelte";
|
|
import { goto } from "$app/navigation";
|
|
import { createLogger } from "$lib/utils/logger";
|
|
|
|
const log = createLogger("PersonDetailView");
|
|
|
|
interface Props {
|
|
person: MediaItem;
|
|
}
|
|
|
|
let { person }: Props = $props();
|
|
|
|
let movies = $state<MediaItem[]>([]);
|
|
let series = $state<MediaItem[]>([]);
|
|
let loading = $state(true);
|
|
|
|
onMount(async () => {
|
|
await loadFilmography();
|
|
});
|
|
|
|
async function loadFilmography() {
|
|
loading = true;
|
|
try {
|
|
const repo = auth.getRepository();
|
|
const result = await repo.getItemsByPerson(person.id, {
|
|
limit: 100,
|
|
includeItemTypes: ["Movie", "Series"],
|
|
});
|
|
|
|
// Separate movies and series
|
|
movies = result.items.filter((item) => item.kind === "movie");
|
|
series = result.items.filter((item) => item.kind === "series");
|
|
} catch (e) {
|
|
log.error("Failed to load filmography:", e);
|
|
} finally {
|
|
loading = false;
|
|
}
|
|
}
|
|
|
|
function handleItemClick(item: MediaItem | Library) {
|
|
goto(`/library/${item.id}`);
|
|
}
|
|
</script>
|
|
|
|
<div class="space-y-8">
|
|
<!-- Person header -->
|
|
<div class="flex gap-6 pt-4">
|
|
<!-- Profile image -->
|
|
<div class="flex-shrink-0 w-48">
|
|
<CachedImage
|
|
itemId={person.id}
|
|
imageType="Primary"
|
|
tag={person.imageId}
|
|
maxWidth={400}
|
|
alt={person.name}
|
|
class="w-full rounded-lg shadow-lg"
|
|
/>
|
|
</div>
|
|
|
|
<!-- Info -->
|
|
<div class="flex-1 space-y-4">
|
|
<h1 class="text-3xl font-bold text-white">{person.name}</h1>
|
|
|
|
<span class="inline-block px-2 py-1 bg-[var(--color-surface)] rounded text-sm text-gray-400">
|
|
Person
|
|
</span>
|
|
|
|
{#if person.overview}
|
|
<p class="text-gray-300 leading-relaxed max-w-2xl">{person.overview}</p>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Filmography - separated by type -->
|
|
<div class="space-y-8">
|
|
{#if movies.length > 0}
|
|
<LibraryGrid
|
|
title="Movies"
|
|
items={movies}
|
|
{loading}
|
|
showViewToggle={false}
|
|
onItemClick={handleItemClick}
|
|
/>
|
|
{/if}
|
|
|
|
{#if series.length > 0}
|
|
<LibraryGrid
|
|
title="TV Series"
|
|
items={series}
|
|
{loading}
|
|
showViewToggle={false}
|
|
onItemClick={handleItemClick}
|
|
/>
|
|
{/if}
|
|
|
|
{#if !loading && movies.length === 0 && series.length === 0}
|
|
<div class="text-center py-12 text-gray-400">
|
|
<p>No filmography found</p>
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
</div>
|