@prismicio/types-internal 2.2.0-alpha.2 → 2.2.0-alpha.21

package/lib/validators/function.d.ts

@@ -12,3 +12,23 @@ export declare function isEmpty(obj: object): boolean;
 export declare function addType<A, O extends object, I, T extends string>(codec: t.Type<A, O, I>, t: T): t.Type<A, O & {
     __TYPE__: T;
 }, I>;
+/**
+ * Returns a clone of the given codec that tries to find sub-error with message already set.
+ * If there is such error it just returns sub-errors array.
+ * If there is no such error it generates new error with given message.
+ *
+ * @example
+ * expect(
+ * 		withCustomError(
+ * 			t.type({age: withCustomError(t.number, () => 'Invalid child')}),
+ * 			() => "Invalid parent"
+ * 		)
+ * ).toSubsetEqualLeft([{message: "Invalid child"}])
+ * expect(
+ * 		withCustomError(
+ * 			t.type({age: t.number}),
+ * 			() => "Invalid parent"
+ * 		)
+ * ).toSubsetEqualLeft([{message: "Invalid parent"}])
+ */
+export declare function withCustomError<C extends t.Any>(codec: C, message: (i: t.InputOf<C>, c: t.Context) => string): C;

package/lib/validators/function.js

@@ -1,10 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.addType = exports.isEmpty = exports.objectToMap = exports.grouped = exports.formatDate = exports.formatDateTime = exports.filterDouble = exports.refineType = exports.nullable = void 0;
+exports.withCustomError = exports.addType = exports.isEmpty = exports.objectToMap = exports.grouped = exports.formatDate = exports.formatDateTime = exports.filterDouble = exports.refineType = exports.nullable = void 0;
 const tslib_1 = require("tslib");
 const fp_ts_1 = require("fp-ts");
 const function_1 = require("fp-ts/function");
 const t = (0, tslib_1.__importStar)(require("io-ts"));
