From 8a9cf9fa1a5664cd6b4fa7d6b8bb0631b7aec5d5 Mon Sep 17 00:00:00 2001
From: Zoe Roux <zoe.roux@zoriya.dev>
Date: Tue, 15 Jul 2025 00:04:54 +0200
Subject: [PATCH] Use poster for movies in entry line

---
 front/src/components/entries/entry-line.tsx | 10 +++++++---
 front/src/components/entries/index.ts       |  2 +-
 front/src/primitives/image-background.tsx   |  2 +-
 3 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/front/src/components/entries/entry-line.tsx b/front/src/components/entries/entry-line.tsx
index b3f569ee..11b2ab98 100644
--- a/front/src/components/entries/entry-line.tsx
+++ b/front/src/components/entries/entry-line.tsx
@@ -29,6 +29,7 @@ export const EntryLine = ({
 	serieSlug,
 	name,
 	thumbnail,
+	poster,
 	description,
 	displayNumber,
 	airDate,
@@ -44,6 +45,7 @@ export const EntryLine = ({
 	name: string | null;
 	description: string | null;
 	thumbnail: KImage | null;
+	poster?: KImage | null;
 	airDate: Date | null;
 	runtime: number | null;
 	watchedPercent: number | null;
@@ -81,12 +83,12 @@ export const EntryLine = ({
 			)}
 		>
 			<ImageBackground
-				src={thumbnail}
+				src={poster ?? thumbnail}
 				quality="low"
 				alt=""
 				layout={{
 					width: percent(18),
-					aspectRatio: 16 / 9,
+					aspectRatio: poster ? 2 / 3 : 16 / 9,
 				}}
 				{...(css({ flexShrink: 0, m: ts(1), borderRadius: 6 }) as any)}
 			>
@@ -105,7 +107,9 @@ export const EntryLine = ({
 				>
 					{/* biome-ignore lint/a11y/useValidAriaValues: simply use H6 for the style but keep a P */}
 					<H6 aria-level={undefined} {...css([{ flexShrink: 1 }, "title"])}>
-						{[displayNumber, name ?? t("show.episodeNoMetadata")].join(" · ")}
+						{[displayNumber, name ?? t("show.episodeNoMetadata")]
+							.filter((x) => x)
+							.join(" · ")}
 					</H6>
 					<View {...css({ flexDirection: "row", alignItems: "center" })}>
 						<SubP>
diff --git a/front/src/components/entries/index.ts b/front/src/components/entries/index.ts
index 9c3073e7..aecb4df4 100644
--- a/front/src/components/entries/index.ts
+++ b/front/src/components/entries/index.ts
@@ -8,7 +8,7 @@ export const entryDisplayNumber = (entry: Entry) => {
 		case "episode":
 			return `S${entry.seasonNumber}:E${entry.episodeNumber}`;
 		case "special":
-			return `SP${entry.number}`
+			return `SP${entry.number}`;
 		case "movie":
 			return "";
 		default:
diff --git a/front/src/primitives/image-background.tsx b/front/src/primitives/image-background.tsx
index 37a23f7a..bc1d4ce0 100644
--- a/front/src/primitives/image-background.tsx
+++ b/front/src/primitives/image-background.tsx
@@ -42,7 +42,7 @@ export const ImageBackground = ({
 			}}
 			placeholder={{ blurhash: src?.blurhash }}
 			accessibilityLabel={alt}
-			{...(css(layout, props) as any)}
+			{...(css([layout, { overflow: "hidden" }], props) as any)}
 		/>
 	);
 };