Turn PayloadImage into EndpointImage

package-lock.json

@@ -35,7 +35,7 @@
         "prettier": "3.2.5",
         "ts-node": "10.9.2",
         "ts-unused-exports": "10.0.1",
-        "typescript": "5.4.4"
+        "typescript": "5.4.5"
       }
     },
     "node_modules/@aws-crypto/crc32": {
@@ -15922,9 +15922,9 @@
       }
     },
     "node_modules/typescript": {
-      "version": "5.4.4",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.4.tgz",
-      "integrity": "sha512-dGE2Vv8cpVvw28v8HCPqyb08EzbBURxDpuhJvTrusShUfGnhHBafDsLdS1EhhxyL6BJQE+2cT3dDPAv+MQ6oLw==",
+      "version": "5.4.5",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.5.tgz",
+      "integrity": "sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==",
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"

package.json

@@ -48,6 +48,6 @@
     "prettier": "3.2.5",
     "ts-node": "10.9.2",
     "ts-unused-exports": "10.0.1",
-    "typescript": "5.4.4"
+    "typescript": "5.4.5"
   }
 }

src/collections/Collectibles/Collectibles.ts

@@ -128,7 +128,8 @@ export const Collectibles = buildVersionedCollectionConfig({
       "A physical or digital item. This can be a book, a CD/DVD, a video game copy...\
      any product related to our Scope.\
      This can also include merchandises such as figurines, music boxes, posters, key chains...",
-    preview: ({ slug }) => `${process.env.PAYLOAD_PUBLIC_FRONTEND_BASE_URL}/en/collectibles/${slug}`,
+    preview: ({ slug }) =>
+      `${process.env.PAYLOAD_PUBLIC_FRONTEND_BASE_URL}/en/collectibles/${slug}`,
     hooks: {
       beforeDuplicate: beforeDuplicatePiping([
         beforeDuplicateUnpublish,

src/collections/Collectibles/endpoints/getBySlugEndpoint.ts

@@ -1,6 +1,6 @@
 import { CollectibleNature, Collections } from "../../../constants";
 import { createGetByEndpoint } from "../../../endpoints/createGetByEndpoint";
-import { EndpointCollectible, PayloadImage } from "../../../sdk";
+import { EndpointCollectible } from "../../../sdk";
 import { Collectible } from "../../../types/collections";
 import {
   isDefined,
@@ -17,6 +17,7 @@ import {
   getDomainFromUrl,
 } from "../../../utils/endpoints";
 import { convertAudioToEndpointAudio } from "../../Audios/endpoints/getByID";
+import { convertImageToEndpointImage } from "../../Images/endpoints/getByID";
 import { convertPageToEndpointPage } from "../../Pages/endpoints/getBySlugEndpoint";
 import { convertVideoToEndpointVideo } from "../../Videos/endpoints/getByID";
 
@@ -55,7 +56,10 @@ export const convertCollectibleToEndpointCollectible = ({
   slug,
   languages: languages?.map((language) => (isPayloadType(language) ? language.id : language)) ?? [],
   ...(isDefined(releaseDate) ? { releaseDate } : {}),
-  ...(isValidPayloadImage(thumbnail) ? { thumbnail } : {}),
+  ...(isValidPayloadImage(thumbnail) ? { thumbnail: convertImageToEndpointImage(thumbnail) } : {}),
+  ...(isValidPayloadImage(backgroundImage)
+    ? { backgroundImage: convertImageToEndpointImage(backgroundImage) }
+    : {}),
   tagGroups: convertTagsEndpointTagsGroups(tags),
   translations:
     translations?.map(({ language, title, description, pretitle, subtitle }) => ({
@@ -65,7 +69,6 @@ export const convertCollectibleToEndpointCollectible = ({
       ...(isNotEmpty(subtitle) ? { subtitle } : {}),
       ...(isNotEmpty(description) ? { description } : {}),
     })) ?? [],
-  ...(isValidPayloadImage(backgroundImage) ? { backgroundImage } : {}),
   contents: handleContents(contents),
   gallery: handleGallery(gallery),
   scans: handleScans(scans),
@@ -119,42 +122,34 @@ const handlePageInfo = (
   };
 };
 
-const handleGallery = (gallery: Collectible["gallery"]): EndpointCollectible["gallery"] => {
-  const result: PayloadImage[] = [];
-  if (!gallery) return result;
-
-  gallery?.forEach(({ image }) => {
-    if (isValidPayloadImage(image)) {
-      result.push(image);
-    }
-  });
-
-  return result.slice(0, 10);
-};
+const handleGallery = (gallery: Collectible["gallery"]): EndpointCollectible["gallery"] =>
+  gallery
+    ?.flatMap(({ image }) => {
+      if (!isValidPayloadImage(image)) return [];
+      return convertImageToEndpointImage(image);
+    })
+    .slice(0, 10) ?? [];
 
 const handleScans = (scans: Collectible["scans"]): EndpointCollectible["scans"] => {
-  const result: PayloadImage[] = [];
-  if (!scans) return result;
+  const result =
+    scans?.pages?.flatMap(({ image }) => {
+      if (!isValidPayloadImage(image)) return [];
+      return image;
+    }) ?? [];
 
-  scans.pages?.forEach(({ image }) => {
-    if (isValidPayloadImage(image)) {
-      result.push(image);
-    }
-  });
-
-  if (isValidPayloadImage(scans.cover?.front)) {
+  if (isValidPayloadImage(scans?.cover?.front)) {
     result.push(scans.cover.front);
   }
 
-  if (isValidPayloadImage(scans.cover?.back)) {
+  if (isValidPayloadImage(scans?.cover?.back)) {
     result.push(scans.cover.back);
   }
 
-  if (isValidPayloadImage(scans.dustjacket?.front)) {
+  if (isValidPayloadImage(scans?.dustjacket?.front)) {
     result.push(scans.dustjacket.front);
   }
 
-  if (isValidPayloadImage(scans.dustjacket?.back)) {
+  if (isValidPayloadImage(scans?.dustjacket?.back)) {
     result.push(scans.dustjacket.back);
   }
 

src/collections/Pages/endpoints/getBySlugEndpoint.ts

@@ -16,6 +16,7 @@ import {
   convertSourceToEndpointSource,
   convertTagsEndpointTagsGroups,
 } from "../../../utils/endpoints";
+import { convertImageToEndpointImage } from "../../Images/endpoints/getByID";
 
 export const getBySlugEndpoint = createGetByEndpoint({
   collection: Collections.Pages,
@@ -33,9 +34,11 @@ export const convertPageToEndpointPage = ({
   thumbnail,
 }: Page): EndpointPage => ({
   slug,
-  ...(isValidPayloadImage(thumbnail) ? { thumbnail } : {}),
+  ...(isValidPayloadImage(thumbnail) ? { thumbnail: convertImageToEndpointImage(thumbnail) } : {}),
+  ...(isValidPayloadImage(backgroundImage)
+    ? { backgroundImage: convertImageToEndpointImage(backgroundImage) }
+    : {}),
   tagGroups: convertTagsEndpointTagsGroups(tags),
-  ...(isValidPayloadImage(backgroundImage) ? { backgroundImage } : {}),
   translations: translations.map(
     ({ content, language, sourceLanguage, title, pretitle, subtitle, summary, credits }) => ({
       language: isPayloadType(language) ? language.id : language,

src/collections/Recorders/endpoints/getAllEndpoint.ts

@@ -3,6 +3,7 @@ import { Collections } from "../../../constants";
 import { EndpointRecorder } from "../../../sdk";
 import { CollectionEndpoint } from "../../../types/payload";
 import { isPayloadArrayType, isValidPayloadImage } from "../../../utils/asserts";
+import { convertImageToEndpointImage } from "../../Images/endpoints/getByID";
 
 export const getAllEndpoint: CollectionEndpoint = {
   method: "get",
@@ -30,7 +31,7 @@ export const getAllEndpoint: CollectionEndpoint = {
       ({ anonymize, id, username, avatar, languages }) => ({
         id,
         username: anonymize ? `Recorder#${id.substring(0, 5)}` : username,
-        ...(isValidPayloadImage(avatar) ? { avatar } : {}),
+        ...(isValidPayloadImage(avatar) ? { avatar: convertImageToEndpointImage(avatar) } : {}),
         languages: isPayloadArrayType(languages) ? languages.map(({ id }) => id) : [],
       })
     );

src/collections/Recorders/endpoints/getByUsername.ts

@@ -3,6 +3,7 @@ import { createGetByEndpoint } from "../../../endpoints/createGetByEndpoint";
 import { EndpointRecorder } from "../../../sdk";
 import { Recorder } from "../../../types/collections";
 import { isPayloadType, isValidPayloadImage } from "../../../utils/asserts";
+import { convertImageToEndpointImage } from "../../Images/endpoints/getByID";
 
 export const getByUsernameEndpoint = createGetByEndpoint({
   collection: Collections.Recorders,
@@ -20,5 +21,5 @@ export const convertRecorderToEndpointRecorder = ({
   id,
   languages: languages?.map((language) => (isPayloadType(language) ? language.id : language)) ?? [],
   username: anonymize ? `Recorder#${id.substring(0, 5)}` : username,
-  ...(isValidPayloadImage(avatar) ? { avatar } : {}),
+  ...(isValidPayloadImage(avatar) ? { avatar: convertImageToEndpointImage(avatar) } : {}),
 });

src/collections/WebsiteConfig/endpoints/getConfigEndpoint.ts

@@ -4,6 +4,7 @@ import { EndpointWebsiteConfig } from "../../../sdk";
 import { CollectionEndpoint } from "../../../types/payload";
 import { isPayloadType, isValidPayloadImage } from "../../../utils/asserts";
 import { convertFolderToEndpointFolder } from "../../Folders/endpoints/getBySlugEndpoint";
+import { convertImageToEndpointImage } from "../../Images/endpoints/getByID";
 
 export const getConfigEndpoint: CollectionEndpoint = {
   method: "get",
@@ -47,8 +48,12 @@ export const getConfigEndpoint: CollectionEndpoint = {
           if (!isPayloadType(folder)) return [];
           return {
             ...convertFolderToEndpointFolder(folder),
-            ...(isValidPayloadImage(darkThumbnail) ? { darkThumbnail } : {}),
-            ...(isValidPayloadImage(lightThumbnail) ? { lightThumbnail } : {}),
+            ...(isValidPayloadImage(darkThumbnail)
+              ? { darkThumbnail: convertImageToEndpointImage(darkThumbnail) }
+              : {}),
+            ...(isValidPayloadImage(lightThumbnail)
+              ? { lightThumbnail: convertImageToEndpointImage(lightThumbnail) }
+              : {}),
           };
         }) ?? [],
       timeline: {

src/sdk.ts

@@ -139,8 +139,8 @@ export type EndpointFolder = {
 
 export type EndpointWebsiteConfig = {
   homeFolders: (EndpointFolder & {
-    lightThumbnail?: PayloadImage;
-    darkThumbnail?: PayloadImage;
+    lightThumbnail?: EndpointImage;
+    darkThumbnail?: EndpointImage;
   })[];
   timeline: {
     breaks: number[];
@@ -156,7 +156,7 @@ export type EndpointWebsiteConfig = {
 export type EndpointRecorder = {
   id: string;
   username: string;
-  avatar?: PayloadImage;
+  avatar?: EndpointImage;
   languages: string[];
 };
 
@@ -201,9 +201,9 @@ export type EndpointCredit = {
 
 export type EndpointPage = {
   slug: string;
-  thumbnail?: PayloadImage;
+  thumbnail?: EndpointImage;
   tagGroups: EndpointTagsGroup[];
-  backgroundImage?: PayloadImage;
+  backgroundImage?: EndpointImage;
   translations: {
     language: string;
     pretitle?: string;
@@ -220,7 +220,7 @@ export type EndpointPage = {
 
 export type EndpointCollectible = {
   slug: string;
-  thumbnail?: PayloadImage;
+  thumbnail?: EndpointImage;
   translations: {
     language: string;
     pretitle?: string;
@@ -231,9 +231,9 @@ export type EndpointCollectible = {
   tagGroups: EndpointTagsGroup[];
   releaseDate?: string;
   languages: string[];
-  backgroundImage?: PayloadImage;
+  backgroundImage?: EndpointImage;
   nature: CollectibleNature;
-  gallery: PayloadImage[];
+  gallery: EndpointImage[];
   scans: PayloadImage[];
   urls: { url: string; label: string }[];
   price?: {

src/utils/asserts.ts

@@ -1,5 +1,6 @@
 import { RichTextContent, isNodeParagraphNode } from "../constants";
 import { PayloadImage, PayloadMedia } from "../sdk";
+import { Image } from "../types/collections";
 
 export const isDefined = <T>(value: T | null | undefined): value is T =>
   value !== null && value !== undefined;
@@ -24,38 +25,18 @@ const isEmptyRichText = (value: RichTextContent) =>
 export const hasDuplicates = <T>(list: T[]): boolean => list.length !== new Set(list).size;
 
 export const isValidPayloadImage = (
-  image:
-    | {
-        filename?: string | null;
-        filesize?: number | null;
-        mimeType?: string | null;
-        width?: number | null;
-        height?: number | null;
-        url?: string | null;
-      }
-    | undefined
-    | null
-    | string
-): image is PayloadImage => {
-  if (isUndefined(image)) return false;
+  image: string | Image | null | undefined
+): image is Image & PayloadImage => {
   if (typeof image === "string") return false;
-  if (isEmpty(image.filename)) return false;
-  if (isEmpty(image.url)) return false;
-  if (isEmpty(image.mimeType)) return false;
+  if (!isValidPayloadMedia(image)) return false;
   if (isUndefined(image.width)) return false;
   if (isUndefined(image.height)) return false;
-  if (isUndefined(image.filesize)) return false;
   return true;
 };
 
 export const isValidPayloadMedia = (
   media:
-    | {
-        filename?: string | null;
-        filesize?: number | null;
-        mimeType?: string | null;
-        url?: string | null;
-      }
+    | Partial<{ [K in keyof PayloadMedia]: null | undefined | PayloadMedia[K] }>
     | undefined
     | null
     | string