Use posters instead of thumbnails when no thumbnails exist

front/packages/models/src/resources/movie.ts

@@ -25,7 +25,8 @@ import { Genre } from "./genre";
 import { StudioP } from "./studio";
 import { Status } from "./show";
 
-export const MovieP = ResourceP.merge(ImagesP).extend({
+export const MovieP = ResourceP.merge(ImagesP)
+	.extend({
 		/**
 		 * The title of this movie.
 		 */
@@ -47,8 +48,7 @@ export const MovieP = ResourceP.merge(ImagesP).extend({
 		 */
 		tags: z.array(z.string()),
 		/**
-	/**
-	 * Is this movie not aired yet or finished?
+		 * /** Is this movie not aired yet or finished?
 		 */
 		status: z.nativeEnum(Status),
 		/**
@@ -82,6 +82,16 @@ export const MovieP = ResourceP.merge(ImagesP).extend({
 			 */
 			hls: z.string().transform(imageFn),
 		}),
+	})
+	.transform((x) => {
+		if (!x.thumbnail && x.poster) {
+			x.thumbnail = { ...x.poster };
+			if (x.thumbnail) {
+				x.thumbnail.low = x.thumbnail.high;
+				x.thumbnail.medium = x.thumbnail.high;
+			}
+		}
+		return x;
 	});
 
 /**

front/packages/models/src/resources/show.ts

@@ -35,7 +35,8 @@ export enum Status {
 	Planned = "Planned",
 }
 
-export const ShowP = ResourceP.merge(ImagesP).extend({
+export const ShowP = ResourceP.merge(ImagesP)
+	.extend({
 		/**
 		 * The title of this show.
 		 */
@@ -84,6 +85,16 @@ export const ShowP = ResourceP.merge(ImagesP).extend({
 		 * The list of seasons of this show.
 		 */
 		seasons: z.array(SeasonP).optional(),
+	})
+	.transform((x) => {
+		if (!x.thumbnail && x.poster) {
+			x.thumbnail = { ...x.poster };
+			if (x.thumbnail) {
+				x.thumbnail.low = x.thumbnail.high;
+				x.thumbnail.medium = x.thumbnail.high;
+			}
+		}
+		return x;
 	});
 
 /**

front/packages/ui/src/browse/list.tsx

@@ -46,7 +46,7 @@ export const ItemList = ({
 		<ImageBackground
 			src={thumbnail}
 			alt={name}
-			quality="low"
+			quality="medium"
 			as={Link}
 			href={href ?? ""}
 			onFocus={() => setHovered((i) => i + 1)}