Reduced data sent by endpoint by 99 percents

2024-06-15 12:49:06 +02:00 · 2024-06-15 12:49:06 +02:00 · abd7d3680b
parent 42b76b2dff
commit abd7d3680b
9 changed files with 328 additions and 195 deletions
--- a/src/collections/ChronologyEvents/endpoints/getAllEndpoint.ts
+++ b/src/collections/ChronologyEvents/endpoints/getAllEndpoint.ts
@ -5,8 +5,8 @@ import { ChronologyEvent, CollectibleBlock } from "../../../types/collections";
 import { CollectionEndpoint } from "../../../types/payload";
 import { isDefined, isNotEmpty, isPayloadType } from "../../../utils/asserts";
 import { convertCreditsToEndpointCredits, getDomainFromUrl } from "../../../utils/endpoints";
-import { convertCollectibleToEndpointCollectible } from "../../Collectibles/endpoints/getBySlugEndpoint";
-import { convertPageToEndpointPage } from "../../Pages/endpoints/getBySlugEndpoint";
+import { convertCollectibleToEndpointCollectiblePreview } from "../../Collectibles/endpoints/getBySlugEndpoint";
+import { convertPageToEndpointPagePreview } from "../../Pages/endpoints/getBySlugEndpoint";

 export const getAllEndpoint: CollectionEndpoint = {
  method: "get",
@ -89,7 +89,7 @@ const handleSources = (sources: ChronologyEvent["events"][number]["sources"]): E
          if (!isPayloadType(source.collectible)) return [];
          return {
            type: "collectible",
-            collectible: convertCollectibleToEndpointCollectible(source.collectible),
+            collectible: convertCollectibleToEndpointCollectiblePreview(source.collectible),
            ...(isDefined(range) ? { range } : {}),
          };

@ -97,7 +97,7 @@ const handleSources = (sources: ChronologyEvent["events"][number]["sources"]): E
          if (!isPayloadType(source.page)) return [];
          return {
            type: "page",
-            page: convertPageToEndpointPage(source.page),
+            page: convertPageToEndpointPagePreview(source.page),
          };

        case "urlBlock":
--- a/src/collections/Collectibles/endpoints/getBySlugEndpoint.ts
+++ b/src/collections/Collectibles/endpoints/getBySlugEndpoint.ts
@ -1,6 +1,6 @@
 import { CollectibleNature, Collections } from "../../../constants";
 import { createGetByEndpoint } from "../../../endpoints/createGetByEndpoint";
-import { EndpointCollectible } from "../../../sdk";
+import { EndpointCollectible, EndpointCollectiblePreview } from "../../../sdk";
 import { Collectible } from "../../../types/collections";
 import {
  isAudio,
@ -21,8 +21,8 @@ import {
 } from "../../../utils/endpoints";
 import { convertAudioToEndpointAudio } from "../../Audios/endpoints/getByID";
 import { convertImageToEndpointImage } from "../../Images/endpoints/getByID";
-import { convertPageToEndpointPage } from "../../Pages/endpoints/getBySlugEndpoint";
-import { convertRecorderToEndpointRecorder } from "../../Recorders/endpoints/getByID";
+import { convertPageToEndpointPagePreview } from "../../Pages/endpoints/getBySlugEndpoint";
+import { convertRecorderToEndpointRecorderPreview } from "../../Recorders/endpoints/getByID";
 import { convertVideoToEndpointVideo } from "../../Videos/endpoints/getByID";

 export const getBySlugEndpoint = createGetByEndpoint({
@ -32,48 +32,63 @@ export const getBySlugEndpoint = createGetByEndpoint({
  handler: (collectible) => convertCollectibleToEndpointCollectible(collectible),
 });

-export const convertCollectibleToEndpointCollectible = ({
-  nature,
-  urls,
-  subitems,
-  gallery: rawGallery,
-  contents,
+export const convertCollectibleToEndpointCollectiblePreview = ({
+  id,
  priceEnabled,
  price,
-  size,
-  sizeEnabled,
-  weight,
-  weightEnabled,
-  pageInfo,
-  pageInfoEnabled,
-  parentItems,
-  folders,
-  backgroundImage,
  slug,
  thumbnail,
  translations,
  releaseDate,
  languages,
-  scans: rawScans,
  attributes,
-  createdAt,
-  updatedAt,
-  scansEnabled,
-  updatedBy,
-}: Collectible): EndpointCollectible => {
+}: Collectible): EndpointCollectiblePreview => ({
+  id,
+  slug,
+  ...(isImage(thumbnail) ? { thumbnail: convertImageToEndpointImage(thumbnail) } : {}),
+  translations:
+    translations?.map(({ language, title, pretitle, subtitle }) => ({
+      language: isPayloadType(language) ? language.id : language,
+      title,
+      ...(isNotEmpty(pretitle) ? { pretitle } : {}),
+      ...(isNotEmpty(subtitle) ? { subtitle } : {}),
+    })) ?? [],
+  attributes: convertAttributesToEndpointAttributes(attributes),
+  ...(isDefined(releaseDate) ? { releaseDate } : {}),
+  languages: languages?.map((language) => (isPayloadType(language) ? language.id : language)) ?? [],
+  ...handlePrice(price, priceEnabled),
+});
+
+const convertCollectibleToEndpointCollectible = (collectible: Collectible): EndpointCollectible => {
+  const {
+    nature,
+    urls,
+    subitems,
+    gallery: rawGallery,
+    contents,
+    priceEnabled,
+    price,
+    size,
+    sizeEnabled,
+    weight,
+    weightEnabled,
+    pageInfo,
+    pageInfoEnabled,
+    parentItems,
+    folders,
+    backgroundImage,
+    translations,
+    scans: rawScans,
+    createdAt,
+    updatedAt,
+    scansEnabled,
+    updatedBy,
+  } = collectible;
  const gallery = handleGallery(rawGallery);
  const scans = scansEnabled ? handleScans(rawScans) : undefined;

  return {
-    slug,
-    languages:
-      languages?.map((language) => (isPayloadType(language) ? language.id : language)) ?? [],
-    ...(isDefined(releaseDate) ? { releaseDate } : {}),
-    ...(isImage(thumbnail) ? { thumbnail: convertImageToEndpointImage(thumbnail) } : {}),
-    ...(isImage(backgroundImage)
-      ? { backgroundImage: convertImageToEndpointImage(backgroundImage) }
-      : {}),
-    attributes: convertAttributesToEndpointAttributes(attributes),
+    ...convertCollectibleToEndpointCollectiblePreview(collectible),
    translations:
      translations?.map(({ language, title, description, pretitle, subtitle }) => ({
        language: isPayloadType(language) ? language.id : language,
@ -82,22 +97,25 @@ export const convertCollectibleToEndpointCollectible = ({
        ...(isNotEmpty(subtitle) ? { subtitle } : {}),
        ...(isNotEmpty(description) ? { description } : {}),
      })) ?? [],
-    contents: handleContents(contents),
+    ...(isImage(backgroundImage)
+      ? { backgroundImage: convertImageToEndpointImage(backgroundImage) }
+      : {}),
+    nature: nature === "Physical" ? CollectibleNature.Physical : CollectibleNature.Digital,
    ...(gallery ? { gallery } : {}),
    ...(scans ? { scans } : {}),
-    nature: nature === "Physical" ? CollectibleNature.Physical : CollectibleNature.Digital,
-    subitems: isPayloadArrayType(subitems)
-      ? subitems.filter(isPublished).map(convertCollectibleToEndpointCollectible)
-      : [],
    urls: urls?.map(({ url }) => ({ url, label: getDomainFromUrl(url) })) ?? [],
-    ...(weightEnabled && isDefined(weight) ? { weight: weight.amount } : {}),
    ...handleSize(size, sizeEnabled),
+    ...(weightEnabled && isDefined(weight) ? { weight: weight.amount } : {}),
    ...handlePageInfo(pageInfo, pageInfoEnabled),
+    subitems: isPayloadArrayType(subitems)
+      ? subitems.filter(isPublished).map(convertCollectibleToEndpointCollectiblePreview)
+      : [],
+    contents: handleContents(contents),
    ...handlePrice(price, priceEnabled),
    createdAt,
    updatedAt,
    ...(isPayloadType(updatedBy)
-      ? { updatedBy: convertRecorderToEndpointRecorder(updatedBy) }
+      ? { updatedBy: convertRecorderToEndpointRecorderPreview(updatedBy) }
      : {}),
    parentPages: convertSourceToEndpointSource({ collectibles: parentItems, folders }),
  };
@ -172,7 +190,7 @@ const handleScans = (scans: Collectible["scans"]): EndpointCollectible["scans"]

  const thumbnail = result?.[0];
  if (!thumbnail) return;
-  
+
  return {
    count: totalCount,
    thumbnail: convertScanToEndpointScanImage(thumbnail.image, thumbnail.index),
@ -230,7 +248,10 @@ const handleContents = (contents: Collectible["contents"]): EndpointCollectible[

        case Collections.Pages:
          return isPayloadType(content.value) && isPublished(content.value)
-            ? { relationTo: Collections.Pages, value: convertPageToEndpointPage(content.value) }
+            ? {
+                relationTo: Collections.Pages,
+                value: convertPageToEndpointPagePreview(content.value),
+              }
            : undefined;

        case Collections.Audios:
--- a/src/collections/Folders/endpoints/getBySlugEndpoint.ts
+++ b/src/collections/Folders/endpoints/getBySlugEndpoint.ts
@ -1,6 +1,6 @@
 import { Collections } from "../../../constants";
 import { createGetByEndpoint } from "../../../endpoints/createGetByEndpoint";
-import { EndpointFolder } from "../../../sdk";
+import { EndpointFolder, EndpointFolderPreview } from "../../../sdk";
 import { Folder, Language } from "../../../types/collections";
 import {
  isAudio,
@ -13,9 +13,9 @@ import {
 } from "../../../utils/asserts";
 import { convertSourceToEndpointSource, getLanguageId } from "../../../utils/endpoints";
 import { convertAudioToEndpointAudio } from "../../Audios/endpoints/getByID";
-import { convertCollectibleToEndpointCollectible } from "../../Collectibles/endpoints/getBySlugEndpoint";
+import { convertCollectibleToEndpointCollectiblePreview } from "../../Collectibles/endpoints/getBySlugEndpoint";
 import { convertImageToEndpointImage } from "../../Images/endpoints/getByID";
-import { convertPageToEndpointPage } from "../../Pages/endpoints/getBySlugEndpoint";
+import { convertPageToEndpointPagePreview } from "../../Pages/endpoints/getBySlugEndpoint";
 import { convertVideoToEndpointVideo } from "../../Videos/endpoints/getByID";

 export const getBySlugEndpoint = createGetByEndpoint({
@ -25,72 +25,88 @@ export const getBySlugEndpoint = createGetByEndpoint({
  handler: (folder) => convertFolderToEndpointFolder(folder),
 });

-export const convertFolderToEndpointFolder = ({
+export const convertFolderToEndpointFolderPreview = ({
+  id,
  slug,
  icon,
  translations,
-  sections,
-  files,
-  parentFolders,
-}: Folder): EndpointFolder => ({
+}: Folder): EndpointFolderPreview => ({
+  id,
  slug,
  ...(isDefined(icon) ? { icon } : {}),
  translations:
-    translations?.map(({ language, name, description }) => ({
+    translations?.map(({ language, name }) => ({
      language: getLanguageId(language),
-      name,
-      ...(isNotEmpty(description) ? { description } : {}),
+      title: name,
    })) ?? [],
-  sections:
-    sections?.length === 1
-      ? {
-          type: "single",
-          subfolders:
-            sections[0]?.subfolders?.filter(isPayloadType).map(convertFolderToEndpointFolder) ?? [],
-        }
-      : {
-          type: "multiple",
-          sections:
-            sections?.filter(isValidSection).map(({ translations, subfolders }) => ({
-              translations: translations.map(({ language, name }) => ({
-                language: getLanguageId(language),
-                name,
-              })),
-              subfolders: subfolders.map(convertFolderToEndpointFolder),
-            })) ?? [],
-        },
-  files:
-    files?.flatMap<EndpointFolder["files"][number]>(({ relationTo, value }) => {
-      if (!isPayloadType(value) || ("_status" in value && !isPublished(value))) {
-        return [];
-      }
-
-      switch (relationTo) {
-        case Collections.Collectibles:
-          return [
-            {
-              relationTo: Collections.Collectibles,
-              value: convertCollectibleToEndpointCollectible(value),
-            },
-          ];
-        case Collections.Pages:
-          return [{ relationTo: Collections.Pages, value: convertPageToEndpointPage(value) }];
-        case Collections.Images:
-          if (!isImage(value)) return [];
-          return [{ relationTo: Collections.Images, value: convertImageToEndpointImage(value) }];
-        case Collections.Audios:
-          if (!isAudio(value)) return [];
-          return [{ relationTo: Collections.Audios, value: convertAudioToEndpointAudio(value) }];
-        case Collections.Videos:
-          if (!isVideo(value)) return [];
-          return [{ relationTo: Collections.Videos, value: convertVideoToEndpointVideo(value) }];
-        default:
-          return [];
-      }
-    }) ?? [],
-  parentPages: convertSourceToEndpointSource({ folders: parentFolders }),
 });

+const convertFolderToEndpointFolder = (folder: Folder): EndpointFolder => {
+  const { translations, sections, files, parentFolders } = folder;
+
+  return {
+    ...convertFolderToEndpointFolderPreview(folder),
+    translations:
+      translations?.map(({ language, name, description }) => ({
+        language: getLanguageId(language),
+        title: name,
+        ...(isNotEmpty(description) ? { description } : {}),
+      })) ?? [],
+    sections:
+      sections?.length === 1
+        ? {
+            type: "single",
+            subfolders:
+              sections[0]?.subfolders
+                ?.filter(isPayloadType)
+                .map(convertFolderToEndpointFolderPreview) ?? [],
+          }
+        : {
+            type: "multiple",
+            sections:
+              sections?.filter(isValidSection).map(({ translations, subfolders }) => ({
+                translations: translations.map(({ language, name }) => ({
+                  language: getLanguageId(language),
+                  name,
+                })),
+                subfolders: subfolders.map(convertFolderToEndpointFolderPreview),
+              })) ?? [],
+          },
+    files:
+      files?.flatMap<EndpointFolder["files"][number]>(({ relationTo, value }) => {
+        if (!isPayloadType(value) || ("_status" in value && !isPublished(value))) {
+          return [];
+        }
+
+        switch (relationTo) {
+          case Collections.Collectibles:
+            return [
+              {
+                relationTo: Collections.Collectibles,
+                value: convertCollectibleToEndpointCollectiblePreview(value),
+              },
+            ];
+          case Collections.Pages:
+            return [
+              { relationTo: Collections.Pages, value: convertPageToEndpointPagePreview(value) },
+            ];
+          case Collections.Images:
+            if (!isImage(value)) return [];
+            return [{ relationTo: Collections.Images, value: convertImageToEndpointImage(value) }];
+          case Collections.Audios:
+            if (!isAudio(value)) return [];
+            return [{ relationTo: Collections.Audios, value: convertAudioToEndpointAudio(value) }];
+          case Collections.Videos:
+            if (!isVideo(value)) return [];
+            return [{ relationTo: Collections.Videos, value: convertVideoToEndpointVideo(value) }];
+          default:
+            return [];
+        }
+      }) ?? [],
+    parentPages: convertSourceToEndpointSource({ folders: parentFolders }),
+  };
+};
+
 const isValidSection = (section: {
  translations?:
    | {
--- a/src/collections/Pages/endpoints/getBySlugEndpoint.ts
+++ b/src/collections/Pages/endpoints/getBySlugEndpoint.ts
@ -7,7 +7,7 @@ import {
  isNodeBlockNode,
 } from "../../../constants";
 import { createGetByEndpoint } from "../../../endpoints/createGetByEndpoint";
-import { EndpointPage, TableOfContentEntry } from "../../../sdk";
+import { EndpointPage, EndpointPagePreview, TableOfContentEntry } from "../../../sdk";
 import { Page } from "../../../types/collections";
 import { isImage, isNotEmpty, isPayloadType } from "../../../utils/asserts";
 import {
@ -17,7 +17,7 @@ import {
  convertSourceToEndpointSource,
 } from "../../../utils/endpoints";
 import { convertImageToEndpointImage } from "../../Images/endpoints/getByID";
-import { convertRecorderToEndpointRecorder } from "../../Recorders/endpoints/getByID";
+import { convertRecorderToEndpointRecorderPreview } from "../../Recorders/endpoints/getByID";

 export const getBySlugEndpoint = createGetByEndpoint({
  collection: Collections.Pages,
@ -25,43 +25,56 @@ export const getBySlugEndpoint = createGetByEndpoint({
  handler: (page) => convertPageToEndpointPage(page),
 });

-export const convertPageToEndpointPage = ({
+export const convertPageToEndpointPagePreview = ({
+  id,
  translations,
-  collectibles,
-  folders,
-  backgroundImage,
  slug,
  attributes,
  thumbnail,
-  createdAt,
  updatedAt,
-  updatedBy,
-}: Page): EndpointPage => ({
+}: Page): EndpointPagePreview => ({
+  id,
  slug,
  ...(isImage(thumbnail) ? { thumbnail: convertImageToEndpointImage(thumbnail) } : {}),
-  ...(isImage(backgroundImage)
-    ? { backgroundImage: convertImageToEndpointImage(backgroundImage) }
-    : {}),
  attributes: convertAttributesToEndpointAttributes(attributes),
-  translations: translations.map(
-    ({ content, language, sourceLanguage, title, pretitle, subtitle, summary, credits }) => ({
-      language: isPayloadType(language) ? language.id : language,
-      sourceLanguage: isPayloadType(sourceLanguage) ? sourceLanguage.id : sourceLanguage,
-      ...(isNotEmpty(pretitle) ? { pretitle } : {}),
-      title,
-      ...(isNotEmpty(subtitle) ? { subtitle } : {}),
-      ...(isNotEmpty(summary) ? { summary } : {}),
-      content: convertRTCToEndpointRTC(content),
-      toc: handleToc(content),
-      credits: convertCreditsToEndpointCredits(credits),
-    })
-  ),
-  createdAt,
+  translations: translations.map(({ language, title, pretitle, subtitle }) => ({
+    language: isPayloadType(language) ? language.id : language,
+    ...(isNotEmpty(pretitle) ? { pretitle } : {}),
+    title,
+    ...(isNotEmpty(subtitle) ? { subtitle } : {}),
+  })),
  updatedAt,
-  ...(isPayloadType(updatedBy) ? { updatedBy: convertRecorderToEndpointRecorder(updatedBy) } : {}),
-  parentPages: convertSourceToEndpointSource({ collectibles, folders }),
 });

+const convertPageToEndpointPage = (page: Page): EndpointPage => {
+  const { translations, collectibles, folders, backgroundImage, createdAt, updatedBy } = page;
+
+  return {
+    ...convertPageToEndpointPagePreview(page),
+    ...(isImage(backgroundImage)
+      ? { backgroundImage: convertImageToEndpointImage(backgroundImage) }
+      : {}),
+    translations: translations.map(
+      ({ content, language, sourceLanguage, title, pretitle, subtitle, summary, credits }) => ({
+        language: isPayloadType(language) ? language.id : language,
+        sourceLanguage: isPayloadType(sourceLanguage) ? sourceLanguage.id : sourceLanguage,
+        ...(isNotEmpty(pretitle) ? { pretitle } : {}),
+        title,
+        ...(isNotEmpty(subtitle) ? { subtitle } : {}),
+        ...(isNotEmpty(summary) ? { summary } : {}),
+        content: convertRTCToEndpointRTC(content),
+        toc: handleToc(content),
+        credits: convertCreditsToEndpointCredits(credits),
+      })
+    ),
+    createdAt,
+    ...(isPayloadType(updatedBy)
+      ? { updatedBy: convertRecorderToEndpointRecorderPreview(updatedBy) }
+      : {}),
+    parentPages: convertSourceToEndpointSource({ collectibles, folders }),
+  };
+};
+
 const handleToc = (content: RichTextContent, parentPrefix = ""): TableOfContentEntry[] => {
  let index = 0;

--- a/src/collections/Recorders/endpoints/getByID.ts
+++ b/src/collections/Recorders/endpoints/getByID.ts
@ -1,6 +1,6 @@
 import payload from "payload";
 import { Collections } from "../../../constants";
-import { EndpointRecorder } from "../../../sdk";
+import { EndpointRecorder, EndpointRecorderPreview } from "../../../sdk";
 import { Recorder } from "../../../types/collections";
 import { CollectionEndpoint } from "../../../types/payload";
 import { isImage, isPayloadType } from "../../../utils/asserts";
@ -38,21 +38,26 @@ export const getByID: CollectionEndpoint = {
  },
 };

-export const convertRecorderToEndpointRecorder = ({
+export const convertRecorderToEndpointRecorderPreview = ({
  id,
-  languages,
  username,
-  avatar,
  anonymize,
-  translations,
-}: Recorder): EndpointRecorder => ({
+}: Recorder): EndpointRecorderPreview => ({
  id,
-  languages: languages?.map((language) => (isPayloadType(language) ? language.id : language)) ?? [],
  username: anonymize ? `Recorder#${id.substring(0, 5)}` : username,
-  ...(isImage(avatar) ? { avatar: convertImageToEndpointImage(avatar) } : {}),
-  translations:
-    translations?.map(({ language, biography }) => ({
-      language: isPayloadType(language) ? language.id : language,
-      biography: convertRTCToEndpointRTC(biography),
-    })) ?? [],
 });
+
+const convertRecorderToEndpointRecorder = (recorder: Recorder): EndpointRecorder => {
+  const { languages, avatar, translations } = recorder;
+  return {
+    ...convertRecorderToEndpointRecorderPreview(recorder),
+    languages:
+      languages?.map((language) => (isPayloadType(language) ? language.id : language)) ?? [],
+    ...(isImage(avatar) ? { avatar: convertImageToEndpointImage(avatar) } : {}),
+    translations:
+      translations?.map(({ language, biography }) => ({
+        language: isPayloadType(language) ? language.id : language,
+        biography: convertRTCToEndpointRTC(biography),
+      })) ?? [],
+  };
+};
--- a/src/collections/WebsiteConfig/endpoints/getConfigEndpoint.ts
+++ b/src/collections/WebsiteConfig/endpoints/getConfigEndpoint.ts
@ -3,7 +3,7 @@ import { Collections } from "../../../constants";
 import { EndpointWebsiteConfig } from "../../../sdk";
 import { CollectionEndpoint } from "../../../types/payload";
 import { isImage, isPayloadType } from "../../../utils/asserts";
-import { convertFolderToEndpointFolder } from "../../Folders/endpoints/getBySlugEndpoint";
+import { convertFolderToEndpointFolderPreview } from "../../Folders/endpoints/getBySlugEndpoint";
 import { convertImageToEndpointImage } from "../../Images/endpoints/getByID";

 export const getConfigEndpoint: CollectionEndpoint = {
@ -57,7 +57,7 @@ export const getConfigEndpoint: CollectionEndpoint = {
          homeFolders?.flatMap(({ folder, darkThumbnail, lightThumbnail }) => {
            if (!isPayloadType(folder)) return [];
            return {
-              ...convertFolderToEndpointFolder(folder),
+              ...convertFolderToEndpointFolderPreview(folder),
              ...(isImage(darkThumbnail)
                ? { darkThumbnail: convertImageToEndpointImage(darkThumbnail) }
                : {}),
--- a/src/sdk.ts
+++ b/src/sdk.ts
@ -10,31 +10,37 @@ import { Currency, Language } from "./types/collections";

 // END MOCKING SECTION

-export type EndpointFolder = {
+export type EndpointFolderPreview = {
+  id: string;
  slug: string;
  icon?: string;
  translations: {
    language: string;
-    name: string;
-    description?: RichTextContent;
+    title: string;
  }[];
+};
+
+export type EndpointFolder = EndpointFolderPreview & {
+  translations: (EndpointFolderPreview["translations"][number] & {
+    description?: RichTextContent;
+  })[];
  sections:
-    | { type: "single"; subfolders: EndpointFolder[] }
+    | { type: "single"; subfolders: EndpointFolderPreview[] }
    | {
        type: "multiple";
        sections: {
          translations: { language: string; name: string }[];
-          subfolders: EndpointFolder[];
+          subfolders: EndpointFolderPreview[];
        }[];
      };
  files: (
    | {
        relationTo: Collections.Collectibles;
-        value: EndpointCollectible;
+        value: EndpointCollectiblePreview;
      }
    | {
        relationTo: Collections.Pages;
-        value: EndpointPage;
+        value: EndpointPagePreview;
      }
    | {
        relationTo: Collections.Images;
@ -55,7 +61,7 @@ export type EndpointFolder = {
 export type EndpointWebsiteConfig = {
  home: {
    backgroundImage?: EndpointImage;
-    folders: (EndpointFolder & {
+    folders: (EndpointFolderPreview & {
      lightThumbnail?: EndpointImage;
      darkThumbnail?: EndpointImage;
    })[];
@ -73,9 +79,12 @@ export type EndpointWebsiteConfig = {
  defaultOpenGraphImage?: EndpointImage;
 };

-export type EndpointRecorder = {
+export type EndpointRecorderPreview = {
  id: string;
  username: string;
+};
+
+export type EndpointRecorder = EndpointRecorderPreview & {
  avatar?: EndpointImage;
  translations: {
    language: string;
@ -93,8 +102,9 @@ export type EndpointWording = {
 };

 export type EndpointTag = {
+  id: string;
  slug: string;
-  page?: EndpointPage;
+  page?: { slug: string };
  translations: {
    language: string;
    name: string;
@ -102,6 +112,7 @@ export type EndpointTag = {
 };

 export type EndpointGenericAttribute = {
+  id: string;
  slug: string;
  icon: string;
  translations: {
@ -131,6 +142,7 @@ export type EndpointAttribute =
  | EndpointTagsAttribute;

 export type EndpointRole = {
+  id: string;
  icon: string;
  translations: {
    language: string;
@ -140,32 +152,39 @@ export type EndpointRole = {

 export type EndpointCredit = {
  role: EndpointRole;
-  recorders: EndpointRecorder[];
+  recorders: EndpointRecorderPreview[];
 };

-export type EndpointPage = {
+export type EndpointPagePreview = {
+  id: string;
  slug: string;
  thumbnail?: EndpointImage;
  attributes: EndpointAttribute[];
-  backgroundImage?: EndpointImage;
  translations: {
    language: string;
    pretitle?: string;
    title: string;
    subtitle?: string;
+  }[];
+  updatedAt: string;
+};
+
+export type EndpointPage = EndpointPagePreview & {
+  backgroundImage?: EndpointImage;
+  translations: (EndpointPagePreview["translations"][number] & {
    sourceLanguage: string;
    summary?: RichTextContent;
    content: RichTextContent;
    credits: EndpointCredit[];
    toc: TableOfContentEntry[];
-  }[];
+  })[];
  createdAt: string;
-  updatedAt: string;
-  updatedBy?: EndpointRecorder;
+  updatedBy?: EndpointRecorderPreview;
  parentPages: EndpointSource[];
 };

-export type EndpointCollectible = {
+export type EndpointCollectiblePreview = {
+  id: string;
  slug: string;
  thumbnail?: EndpointImage;
  translations: {
@ -173,20 +192,25 @@ export type EndpointCollectible = {
    pretitle?: string;
    title: string;
    subtitle?: string;
-    description?: RichTextContent;
  }[];
  attributes: EndpointAttribute[];
  releaseDate?: string;
  languages: string[];
+  price?: {
+    amount: number;
+    currency: string;
+  };
+};
+
+export type EndpointCollectible = EndpointCollectiblePreview & {
+  translations: (EndpointCollectiblePreview["translations"][number] & {
+    description?: RichTextContent;
+  })[];
  backgroundImage?: EndpointImage;
  nature: CollectibleNature;
  gallery?: { count: number; thumbnail: EndpointImage };
  scans?: { count: number; thumbnail: EndpointScanImage };
  urls: { url: string; label: string }[];
-  price?: {
-    amount: number;
-    currency: string;
-  };
  size?: {
    width: number;
    height: number;
@ -198,12 +222,12 @@ export type EndpointCollectible = {
    bindingType?: CollectibleBindingTypes;
    pageOrder?: CollectiblePageOrders;
  };
-  subitems: EndpointCollectible[];
+  subitems: EndpointCollectiblePreview[];
  contents: {
    content:
      | {
          relationTo: Collections.Pages;
-          value: EndpointPage;
+          value: EndpointPagePreview;
        }
      | {
          relationTo: Collections.Audios;
@ -244,7 +268,7 @@ export type EndpointCollectible = {
  }[];
  createdAt: string;
  updatedAt: string;
-  updatedBy?: EndpointRecorder;
+  updatedBy?: EndpointRecorderPreview;
  parentPages: EndpointSource[];
 };

@ -377,20 +401,26 @@ export type EndpointChronologyEvent = {
  }[];
 };

+export type EndpointSourcePreview = {
+  id: string;
+  slug: string;
+  translations: { language: string; pretitle?: string; title: string; subtitle?: string }[];
+};
+
 export type EndpointSource =
  | { type: "url"; url: string; label: string }
  | {
      type: "collectible";
-      collectible: EndpointCollectible;
+      collectible: EndpointSourcePreview;
      range?:
        | { type: "page"; page: number }
        | { type: "timestamp"; timestamp: string }
        | { type: "custom"; translations: { language: string; note: string }[] };
    }
-  | { type: "page"; page: EndpointPage }
-  | { type: "folder"; folder: EndpointFolder }
-  | { type: "scans"; collectible: EndpointCollectible }
-  | { type: "gallery"; collectible: EndpointCollectible };
+  | { type: "page"; page: EndpointSourcePreview }
+  | { type: "folder"; folder: EndpointSourcePreview }
+  | { type: "scans"; collectible: EndpointSourcePreview }
+  | { type: "gallery"; collectible: EndpointSourcePreview };

 export type EndpointMedia = {
  id: string;
@ -450,6 +480,7 @@ export type EndpointMediaThumbnail = PayloadImage & {
 };

 export type PayloadMedia = {
+  id: string;
  url: string;
  mimeType: string;
  filename: string;
--- a/src/types/collections.ts
+++ b/src/types/collections.ts
@ -142,6 +142,8 @@ export interface Image {
  filesize?: number | null;
  width?: number | null;
  height?: number | null;
+  focalX?: number | null;
+  focalY?: number | null;
  sizes?: {
    thumb?: {
      url?: string | null;
@ -620,6 +622,8 @@ export interface Scan {
  filesize?: number | null;
  width?: number | null;
  height?: number | null;
+  focalX?: number | null;
+  focalY?: number | null;
  sizes?: {
    thumb?: {
      url?: string | null;
@ -725,6 +729,8 @@ export interface Audio {
  filesize?: number | null;
  width?: number | null;
  height?: number | null;
+  focalX?: number | null;
+  focalY?: number | null;
 }
 /**
 * This interface was referenced by `Config`'s JSON-Schema
@ -740,6 +746,8 @@ export interface MediaThumbnail {
  filesize?: number | null;
  width?: number | null;
  height?: number | null;
+  focalX?: number | null;
+  focalY?: number | null;
  sizes?: {
    thumb?: {
      url?: string | null;
@ -865,6 +873,8 @@ export interface Video {
  filesize?: number | null;
  width?: number | null;
  height?: number | null;
+  focalX?: number | null;
+  focalY?: number | null;
 }
 /**
 * This interface was referenced by `Config`'s JSON-Schema
@ -878,6 +888,8 @@ export interface VideoSubtitle {
  filesize?: number | null;
  width?: number | null;
  height?: number | null;
+  focalX?: number | null;
+  focalY?: number | null;
 }
 /**
 * This interface was referenced by `Config`'s JSON-Schema
--- a/src/utils/endpoints.ts
+++ b/src/utils/endpoints.ts
@ -1,9 +1,6 @@
 import { convertAudioToEndpointAudio } from "../collections/Audios/endpoints/getByID";
-import { convertCollectibleToEndpointCollectible } from "../collections/Collectibles/endpoints/getBySlugEndpoint";
-import { convertFolderToEndpointFolder } from "../collections/Folders/endpoints/getBySlugEndpoint";
 import { convertImageToEndpointImage } from "../collections/Images/endpoints/getByID";
-import { convertPageToEndpointPage } from "../collections/Pages/endpoints/getBySlugEndpoint";
-import { convertRecorderToEndpointRecorder } from "../collections/Recorders/endpoints/getByID";
+import { convertRecorderToEndpointRecorderPreview } from "../collections/Recorders/endpoints/getByID";
 import { convertVideoToEndpointVideo } from "../collections/Videos/endpoints/getByID";
 import {
  AttributeTypes,
@ -26,6 +23,7 @@ import {
  EndpointRole,
  EndpointScanImage,
  EndpointSource,
+  EndpointSourcePreview,
  EndpointTag,
  PayloadImage,
 } from "../sdk";
@ -50,6 +48,7 @@ import {
  isDefined,
  isEmpty,
  isImage,
+  isNotEmpty,
  isPayloadArrayType,
  isPayloadImage,
  isPayloadType,
@ -57,9 +56,10 @@ import {
  isVideo,
 } from "./asserts";

-const convertTagToEndpointTag = ({ slug, page, translations }: Tag): EndpointTag => ({
+const convertTagToEndpointTag = ({ id, slug, page, translations }: Tag): EndpointTag => ({
+  id,
  slug,
-  ...(page && isPayloadType(page) ? { page: convertPageToEndpointPage(page) } : {}),
+  ...(page && isPayloadType(page) ? { page: { slug: page.slug } } : {}),
  translations: translations.map(({ language, name }) => ({
    language: isPayloadType(language) ? language.id : language,
    name,
@ -134,6 +134,7 @@ export const convertRTCToEndpointRTC = (
  };
 };

+// TODO: Handle URL sources
 export const convertSourceToEndpointSource = ({
  collectibles,
  folders,
@ -147,11 +148,39 @@ export const convertSourceToEndpointSource = ({
 }): EndpointSource[] => {
  const result: EndpointSource[] = [];

+  const convertFolderToEndpointSourcePreview = ({
+    id,
+    slug,
+    translations,
+  }: Folder): EndpointSourcePreview => ({
+    id,
+    slug,
+    translations: translations.map(({ language, name }) => ({
+      language: isPayloadType(language) ? language.id : language,
+      title: name,
+    })),
+  });
+
+  const convertCollectibleToEndpointSourcePreview = ({
+    id,
+    slug,
+    translations,
+  }: Collectible): EndpointSourcePreview => ({
+    id,
+    slug,
+    translations: translations.map(({ language, title, pretitle, subtitle }) => ({
+      language: isPayloadType(language) ? language.id : language,
+      title,
+      ...(isNotEmpty(pretitle) ? { pretitle } : {}),
+      ...(isNotEmpty(subtitle) ? { subtitle } : {}),
+    })),
+  });
+
  if (collectibles && isPayloadArrayType(collectibles)) {
    collectibles.filter(isPublished).forEach((collectible) => {
      result.push({
        type: "collectible",
-        collectible: convertCollectibleToEndpointCollectible(collectible),
+        collectible: convertCollectibleToEndpointSourcePreview(collectible),
      });
    });
  }
@ -160,7 +189,7 @@ export const convertSourceToEndpointSource = ({
    scans.filter(isPublished).forEach((collectible) => {
      result.push({
        type: "scans",
-        collectible: convertCollectibleToEndpointCollectible(collectible),
+        collectible: convertCollectibleToEndpointSourcePreview(collectible),
      });
    });
  }
@ -169,7 +198,7 @@ export const convertSourceToEndpointSource = ({
    gallery.filter(isPublished).forEach((collectible) => {
      result.push({
        type: "gallery",
-        collectible: convertCollectibleToEndpointCollectible(collectible),
+        collectible: convertCollectibleToEndpointSourcePreview(collectible),
      });
    });
  }
@ -178,7 +207,7 @@ export const convertSourceToEndpointSource = ({
    folders.forEach((folder) => {
      result.push({
        type: "folder",
-        folder: convertFolderToEndpointFolder(folder),
+        folder: convertFolderToEndpointSourcePreview(folder),
      });
    });
  }
@ -198,7 +227,8 @@ export const getDomainFromUrl = (url: string): string => {
 export const getLanguageId = (language: string | Language) =>
  typeof language === "object" ? language.id : language;

-const convertRoleToEndpointRole = ({ icon, translations }: CreditsRole): EndpointRole => ({
+const convertRoleToEndpointRole = ({ id, icon, translations }: CreditsRole): EndpointRole => ({
+  id,
  icon: icon ?? "material-symbols:person",
  translations: translations.map(({ language, name }) => ({
    language: getLanguageId(language),
@ -212,7 +242,7 @@ export const convertCreditsToEndpointCredits = (credits?: Credits | null): Endpo
    return [
      {
        role: convertRoleToEndpointRole(role),
-        recorders: recorders.map(convertRecorderToEndpointRecorder),
+        recorders: recorders.map(convertRecorderToEndpointRecorderPreview),
      },
    ];
  }) ?? [];
@ -229,8 +259,9 @@ const convertAttributeToEndpointAttribute = (
    case "numberBlock": {
      const { name, number } = attribute;
      if (!isPayloadType(name)) return;
-      const { slug, icon, translations } = name;
+      const { id, slug, icon, translations } = name;
      return {
+        id,
        slug,
        icon: icon ?? "material-symbols:category",
        translations: translations.map(({ language, name }) => ({
@ -246,8 +277,9 @@ const convertAttributeToEndpointAttribute = (
      const { name, text } = attribute;
      if (!isPayloadType(name)) return;
      if (isEmpty(text)) return;
-      const { slug, icon, translations } = name;
+      const { id, slug, icon, translations } = name;
      return {
+        id,
        slug,
        icon: icon ?? "material-symbols:category",
        translations: translations.map(({ language, name }) => ({
@ -264,9 +296,10 @@ const convertAttributeToEndpointAttribute = (
      if (!isPayloadType(name)) return;
      if (!isPayloadArrayType(tags)) return;
      if (tags.length === 0) return;
-      const { slug, icon, translations } = name;
+      const { id, slug, icon, translations } = name;

      return {
+        id,
        slug,
        icon: icon ?? "material-symbols:category",
        translations: translations.map(({ language, name }) => ({
@ -307,14 +340,14 @@ export const convertSizesToPayloadImages = (
    images.push(smallestImage);
  }

-
  return images;
 };

 export const convertScanToEndpointScanImage = (
-  { url, width, height, mimeType, filename, filesize, sizes }: Scan & PayloadImage,
+  { id, url, width, height, mimeType, filename, filesize, sizes }: Scan & PayloadImage,
  index: string
 ): EndpointScanImage => ({
+  id,
  index,
  url,
  width,
@ -335,6 +368,7 @@ export const convertScanToEndpointScanImage = (
 });

 export const convertMediaThumbnailToEndpointMediaThumbnail = ({
+  id,
  url,
  width,
  height,
@ -343,6 +377,7 @@ export const convertMediaThumbnailToEndpointMediaThumbnail = ({
  filesize,
  sizes,
 }: MediaThumbnail & PayloadImage): EndpointMediaThumbnail => ({
+  id,
  url,
  width,
  height,