@stackbit/cms-contentful 1.0.5 → 1.0.6-staging.2

package/src/contentful-schema-converter.ts

@@ -1,8 +1,8 @@
 import _ from 'lodash';
 import { omitByNil } from '@stackbit/utils';
-import { Field, FieldCrossReferenceModel, Model } from '@stackbit/types';
-import { FieldType } from 'contentful-management';
-import { ContentFields, ContentTypeProps, Control, EditorInterfaceProps } from 'contentful-management';
+import * as StackbitTypes from '@stackbit/types';
+import type { Field, FieldSpecificProps, RequiredBy } from '@stackbit/types';
+import type { FieldType, ContentFields, ContentTypeProps, Control, EditorInterfaceProps, ContentTypeFieldValidation } from 'contentful-management';
 
 import {
     CONTENTFUL_NODE_TYPES_MAP,
@@ -13,6 +13,13 @@ import {
 } from './contentful-consts';
 
 type ExtendedFieldType = FieldType | ResourceLink | ResourceLinkArray;
+type ContentfulField = ContentFields & ExtendedFieldType;
+
+declare module 'contentful-management' {
+    interface ContentTypeFieldValidation {
+        message?: string;
+    }
+}
 
 interface ResourceLink {
     type: 'ResourceLink';
@@ -42,7 +49,7 @@ export interface ConvertSchemaOptions {
 }
 
 export function convertSchema({ contentTypes, editorInterfaces, defaultLocaleCode, cloudinaryImagesAsList, bynderImagesAsList }: ConvertSchemaOptions): {
-    models: Model[];
+    models: StackbitTypes.Model[];
 } {
     const editorInterfaceByContentTypeId = _.chain(editorInterfaces)
         .filter({
@@ -81,7 +88,7 @@ interface MapModelOptions {
     bynderImagesAsList: boolean;
 }
 
-function mapModel(options: MapModelOptions): Model {
+function mapModel(options: MapModelOptions): StackbitTypes.Model {
     const contentType = options.contentType;
     const contentTypeId = contentType.sys.id;
     const mappedFields = mapFields(options);
@@ -110,7 +117,7 @@ interface MapFieldsOptions {
 
 function mapFields({ contentType, editorInterfaceByContentTypeId, defaultLocaleCode, cloudinaryImagesAsList, bynderImagesAsList }: MapFieldsOptions) {
     const contentTypeId = contentType.sys.id;
-    const fields = contentType.fields;
+    const fields = contentType.fields as ContentfulField[];
     const editorInterfaceControls = editorInterfaceByContentTypeId[contentTypeId]?.controls;
     const editorInterfaceControlsByFieldId = _.keyBy(editorInterfaceControls, 'fieldId');
 
@@ -126,7 +133,7 @@ function mapFields({ contentType, editorInterfaceByContentTypeId, defaultLocaleC
 }
 
 interface MapFieldOptions {
-    field: ContentFields;
+    field: ContentfulField;
     editorInterfaceControlsByFieldId: Record<string, Control>;
     defaultLocaleCode: string;
     cloudinaryImagesAsList: boolean;
@@ -139,10 +146,11 @@ function mapField({ field, editorInterfaceControlsByFieldId, defaultLocaleCode,
     const isRequired = field.required;
     const isReadonly = _.get(editorInterfaceControl, 'settings.readOnly');
     const isHidden = field.disabled ?? isReadonly;
+    const validations = field.validations;
     const localized = field.localized;
     const defaultValue = getDefaultValue(field, defaultLocaleCode, editorInterfaceControl);
     const defaultAsConst = isRequired && isReadonly && !_.isUndefined(defaultValue);
-    const extra = convertField({ field, editorInterfaceControl, cloudinaryImagesAsList, bynderImagesAsList });
+    const fieldSpecificProps = convertField({ field, editorInterfaceControl, cloudinaryImagesAsList, bynderImagesAsList });
 
     return _.assign(
         {
@@ -157,13 +165,14 @@ function mapField({ field, editorInterfaceControlsByFieldId, defaultLocaleCode,
             const: defaultAsConst ? defaultValue : undefined,
             readOnly: isReadonly,
             hidden: isHidden,
+            validations: convertValidations(validations),
             localized: localized
         }),
-        extra
+        fieldSpecificProps
     );
 }
 
-function getDefaultValue(field: ContentFields, defaultLocaleCode: string, editorInterfaceControl?: Control) {
+function getDefaultValue(field: ContentfulField, defaultLocaleCode: string, editorInterfaceControl?: Control) {
     // Contentful defaultValue is an object with locale keys and default values per locale
     const defaultValue = field.defaultValue;
     if (typeof defaultValue !== 'undefined') {
@@ -180,14 +189,14 @@ function getDefaultValue(field: ContentFields, defaultLocaleCode: string, editor
 }
 
 interface ConvertFieldOptions {
-    field: ContentFields;
+    field: ContentfulField;
     editorInterfaceControl?: Control;
     cloudinaryImagesAsList: boolean;
     bynderImagesAsList: boolean;
 }
 
-function convertField({ field, editorInterfaceControl, cloudinaryImagesAsList, bynderImagesAsList }: ConvertFieldOptions) {
-    const typedField = field as ContentFields & ExtendedFieldType;
+function convertField({ field, editorInterfaceControl, cloudinaryImagesAsList, bynderImagesAsList }: ConvertFieldOptions): FieldSpecificProps {
+    const typedField = field;
     const type = typedField.type;
     // return fieldConverterMap[typedField.type](typedField, editorInterfaceControl, cloudinaryImagesAsList);
     switch (typedField.type) {
@@ -221,16 +230,19 @@ function convertField({ field, editorInterfaceControl, cloudinaryImagesAsList, b
 }
 
 type FieldConverterMap = {
-    [P in ExtendedFieldType as P['type']]: (
-        field: ContentFields & P,
+    [CtflField in ContentfulField as CtflField['type']]: (
+        field: CtflField,
         editorInterfaceControl?: Control,
         cloudinaryImagesAsList?: boolean,
         bynderImagesAsList?: boolean
-    ) => Omit<Field, 'name'>;
+    ) => FieldSpecificProps;
 };
 
 const fieldConverterMap: FieldConverterMap = {
-    Symbol: function (field, editorInterfaceControl) {
+    Symbol: function (
+        field,
+        editorInterfaceControl
+    ): StackbitTypes.FieldStringProps | StackbitTypes.FieldSlugProps | StackbitTypes.FieldUrlProps | StackbitTypes.FieldEnumProps {
         const options = getOptions(field);
         if (options) {
             return { type: 'enum', ...options };
@@ -245,55 +257,62 @@ const fieldConverterMap: FieldConverterMap = {
             }
         }
     },
-    Text: function (field, editorInterfaceControl) {
+    Text: function (
+        field,
+        editorInterfaceControl
+    ): StackbitTypes.FieldStringProps | StackbitTypes.FieldTextProps | StackbitTypes.FieldMarkdownProps | StackbitTypes.FieldEnumProps {
         const widgetId = _.get(editorInterfaceControl, 'widgetId');
-        if (widgetId === 'singleLine') {
-            return { type: 'string' };
-        } else if (widgetId === 'multipleLine') {
-            // can also be {type: 'html'} but we have no way of knowing that
-            return { type: 'text' };
-        } else if (widgetId === 'markdown') {
-            return { type: 'markdown' };
-        } else if (widgetId === 'dropdown' || widgetId === 'radio') {
+        const options = getOptions(field);
+        if (options) {
             return {
                 type: 'enum',
-                ...getOptions(field)
+                ...(widgetId === 'radio' ? { controlType: 'button-group' } : null),
+                ...options
             };
+        } else if (widgetId === 'singleLine') {
+            return { type: 'string' };
         } else {
-            return { type: 'text' };
+            if (widgetId === 'multipleLine') {
+                // can also be {type: 'html'} but we have no way of knowing that
+                return { type: 'text' };
+            } else if (widgetId === 'markdown') {
+                return { type: 'markdown' };
+            } else {
+                return { type: 'text' };
+            }
         }
     },
-    Integer: function (field, editorInterfaceControl) {
-        const widgetId = _.get(editorInterfaceControl, 'widgetId');
-        if (widgetId === 'dropdown' || widgetId === 'radio') {
+    Integer: function (field, editorInterfaceControl): StackbitTypes.FieldNumberProps | StackbitTypes.FieldEnumProps {
+        const options = getOptions(field);
+        if (options) {
             return {
                 type: 'enum',
-                ...getOptions(field)
+                ...options
             };
         } else {
             return {
                 type: 'number',
                 subtype: 'int',
-                ...getMinMax(field)
+                ...getMinMax(field) // backward compatibility
             };
         }
     },
-    Number: function (field, editorInterfaceControl) {
-        const widgetId = _.get(editorInterfaceControl, 'widgetId');
-        if (widgetId === 'dropdown' || widgetId === 'radio') {
+    Number: function (field, editorInterfaceControl): StackbitTypes.FieldNumberProps | StackbitTypes.FieldEnumProps {
+        const options = getOptions(field);
+        if (options) {
             return {
                 type: 'enum',
-                ...getOptions(field)
+                ...options
             };
         } else {
             return {
                 type: 'number',
                 subtype: 'float',
-                ...getMinMax(field)
+                ...getMinMax(field) // backward compatibility
             };
         }
     },
-    Date: function (field, editorInterfaceControl) {
+    Date: function (field, editorInterfaceControl): StackbitTypes.FieldDateProps | StackbitTypes.FieldDatetimeProps {
         const format = _.get(editorInterfaceControl, 'settings.format');
         const type = format === 'dateonly' ? 'date' : 'datetime';
         return { type: type };
@@ -301,10 +320,10 @@ const fieldConverterMap: FieldConverterMap = {
     Location: function () {
         return { type: 'json' };
     },
-    Boolean: function () {
+    Boolean: function (): StackbitTypes.FieldBooleanProps {
         return { type: 'boolean' };
     },
-    Link: function (field) {
+    Link: function (field): StackbitTypes.FieldImageProps | StackbitTypes.FieldReferenceProps {
         const linkType = field.linkType;
         if (linkType === 'Asset') {
             return { type: 'image' };
@@ -320,17 +339,17 @@ const fieldConverterMap: FieldConverterMap = {
             throw new Error(`not supported linkType: ${linkType}`);
         }
     },
-    ResourceLink: function (field) {
+    ResourceLink: function (field): StackbitTypes.FieldCrossReferenceProps {
         return {
             type: 'cross-reference',
-            models: field.allowedResources.reduce((models: FieldCrossReferenceModel[], allowedResource) => {
+            models: field.allowedResources.reduce((models: StackbitTypes.FieldCrossReferenceModel[], allowedResource) => {
                 const match = allowedResource.source.match(/crn:contentful:::content:spaces\/(.+)$/);
                 if (!match) {
                     return models;
                 }
                 const spaceId = match[1]!;
                 return models.concat(
-                    allowedResource.contentTypes.reduce((models: FieldCrossReferenceModel[], contentType) => {
+                    allowedResource.contentTypes.reduce((models: StackbitTypes.FieldCrossReferenceModel[], contentType) => {
                         return models.concat({
                             modelName: contentType,
                             srcType: 'contentful',
@@ -341,9 +360,13 @@ const fieldConverterMap: FieldConverterMap = {
             }, [])
         };
     },
-    Array: function (field, editorInterfaceControl) {
+    Array: function (field, editorInterfaceControl): StackbitTypes.FieldListProps {
         const widgetId = _.get(editorInterfaceControl, 'widgetId');
-        const items = getListItems(field);
+        const items = getListItems(field) as StackbitTypes.FieldListItems;
+        const validations = convertValidations(field.items.validations);
+        if (validations) {
+            items.validations = validations;
+        }
         if (widgetId === 'checkbox' && items.type === 'enum') {
             return {
                 type: 'list',
@@ -356,7 +379,7 @@ const fieldConverterMap: FieldConverterMap = {
             items
         };
     },
-    Object: function (field, editorInterfaceControl, cloudinaryImagesAsList, bynderImagesAsList) {
+    Object: function (field, editorInterfaceControl, cloudinaryImagesAsList, bynderImagesAsList): StackbitTypes.FieldSpecificProps {
         const widgetId = _.get(editorInterfaceControl, 'widgetId');
         if (widgetId === CONTENTFUL_CLOUDINARY_APP) {
             if (cloudinaryImagesAsList) {
@@ -411,7 +434,7 @@ const fieldConverterMap: FieldConverterMap = {
     }
 };
 
-function getMinMax(field: ContentFields) {
+function getMinMax(field: ContentfulField) {
     const validations = field.validations;
     const rangeValidation = _.find(validations, 'range');
     return rangeValidation
@@ -422,24 +445,24 @@ function getMinMax(field: ContentFields) {
         : null;
 }
 
-function getOptions(field: ContentFields) {
+function getOptions(field: ContentfulField) {
     const validations = field.validations;
     const inValidation = _.find(validations, 'in');
-    return inValidation ? { options: inValidation.in! } : null;
+    return inValidation?.in && inValidation.in.length > 0 ? { options: inValidation.in } : null;
 }
 
-function getListItems(field: ContentFields & Extract<ExtendedFieldType, { type: 'Array' }>) {
+function getListItems(field: ContentfulField & Extract<ExtendedFieldType, { type: 'Array' }>) {
     const items = field.items;
     const itemType = items.type;
     if (items.type === 'Symbol') {
-        return fieldConverterMap.Symbol(items as ContentFields & Extract<ExtendedFieldType, { type: 'Symbol' }>);
+        return fieldConverterMap.Symbol(items as ContentfulField & Extract<ExtendedFieldType, { type: 'Symbol' }>);
     } else if (items.type === 'Link') {
-        return fieldConverterMap.Link(items as ContentFields & Extract<ExtendedFieldType, { type: 'Link' }>);
+        return fieldConverterMap.Link(items as ContentfulField & Extract<ExtendedFieldType, { type: 'Link' }>);
     } else if (items.type === 'ResourceLink') {
         return fieldConverterMap.ResourceLink({
             ...items,
             allowedResources: (field as ResourceLinkArray).allowedResources
-        } as ContentFields & Extract<ExtendedFieldType, { type: 'ResourceLink' }>);
+        } as ContentfulField & Extract<ExtendedFieldType, { type: 'ResourceLink' }>);
     } else {
         throw new Error(`not supported list items.type: ${itemType}, fieldId: ${field.id}`);
     }
@@ -465,3 +488,141 @@ function resolveLabelFieldForModel(contentType: ContentTypeProps, modelLabelFiel
     }
     return labelField;
 }
+
+type UnionToIntersection<T> = (T extends any ? (x: T) => any : never) extends (x: infer R) => any ? R : never;
+type StackbitFieldValidations =
+    | StackbitTypes.FieldValidationsUnique
+    | StackbitTypes.FieldValidationsRegExp
+    | StackbitTypes.FieldValidationsStringLength
+    | StackbitTypes.FieldValidationsListLength
+    | StackbitTypes.FieldValidationsDateRange
+    | StackbitTypes.FieldValidationsNumberRange
+    | StackbitTypes.FieldValidationsFile
+    | StackbitTypes.FieldValidationsImage;
+type ValidationsIntersection = UnionToIntersection<StackbitFieldValidations>;
+
+function convertValidations(validations: ContentTypeFieldValidation[] | undefined): StackbitTypes.Field['validations'] {
+    if (!validations) {
+        return undefined;
+    }
+    const stackbitValidations: RequiredBy<ValidationsIntersection, 'errors'> = {
+        errors: {}
+    };
+    for (const validation of validations) {
+        if (validation.unique) {
+            stackbitValidations.unique = true;
+        } else if (validation.size) {
+            const size = validation.size;
+            const message = validation.message;
+            if (!_.isNil(size.min)) {
+                (stackbitValidations as StackbitTypes.FieldValidationsStringLength).min = size.min;
+                stackbitValidations.errors.min = message;
+            }
+            if (!_.isNil(size.max)) {
+                (stackbitValidations as StackbitTypes.FieldValidationsStringLength).max = size.max;
+                stackbitValidations.errors.max = message;
+            }
+        } else if (validation.range) {
+            const range = validation.range;
+            const message = validation.message;
+            if (!_.isNil(range.min)) {
+                (stackbitValidations as StackbitTypes.FieldValidationsNumberRange).min = range.min;
+                stackbitValidations.errors.min = message;
+            }
+            if (!_.isNil(range.max)) {
+                (stackbitValidations as StackbitTypes.FieldValidationsNumberRange).max = range.max;
+                stackbitValidations.errors.max = message;
+            }
+        } else if (validation.dateRange) {
+            const dateRange = validation.dateRange;
+            const message = validation.message;
+            if (!_.isNil(dateRange.min)) {
+                (stackbitValidations as StackbitTypes.FieldValidationsDateRange).min = dateRange.min;
+                stackbitValidations.errors.min = message;
+            }
+            if (!_.isNil(dateRange.max)) {
+                (stackbitValidations as StackbitTypes.FieldValidationsDateRange).max = dateRange.max;
+                stackbitValidations.errors.max = message;
+            }
+        } else if (validation.regexp) {
+            stackbitValidations.regexp = validation.regexp.pattern;
+            stackbitValidations.errors.regexp = validation.message;
+        } else if (validation.prohibitRegexp) {
+            stackbitValidations.regexpNot = validation.prohibitRegexp.pattern;
+            stackbitValidations.errors.regexpNot = validation.message;
+        } else if (validation.assetImageDimensions) {
+            const message = validation.message;
+            const { width, height } = validation.assetImageDimensions;
+            stackbitValidations.minWidth = width?.min;
+            stackbitValidations.maxWidth = width?.max;
+            stackbitValidations.minHeight = height?.min;
+            stackbitValidations.maxHeight = height?.max;
+            stackbitValidations.errors.minWidth = _.isNil(width?.min) ? undefined : message;
+            stackbitValidations.errors.maxWidth = _.isNil(width?.max) ? undefined : message;
+            stackbitValidations.errors.minHeight = _.isNil(height?.min) ? undefined : message;
+            stackbitValidations.errors.maxHeight = _.isNil(height?.max) ? undefined : message;
+        } else if (validation.assetFileSize) {
+            const message = validation.message;
+            const { min, max } = validation.assetFileSize;
+            stackbitValidations.fileMinSize = min;
+            stackbitValidations.fileMaxSize = max;
+            stackbitValidations.errors.fileMinSize = _.isNil(min) ? undefined : message;
+            stackbitValidations.errors.fileMaxSize = _.isNil(max) ? undefined : message;
+        } else if (validation.linkMimetypeGroup) {
+            stackbitValidations.fileTypeGroups = convertMimeTypesToFileTypeGroups(validation.linkMimetypeGroup);
+            stackbitValidations.errors.fileTypeGroups = validation.message;
+        }
+    }
+    return undefinedIfEmpty(
+        omitByNil({
+            ...stackbitValidations,
+            errors: undefinedIfEmpty(omitByNil(stackbitValidations.errors))
+        })
+    );
+}
+
+function convertMimeTypesToFileTypeGroups(mimeTypes?: string[]): StackbitTypes.FieldValidationsFileTypesGroup[] | undefined {
+    // contentful mimeTypes:
+    // "image", "audio", "video", "plaintext", "markup", "richtext", "code",
+    // "pdfdocument", "presentation", "spreadsheet", "attachment", "archive"
+    const map: Record<string, StackbitTypes.FieldValidationsFileTypesGroup> = {
+        image: 'image',
+        video: 'video',
+        audio: 'audio',
+        plaintext: 'text',
+        markup: 'markup',
+        code: 'code',
+        pdfdocument: 'document',
+        presentation: 'presentation',
+        spreadsheet: 'spreadsheet',
+        archive: 'archive'
+    };
+    const fileTypeGroups = (mimeTypes ?? []).reduce((accum: StackbitTypes.FieldValidationsFileTypesGroup[], mimeType) => {
+        const fileTypeGroup = map[mimeType];
+        if (fileTypeGroup) {
+            accum.push(fileTypeGroup);
+        }
+        return accum;
+    }, []);
+    return undefinedIfEmpty(fileTypeGroups);
+}
+
+function wrapWithMessageIfNeeded<V extends string | number | string[]>(
+    value: V | undefined,
+    message: string | undefined
+): V | { value: V; message: string } | undefined {
+    if (typeof value === 'undefined' || value === null) {
+        return undefined;
+    }
+    if (message) {
+        return {
+            value,
+            message
+        };
+    }
+    return value;
+}
+
+function undefinedIfEmpty<T extends Record<string, unknown> | unknown[]>(value: T): T | undefined {
+    return _.isEmpty(value) ? undefined : value;
+}