+const io_ts_types_1 = require("io-ts-types");
 const mapOutput_1 = require("io-ts-types/mapOutput");
 function nullable(c) {
     return t.union([c, t.null, t.undefined]);
@@ -58,3 +59,42 @@ function addType(codec, t) {
     return (0, mapOutput_1.mapOutput)(codec, (o) => ({ ...o, __TYPE__: t }));
 }
 exports.addType = addType;
+/**
+ * Returns a clone of the given codec that tries to find sub-error with message already set.
+ * If there is such error it just returns sub-errors array.
+ * If there is no such error it generates new error with given message.
+ *
+ * @example
+ * expect(
+ * 		withCustomError(
+ * 			t.type({age: withCustomError(t.number, () => 'Invalid child')}),
+ * 			() => "Invalid parent"
+ * 		)
+ * ).toSubsetEqualLeft([{message: "Invalid child"}])
+ * expect(
+ * 		withCustomError(
+ * 			t.type({age: t.number}),
+ * 			() => "Invalid parent"
+ * 		)
+ * ).toSubsetEqualLeft([{message: "Invalid parent"}])
+ */
+function withCustomError(codec, message) {
+    return (0, io_ts_types_1.withValidate)(codec, (i, c) => {
+        return fp_ts_1.either.mapLeft((errors) => {
+            if (errors.find((error) => error.message)) {
+                return errors;
+            }
+            return [
+                {
+                    value: i,
+                    context: c,
+                    // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+                    message: message(i, c),
+                    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+                    actual: i,
+                },
+            ];
+        })(codec.validate(i, c));
+    });
+}
+exports.withCustomError = withCustomError;

package/lib/validators/index.d.ts

@@ -9,6 +9,7 @@ export { default as IntFromPixels } from "./IntFromPixels";
 export { default as NonEmptyString } from "./NonEmptyString";
 export { default as NonEmptyStringOrNull } from "./NonEmptyStringOrNull";
 export { default as NumberOrNull } from "./NumberOrNull";
+export { default as NumberRange } from "./NumberRange";
 export { default as StringFromBoolean } from "./StringFromBoolean";
 export { default as StringFromNumber } from "./StringFromNumber";
 export { default as StringOrNull } from "./StringOrNull";

package/lib/validators/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.StringOrNull = exports.StringFromNumber = exports.StringFromBoolean = exports.NumberOrNull = exports.NonEmptyStringOrNull = exports.NonEmptyString = exports.IntFromPixels = exports.IntFromNumber = exports.Function = exports.DateFromTsMs = exports.DateFromStringOrNumber = exports.DateFromString = void 0;
+exports.StringOrNull = exports.StringFromNumber = exports.StringFromBoolean = exports.NumberRange = exports.NumberOrNull = exports.NonEmptyStringOrNull = exports.NonEmptyString = exports.IntFromPixels = exports.IntFromNumber = exports.Function = exports.DateFromTsMs = exports.DateFromStringOrNumber = exports.DateFromString = void 0;
 const tslib_1 = require("tslib");
 (0, tslib_1.__exportStar)(require("./BasicTypes"), exports);
 var DateFromString_1 = require("./DateFromString");
@@ -21,6 +21,8 @@ var NonEmptyStringOrNull_1 = require("./NonEmptyStringOrNull");
 Object.defineProperty(exports, "NonEmptyStringOrNull", { enumerable: true, get: function () { return (0, tslib_1.__importDefault)(NonEmptyStringOrNull_1).default; } });
 var NumberOrNull_1 = require("./NumberOrNull");
 Object.defineProperty(exports, "NumberOrNull", { enumerable: true, get: function () { return (0, tslib_1.__importDefault)(NumberOrNull_1).default; } });
+var NumberRange_1 = require("./NumberRange");
+Object.defineProperty(exports, "NumberRange", { enumerable: true, get: function () { return (0, tslib_1.__importDefault)(NumberRange_1).default; } });
 var StringFromBoolean_1 = require("./StringFromBoolean");
 Object.defineProperty(exports, "StringFromBoolean", { enumerable: true, get: function () { return (0, tslib_1.__importDefault)(StringFromBoolean_1).default; } });
 var StringFromNumber_1 = require("./StringFromNumber");

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@prismicio/types-internal",
-	"version": "2.2.0-alpha.2",
+	"version": "2.2.0-alpha.21",
 	"description": "Prismic types for Custom Types and Prismic Data",
 	"keywords": [
 		"typescript",
@@ -67,7 +67,9 @@
 	"peerDependencies": {
 		"fp-ts": "^2.11.8",
 		"io-ts": "^2.2.16",
-		"io-ts-types": "^0.5.16"
+		"io-ts-types": "^0.5.16",
+		"uuid": "^9.0.0",
+		"@types/uuid": "^9.0.2"
 	},
 	"engines": {
 		"node": ">=12.7.0"

package/src/common/Asset.ts

@@ -0,0 +1,25 @@
+export type Asset = {
+	id: string
+	last_modified: string
+	kind: "image" | "all"
+	filename?: string
+	extension?: string
+	size?: number
+	origin_url: string
+	url: string
+	width?: number
+	height?: number
+	notes?: string
+	credits?: string
+	alt?: string
+}
+
+export const getAssetOrThrow =
+	(assets: Record<Asset["id"], Asset | undefined>) =>
+	(assetId: Asset["id"]) => {
+		const asset = assets[assetId]
+		if (!asset) {
+			throw new Error(`Missing asset with id '${assetId}'!`)
+		}
+		return asset
+	}

package/src/common/Embed.ts

@@ -0,0 +1,22 @@
+// This type represents response format from oEmbed API
+export type Embed = {
+	type: string
+	version?: string | null
+	author_name?: string | null
+	author_url?: string | null
+	provider_name?: string | null
+	provider_url?: string | null
+	cache_age?: string | null
+	thumbnail_url?: string | null
+	thumbnail_width?: number | null
+	thumbnail_height?: number | null
+	html?: string | null
+	title?: string | null
+}
+
+export const getEmbedOrThrow =
+	(embeds: Record<string, Embed | undefined>) => (embedUrl: string) => {
+		const embed = embeds[embedUrl]
+		if (!embed) throw new Error(`Missing embed with url '${embedUrl}'`)
+		return embed
+	}

package/src/common/UUID.ts

@@ -0,0 +1,19 @@
+import * as t from "io-ts"
+import { validate as validateUUID } from "uuid"
+
+import { withCustomError } from "../validators/function"
+
+interface UUIDBrand {
+	readonly UUID: unique symbol
+}
+
+export const UUID = withCustomError(
+	t.brand(
+		t.string,
+		(s): s is t.Branded<string, UUIDBrand> => validateUUID(s),
+		"UUID",
+	),
+	() => "The value must be a valid UUID",
+)
+
+export type UUID = t.TypeOf<typeof UUID>

package/src/common/index.ts

@@ -1 +1,3 @@
+export * from "./Asset"
+export * from "./Embed"
 export * from "./WidgetKey"

package/src/content/fields/nestable/RichTextContent/Blocks.ts

@@ -198,7 +198,7 @@ const TextBlockCodec = (linkCodec: LinkCodec) =>
 export const TextBlock = TextBlockCodec(Link)
 export type TextBlock = t.TypeOf<typeof TextBlock>
 
-const TextBlockLegacy = TextBlockCodec(LinkLegacy)
+export const TextBlockLegacy = TextBlockCodec(LinkLegacy)
 type TextBlockLegacy = t.TypeOf<typeof TextBlockLegacy>
 
 const legacyBlockCodec = t.union([

package/src/content/fields/slices/Slice/RepeatableContent.ts

@@ -13,6 +13,5 @@ const RepeatableWidgetsBlock = t.strict({
 	__TYPE__: t.literal(GroupItemContentType),
 	value: t.array(RepeatableWidget),
 })
-t.array(RepeatableWidget)
 
 export const RepeatableWidgets = t.array(RepeatableWidgetsBlock)

package/src/customtypes/CustomType.ts

@@ -8,6 +8,7 @@ import type { SharedSlice } from "./widgets/slices/SharedSlice"
 import type { DynamicSlice } from "./widgets/slices/Slice"
 import type { DynamicSlices } from "./widgets/slices/Slices"
 import type { DynamicWidget } from "./widgets/Widget"
+import type { StaticWidget } from "./widgets/Widget"
 
 export const CustomTypeFormat = {
 	page: "page",
@@ -194,3 +195,15 @@ export function filterMissingSharedSlices(
 		return widget
 	})
 }
+
+export function flattenCustomTypeFields(
+	customType: StaticCustomType,
+): Partial<Record<string, StaticWidget>> {
+	return Object.values(customType.json).reduce(
+		(acc, tab) => ({
+			...acc,
+			...tab,
+		}),
+		{},
+	)
+}

package/src/import/converters/Document.ts

@@ -1,15 +1,17 @@
+import type { Asset, Embed } from "../../common"
 import type { Document, WidgetContent } from "../../content"
 import type { ImportDocument } from "../validators"
 import type { ImportField } from "../validators/fields/ImportField"
-import { Asset, convertNestableWidget, uidConverter } from "./fields"
+import { convertNestableWidget, importSlicesConverter } from "./fields"
 
 export function convertImportToContent(
 	document: ImportDocument,
-	images: Map<string, Asset>,
+	assets: Record<Asset["id"], Asset | undefined>,
+	embeds: Record<string, Embed | undefined>,
 ): Document {
 	return Object.entries(document).reduce<Document>(
 		(acc, [fieldKey, fieldValue]) => {
-			const newFieldValue = convertWidget(fieldValue, images)
+			const newFieldValue = convertWidget(fieldValue, assets, embeds)
 			return newFieldValue ? { ...acc, [fieldKey]: newFieldValue } : acc
 		},
 		{},
@@ -18,12 +20,13 @@ export function convertImportToContent(
 
 function convertWidget(
 	field: ImportField,
-	images: Map<string, Asset>,
+	assets: Record<Asset["id"], Asset | undefined>,
+	embeds: Record<string, Embed | undefined>,
 ): WidgetContent | undefined {
 	switch (field.type) {
-		case "UID":
-			return uidConverter(field.value)
+		case "Slices":
+			return importSlicesConverter(field.value, assets, embeds)
 		default:
-			return convertNestableWidget(field, images)
+			return convertNestableWidget(field, assets, embeds)
 	}
 }

package/src/import/converters/fields/Slices/SharedSlice.ts

@@ -0,0 +1,24 @@
+import { v4 as uuid } from "uuid"
+
+import type { Asset, Embed } from "../../../../common"
+import type { SliceItemContent } from "../../../../content"
+import type { SharedSlice as ImportSharedSlice } from "../../../validators/fields/ImportSlices/SharedSlice"
+import { importSharedSliceContentConverter } from "./SharedSliceContent"
+
+// TODO should we put it together with SharedSliceId validator?
+const buildSharedSliceId = (slice_type: string) => `${slice_type}$${uuid()}`
+
+export const sharedSliceConverter = (
+	slice: ImportSharedSlice,
+	assets: Record<Asset["id"], Asset | undefined>,
+	embeds: Record<string, Embed | undefined>,
+): SliceItemContent => {
+	// Right now we only support SharedSlices, if we support more types of slices in the future we'll need to select a correct converter here
+	const widget = importSharedSliceContentConverter(slice, assets, embeds)
+	return {
+		key: slice.id ?? buildSharedSliceId(slice.slice_type),
+		name: slice.slice_type,
+		maybeLabel: slice.slice_label ?? undefined,
+		widget,
+	}
+}

package/src/import/converters/fields/Slices/SharedSliceContent.ts

@@ -0,0 +1,94 @@
+import { pipe } from "fp-ts/function"
+import * as O from "fp-ts/Option"
+import * as R from "fp-ts/Record"
+
+import type { Asset, Embed } from "../../../../common"
+import type { NestableContent, SharedSliceContent } from "../../../../content"
+import {
+	GroupItemContentType,
+	SharedSliceContentType,
+} from "../../../../content"
+import type {
+	SharedSlice as ImportSharedSlice,
+	SharedSliceContent as ImportSharedSliceContent,
+} from "../../../validators/fields/ImportSlices/SharedSlice"
+import { convertNestableWidget } from "../nestable"
+
+/**
+ * Converts the ImportSharedSliceContent which is a record of widget keys and ImportNestable values to a record of widget keys and NestableContent values.
+ *
+ * @param content a single ImportSharedSliceContent
+ * @param assets assets that are required for a conversion of a nestable widget
+ * @param embeds embeds that are required for a conversion of a nestable widget
+ */
+const sharedSliceContentConverter = (
+	content: ImportSharedSliceContent,
+	assets: Record<Asset["id"], Asset | undefined>,
+	embeds: Record<string, Embed | undefined>,
+): Record<string, NestableContent> =>
+	pipe(
+		content,
+		// convertNestableWidget can theoretically return undefined, so we need to filter out those values
+		R.filterMap((contentValue) =>
+			pipe(
+				contentValue,
+				(content) => convertNestableWidget(content, assets, embeds),
+				O.fromNullable,
+			),
+		),
+	)
+
+/**
+ * Converts a list of items to a list of repeatable widgets.
+ * Each ImportSharedSliceContent element is a record of fields, but in the content model it is represented as a list of tuples (key, value)
+ *
+ * For example, given the following slice content:
+ *  {
+ *  	"slice_text": (ImportNestable),
+ *  	"slice_number": (ImportNestable),
+ *  }
+ *
+ *  has to be converted to:
+ *
+ *  {
+ *      __TYPE__: "GroupItemContentType",
+ *      value: [
+ *      	["slice_text", (NestableContent)],
+ *      	["slice_number", (NestableContent)],
+ *      ]
+ *  }
+ *
+ *  @param items list of items to be converted
+ *  @param assets assets that are required for a conversion of a nestable widget
+ */
+const itemsConverter = (
+	items: ImportSharedSliceContent[],
+	assets: Record<Asset["id"], Asset | undefined>,
+	embeds: Record<string, Embed | undefined>,
+): SharedSliceContent["items"] =>
+	items.map((item) =>
+		pipe(
+			sharedSliceContentConverter(item, assets, embeds),
+			(record) => Object.entries(record),
+			(entries) => ({ __TYPE__: GroupItemContentType, value: entries }),
+		),
+	)
+
+/**
+ * Builds SharedSliceContent model from ImportSharedSlice
+ * @param field ImportSharedSlice to be converted - a single slice from the slices array in the import document
+ * @param assets assets that are required for a conversion of a nestable widget
+ * @param embeds embeds that are required for a conversion of a nestable widget
+ */
+export const importSharedSliceContentConverter = (
+	field: ImportSharedSlice,
+	assets: Record<Asset["id"], Asset | undefined>,
+	embeds: Record<string, Embed | undefined>,
+): SharedSliceContent => ({
+	__TYPE__: SharedSliceContentType,
+	primary: field.primary
+		? sharedSliceContentConverter(field.primary, assets, embeds)
+		: {},
+	items: field.items ? itemsConverter(field.items, assets, embeds) : [],
+	variation: field.variation,
+})

package/src/import/converters/fields/Slices/Slices.ts

@@ -0,0 +1,20 @@
+import type { Asset, Embed } from "../../../../common"
+import type { SliceItemContent, SlicesContent } from "../../../../content"
+import type { ImportSlices } from "../../../validators/fields/ImportSlices"
+import { sharedSliceConverter } from "./SharedSlice"
+
+export const importSlicesConverter = (
+	field: ImportSlices["value"],
+	assets: Record<Asset["id"], Asset | undefined>,
+	embeds: Record<string, Embed | undefined>,
+): SlicesContent | undefined => {
+	if (field === null) return
+
+	return {
+		value: field.map((slice): SliceItemContent => {
+			// Right now we only support SharedSlices, if we support more types of slices in the future we'll need to select a correct converter here
+			return sharedSliceConverter(slice, assets, embeds)
+		}),
+		__TYPE__: "SliceContentType",
+	}
+}

package/src/import/converters/fields/Slices/index.ts

@@ -0,0 +1 @@
+export * from "./Slices"

package/src/import/converters/fields/UID.ts

@@ -1,11 +1,7 @@
 import type { UIDContent } from "../../../content"
 import type { ImportUID } from "../../validators/fields/UID"
 
-export const uidConverter = (
-	field: ImportUID["value"],
-): UIDContent | undefined => {
-	if (field === null) return
-
+export const uidConverter = (field: ImportUID["value"]): UIDContent => {
 	return {
 		value: field,
 		__TYPE__: "UIDContent",

package/src/import/converters/fields/index.ts

@@ -1,2 +1,3 @@
 export * from "./nestable"
+export * from "./Slices"
 export * from "./UID"

package/src/import/converters/fields/nestable/Embed.ts

@@ -1,15 +1,37 @@
+import type { Embed } from "../../../../common"
+import { getEmbedOrThrow } from "../../../../common"
 import type { EmbedContent } from "../../../../content"
+import { withOptionals } from "../../../../utils/Objects"
 import type { ImportEmbed } from "../../../validators"
 
 export const embedConverter = (
 	field: ImportEmbed["value"],
+	embeds: Record<string, Embed | undefined>,
 ): EmbedContent | undefined => {
 	if (field === null) return
-
-	return {
-		...field,
-		__TYPE__: "EmbedContent",
-	}
-
-	return
+	const embed = getEmbedOrThrow(embeds)(field.embed_url)
+	return withOptionals<EmbedContent>(
+		{
+			embed_url: field.embed_url,
+			type: embed.type,
+			all: {
+				embed_url: field.embed_url,
+				...embed,
+			},
+			__TYPE__: "EmbedContent",
+		},
+		[
+			["version", embed.version],
+			["title", embed.title],
+			["author_name", embed.author_name],
+			["author_url", embed.author_url],
+			["provider_name", embed.provider_name],
+			["provider_url", embed.provider_url],
+			["cache_age", embed.cache_age],
+			["thumbnail_url", embed.thumbnail_url],
+			["thumbnail_width", embed.thumbnail_width],
+			["thumbnail_height", embed.thumbnail_height],
+			["html", embed.html],
+		],
+	)
 }

package/src/import/converters/fields/nestable/GeoPoint.ts

@@ -0,0 +1,16 @@
+import type { GeoPointContent } from "../../../../content"
+import type { ImportGeoPoint } from "../../../validators"
+
+export const geopointConverter = (
+	field: ImportGeoPoint["value"],
+): GeoPointContent | undefined => {
+	if (field === null) return
+
+	return {
+		position: {
+			lat: field.latitude,
+			lng: field.longitude,
+		},
+		__TYPE__: "GeoPointContent",
+	}
+}

package/src/import/converters/fields/nestable/Image.ts

@@ -1,68 +1,93 @@
-import type { ImageContent } from "../../../../content"
-import { mapValues, withOptionals } from "../../../../utils/Objects"
+import type { Asset } from "../../../../common"
+import { getAssetOrThrow } from "../../../../common"
+import type { ImageContent, ImageContentView } from "../../../../content"
+import { withOptionals } from "../../../../utils/Objects"
 import type { ImageField, ImportImage } from "../../../validators"
+import type { ImportImageBlock } from "../../../validators/fields/nestable/ImportRichText/blocks";
 
-export type Asset = {
-	id: string
-	last_modified: string
-	kind: "image" | "all"
-	filename?: string
-	extension?: string
-	size?: string
-	origin_url: string
-	url: string
-	width?: number
-	height?: number
-	notes?: string
-	credits?: string
-	alt?: string
-}
-
-function convertImage(field: ImageField, image: Asset) {
-	return withOptionals<Omit<ImageContent, "__TYPE__" | "thumbnails">>(
+export function convertImageView<Input extends ImageField | ImportImageBlock>(
+	inputImage: Input,
+	image: Asset,
+): ImageContentView {
+	// We can do that because anyway all properties being read
+	const imageField: ImageField = {
+		...inputImage,
+		edit:
+			"edit" in inputImage
+				? inputImage.edit
+				: {
+						x: 0,
+						y: 0,
+						zoom: 1,
+				  },
+		dimensions: "dimensions" in inputImage ? inputImage.dimensions : {},
+	}
+	return withOptionals<ImageContentView>(
 		{
 			origin: {
-				id: field.id,
+				id: image.id,
 				url: image.origin_url,
-				width: image.width!,
-				height: image.height!,
+				// All images returned form Asset API should have width and height properties.
+				width: image.width ?? 0,
+				height: image.height ?? 0,
 			},
-			width: field.edit?.width ?? image.width!,
-			height: field.edit?.height ?? image.height!,
+			// All images returned form Asset API should have width and height properties.
+			// Image width and height will be only applied if there are no constraints and user didn't overwrite it
+			width: imageField?.dimensions?.width ?? image.width ?? 0,
+			height: imageField?.dimensions?.height ?? image.height ?? 0,
+			// If edit is not provided, we crop constraint width and height from the left upper corner.
+			// WARN: If constraints are greater than image dimensions cut outside the image (background will fill extra space).
 			edit: {
-				zoom: field.edit?.zoom ?? 1,
+				zoom: imageField.edit?.zoom ?? 1,
 				crop: {
-					x: field.edit?.x ?? 0,
-					y: field.edit?.y ?? 0,
+					x: imageField.edit?.x ?? 0,
+					y: imageField.edit?.y ?? 0,
 				},
-				background: field.edit?.background ?? "transparent",
+				background:
+					imageField.edit?.background ??
+					(image.extension === "png" ? "transparent" : "#ffffff"),
 			},
 			url: image.url,
 		},
 		[
-			["alt", field.alt || image.alt],
-			["credits", field.credit || image.credits],
+			["alt", imageField?.alt || image.alt],
+			["credits", imageField?.copyright || image.credits],
 		],
 	)
 }
 
+function convertThumbnails(
+	imageField: Exclude<ImportImage["value"], null>,
+	assets: Record<Asset["id"], Asset | undefined>,
+) {
+	return Object.entries(imageField.thumbnails).reduce(
+		(acc, [thumbnailName, thumbnail]) => {
+			return {
+				...acc,
+				[thumbnailName]: convertImageView(
+					thumbnail,
+					getAssetOrThrow(assets)(thumbnail.id),
+				),
+			}
+		},
+		{},
+	)
+}
+
+// All assets from `imageField` must be present in `assets`
+// If not then function will throw an error
 export const imageConverter = (
-	field: ImportImage["value"],
-	images: Map<string, Asset>,
+	imageField: ImportImage["value"],
+	assets: Record<Asset["id"], Asset | undefined>,
 ): ImageContent | undefined => {
-	const getImageById = (id: string): Asset => {
-		const image = images.get(id)
-		if (!image) throw new Error(`Missing asset with id '${id}'`)
-		return image
-	}
-
-	if (!field) return
+	if (!imageField) return
 
 	return {
-		...convertImage(field, getImageById(field.id)),
-		thumbnails: mapValues(field.thumbnails, (thumbnail) =>
-			convertImage(thumbnail, getImageById(thumbnail.id)),
+		...convertImageView<ImageField>(
+			imageField,
+			getAssetOrThrow(assets)(imageField.id),
 		),
-		__TYPE__: "ImageContent",
+		thumbnails: convertThumbnails(imageField, assets),
+		__TYPE__: "ImageContent" as const,
 	}
 }