@strapi/content-manager 0.0.0-experimental.86fea32ae4240d73f76516d7238e302b6b927e88 → 0.0.0-experimental.8e4302929d7fe147203ed0266450d0a565c69660

package/dist/server/index.mjs

@@ -1,5 +1,5 @@
-import strapiUtils, { validateYupSchema, errors, async, contentTypes as contentTypes$1, yup as yup$1, validateYupSchemaSync, policy, traverse, setCreatorFields, isOperatorOfType, relations as relations$1, traverseEntity, pagination } from "@strapi/utils";
-import { pick, omit, difference, castArray, intersection, pipe, propOr, isEqual, isEmpty, set, isNil as isNil$1, has, prop, assoc, mapValues, flow, uniq, uniqBy, concat, getOr, propEq, merge, groupBy } from "lodash/fp";
+import strapiUtils, { validateYupSchema, errors, async, contentTypes as contentTypes$1, traverseEntity, yup as yup$1, validateYupSchemaSync, policy, traverse, setCreatorFields, isOperatorOfType, relations as relations$1, pagination } from "@strapi/utils";
+import { pick, omit, difference, castArray, mergeWith, intersection, pipe, propOr, isEqual, isEmpty, set, isNil as isNil$1, has, prop, assoc, mapValues, flow, uniq, uniqBy, concat, getOr, propEq, merge, groupBy } from "lodash/fp";
 import "@strapi/types";
 import * as yup from "yup";
 import { scheduleJob } from "node-schedule";
@@ -7,10 +7,10 @@ import isNil from "lodash/isNil";
 import _, { intersection as intersection$1, difference as difference$1 } from "lodash";
 import qs from "qs";
 import slugify from "@sindresorhus/slugify";
-const getService$1 = (name) => {
+const getService$2 = (name) => {
   return strapi.plugin("content-manager").service(name);
 };
-function getService(strapi2, name) {
+function getService$1(strapi2, name) {
   return strapi2.service(`plugin::content-manager.${name}`);
 }
 const historyRestoreVersionSchema = yup.object().shape({
@@ -46,7 +46,7 @@ const createHistoryVersionController = ({ strapi: strapi2 }) => {
       if (!isSingleType && (!contentTypeUid || !ctx.query.documentId)) {
         throw new errors.ForbiddenError("contentType and documentId are required");
       }
-      const permissionChecker2 = getService$1("permission-checker").create({
+      const permissionChecker2 = getService$2("permission-checker").create({
         userAbility: ctx.state.userAbility,
         model: ctx.query.contentType
       });
@@ -54,7 +54,7 @@ const createHistoryVersionController = ({ strapi: strapi2 }) => {
         return ctx.forbidden();
       }
       const query = await permissionChecker2.sanitizeQuery(ctx.query);
-      const { results, pagination: pagination2 } = await getService(strapi2, "history").findVersionsPage({
+      const { results, pagination: pagination2 } = await getService$1(strapi2, "history").findVersionsPage({
         query: {
           ...query,
           ...getValidPagination({ page: query.page, pageSize: query.pageSize })
@@ -79,14 +79,14 @@ const createHistoryVersionController = ({ strapi: strapi2 }) => {
     async restoreVersion(ctx) {
       const request = ctx.request;
       await validateRestoreVersion(request.body, "contentType is required");
-      const permissionChecker2 = getService$1("permission-checker").create({
+      const permissionChecker2 = getService$2("permission-checker").create({
         userAbility: ctx.state.userAbility,
         model: request.body.contentType
       });
       if (permissionChecker2.cannot.update()) {
         throw new errors.ForbiddenError();
       }
-      const restoredDocument = await getService(strapi2, "history").restoreVersion(
+      const restoredDocument = await getService$1(strapi2, "history").restoreVersion(
         request.params.versionId
       );
       return {
@@ -95,7 +95,7 @@ const createHistoryVersionController = ({ strapi: strapi2 }) => {
     }
   };
 };
-const controllers$1 = {
+const controllers$2 = {
   "history-version": createHistoryVersionController
   /**
    * Casting is needed because the types aren't aware that Strapi supports
@@ -141,8 +141,7 @@ const createServiceUtils = ({ strapi: strapi2 }) => {
   };
   const getRelationRestoreValue = async (versionRelationData, attribute) => {
     if (Array.isArray(versionRelationData)) {
-      if (versionRelationData.length === 0)
-        return versionRelationData;
+      if (versionRelationData.length === 0) return versionRelationData;
       const existingAndMissingRelations = await Promise.all(
         versionRelationData.map((relation) => {
           return strapi2.documents(attribute.target).findOne({
@@ -151,19 +150,16 @@ const createServiceUtils = ({ strapi: strapi2 }) => {
           });
         })
       );
-      return existingAndMissingRelations.filter(
-        (relation) => relation !== null
-      );
+      return existingAndMissingRelations.filter((relation) => relation !== null);
     }
     return strapi2.documents(attribute.target).findOne({
       documentId: versionRelationData.documentId,
       locale: versionRelationData.locale || void 0
     });
   };
-  const getMediaRestoreValue = async (versionRelationData, attribute) => {
-    if (attribute.multiple) {
+  const getMediaRestoreValue = async (versionRelationData) => {
+    if (Array.isArray(versionRelationData)) {
       const existingAndMissingMedias = await Promise.all(
-        // @ts-expect-error Fix the type definitions so this isn't any
         versionRelationData.map((media) => {
           return strapi2.db.query("plugin::upload.file").findOne({ where: { id: media.id } });
         })
@@ -177,8 +173,7 @@ const createServiceUtils = ({ strapi: strapi2 }) => {
   const getDefaultLocale = async () => localesService ? localesService.getDefaultLocale() : null;
   const isLocalizedContentType = (model) => i18nContentTypeService ? i18nContentTypeService.isLocalizedContentType(model) : false;
   const getLocaleDictionary = async () => {
-    if (!localesService)
-      return {};
+    if (!localesService) return {};
     const locales = await localesService.find() || [];
     return locales.reduce(
       (acc, locale) => {
@@ -202,6 +197,17 @@ const createServiceUtils = ({ strapi: strapi2 }) => {
     const meta = await documentMetadataService.getMetadata(contentTypeUid, document);
     return documentMetadataService.getStatus(document, meta.availableStatus);
   };
+  const getComponentFields = (componentUID) => {
+    return Object.entries(strapi2.getModel(componentUID).attributes).reduce(
+      (fieldsAcc, [key, attribute]) => {
+        if (!["relation", "media", "component", "dynamiczone"].includes(attribute.type)) {
+          fieldsAcc.push(key);
+        }
+        return fieldsAcc;
+      },
+      []
+    );
+  };
   const getDeepPopulate2 = (uid2, useDatabaseSyntax = false) => {
     const model = strapi2.getModel(uid2);
     const attributes = Object.entries(model.attributes);
@@ -225,13 +231,19 @@ const createServiceUtils = ({ strapi: strapi2 }) => {
         }
         case "component": {
           const populate = getDeepPopulate2(attribute.component);
-          acc[attributeName] = { populate };
+          acc[attributeName] = {
+            populate,
+            [fieldSelector]: getComponentFields(attribute.component)
+          };
           break;
         }
         case "dynamiczone": {
           const populatedComponents = (attribute.components || []).reduce(
             (acc2, componentUID) => {
-              acc2[componentUID] = { populate: getDeepPopulate2(componentUID) };
+              acc2[componentUID] = {
+                populate: getDeepPopulate2(componentUID),
+                [fieldSelector]: getComponentFields(componentUID)
+              };
               return acc2;
             },
             {}
@@ -316,8 +328,8 @@ const createHistoryService = ({ strapi: strapi2 }) => {
       });
     },
     async findVersionsPage(params) {
-      const model = strapi2.getModel(params.query.contentType);
-      const isLocalizedContentType = serviceUtils.isLocalizedContentType(model);
+      const schema = strapi2.getModel(params.query.contentType);
+      const isLocalizedContentType = serviceUtils.isLocalizedContentType(schema);
       const defaultLocale = await serviceUtils.getDefaultLocale();
       let locale = null;
       if (isLocalizedContentType) {
@@ -338,32 +350,20 @@ const createHistoryService = ({ strapi: strapi2 }) => {
         }),
         serviceUtils.getLocaleDictionary()
       ]);
-      const populateEntryRelations = async (entry) => {
-        const entryWithRelations = await Object.entries(entry.schema).reduce(
-          async (currentDataWithRelations, [attributeKey, attributeSchema]) => {
-            const attributeValue = entry.data[attributeKey];
-            const attributeValues = Array.isArray(attributeValue) ? attributeValue : [attributeValue];
-            if (attributeSchema.type === "media") {
-              const permissionChecker2 = getService$1("permission-checker").create({
-                userAbility: params.state.userAbility,
-                model: "plugin::upload.file"
-              });
-              const response = await serviceUtils.buildMediaResponse(attributeValues);
-              const sanitizedResults = await Promise.all(
-                response.results.map((media) => permissionChecker2.sanitizeOutput(media))
-              );
-              return {
-                ...await currentDataWithRelations,
-                [attributeKey]: {
-                  results: sanitizedResults,
-                  meta: response.meta
-                }
-              };
+      const populateEntry = async (entry) => {
+        return traverseEntity(
+          async (options, utils) => {
+            if (!options.attribute) return;
+            if (!options.value) return;
+            const currentValue = Array.isArray(options.value) ? options.value : [options.value];
+            if (options.attribute.type === "component") {
+              utils.remove("id");
             }
-            if (attributeSchema.type === "relation" && attributeSchema.relation !== "morphToOne" && attributeSchema.relation !== "morphToMany") {
-              if (attributeSchema.target === "admin::user") {
+            if (options.attribute.type === "relation" && // TODO: handle polymorphic relations
+            options.attribute.relation !== "morphToOne" && options.attribute.relation !== "morphToMany") {
+              if (options.attribute.target === "admin::user") {
                 const adminUsers = await Promise.all(
-                  attributeValues.map((userToPopulate) => {
+                  currentValue.map((userToPopulate) => {
                     if (userToPopulate == null) {
                       return null;
                     }
@@ -375,46 +375,51 @@ const createHistoryService = ({ strapi: strapi2 }) => {
                     });
                   })
                 );
-                return {
-                  ...await currentDataWithRelations,
-                  /**
-                   * Ideally we would return the same "{results: [], meta: {}}" shape, however,
-                   * when sanitizing the data as a whole in the controller before sending to the client,
-                   * the data for admin relation user is completely sanitized if we return an object here as opposed to an array.
-                   */
-                  [attributeKey]: adminUsers
-                };
+                utils.set(options.key, adminUsers);
               }
-              const permissionChecker2 = getService$1("permission-checker").create({
+              const permissionChecker2 = getService$2("permission-checker").create({
                 userAbility: params.state.userAbility,
-                model: attributeSchema.target
+                model: options.attribute.target
               });
               const response = await serviceUtils.buildRelationReponse(
-                attributeValues,
-                attributeSchema
+                currentValue,
+                options.attribute
               );
               const sanitizedResults = await Promise.all(
                 response.results.map((media) => permissionChecker2.sanitizeOutput(media))
               );
-              return {
-                ...await currentDataWithRelations,
-                [attributeKey]: {
-                  results: sanitizedResults,
-                  meta: response.meta
-                }
-              };
+              utils.set(options.key, {
+                results: sanitizedResults,
+                meta: response.meta
+              });
             }
-            return currentDataWithRelations;
+            if (options.attribute.type === "media") {
+              const permissionChecker2 = getService$2("permission-checker").create({
+                userAbility: params.state.userAbility,
+                model: "plugin::upload.file"
+              });
+              const response = await serviceUtils.buildMediaResponse(currentValue);
+              const sanitizedResults = await Promise.all(
+                response.results.map((media) => permissionChecker2.sanitizeOutput(media))
+              );
+              utils.set(options.key, {
+                results: sanitizedResults,
+                meta: response.meta
+              });
+            }
+          },
+          {
+            schema,
+            getModel: strapi2.getModel.bind(strapi2)
           },
-          Promise.resolve(entry.data)
+          entry.data
         );
-        return entryWithRelations;
       };
       const formattedResults = await Promise.all(
         results.map(async (result) => {
           return {
             ...result,
-            data: await populateEntryRelations(result),
+            data: await populateEntry(result),
             meta: {
               unknownAttributes: serviceUtils.getSchemaAttributesDiff(
                 result.schema,
@@ -445,30 +450,44 @@ const createHistoryService = ({ strapi: strapi2 }) => {
         // Clone to avoid mutating the original version data
         structuredClone(version.data)
       );
-      const sanitizedSchemaAttributes = omit(
-        FIELDS_TO_IGNORE,
-        contentTypeSchemaAttributes
-      );
-      const reducer = async.reduce(Object.entries(sanitizedSchemaAttributes));
-      const dataWithoutMissingRelations = await reducer(
-        async (previousRelationAttributes, [name, attribute]) => {
-          const versionRelationData = version.data[name];
-          if (!versionRelationData) {
-            return previousRelationAttributes;
+      const schema = structuredClone(version.schema);
+      schema.attributes = omit(FIELDS_TO_IGNORE, contentTypeSchemaAttributes);
+      const dataWithoutMissingRelations = await traverseEntity(
+        async (options, utils) => {
+          if (!options.attribute) return;
+          if (options.attribute.type === "component") {
+            utils.remove("id");
+            if (options.attribute.repeatable && options.value === null) {
+              utils.set(options.key, []);
+            }
           }
-          if (attribute.type === "relation" && // TODO: handle polymorphic relations
-          attribute.relation !== "morphToOne" && attribute.relation !== "morphToMany") {
-            const data2 = await serviceUtils.getRelationRestoreValue(versionRelationData, attribute);
-            previousRelationAttributes[name] = data2;
+          if (options.attribute.type === "dynamiczone") {
+            if (options.value === null) {
+              utils.set(options.key, []);
+            }
           }
-          if (attribute.type === "media") {
-            const data2 = await serviceUtils.getMediaRestoreValue(versionRelationData, attribute);
-            previousRelationAttributes[name] = data2;
+          if (options.attribute.type === "relation" && // TODO: handle polymorphic relations
+          options.attribute.relation !== "morphToOne" && options.attribute.relation !== "morphToMany") {
+            if (!options.value) return;
+            const data2 = await serviceUtils.getRelationRestoreValue(
+              options.value,
+              options.attribute
+            );
+            utils.set(options.key, data2);
+          }
+          if (options.attribute.type === "media") {
+            if (!options.value) return;
+            const data2 = await serviceUtils.getMediaRestoreValue(
+              options.value
+            );
+            utils.set(options.key, data2);
           }
-          return previousRelationAttributes;
         },
-        // Clone to avoid mutating the original version data
-        structuredClone(dataWithoutAddedAttributes)
+        {
+          schema,
+          getModel: strapi2.getModel.bind(strapi2)
+        },
+        dataWithoutAddedAttributes
       );
       const data = omit(["id", ...Object.keys(schemaDiff.removed)], dataWithoutMissingRelations);
       const restoredDocument = await strapi2.documents(version.contentType).update({
@@ -561,7 +580,7 @@ const createLifecyclesService = ({ strapi: strapi2 }) => {
           onCommit(async () => {
             for (const entry of localeEntries) {
               const status = await serviceUtils.getVersionStatus(uid2, entry);
-              await getService(strapi2, "history").createVersion({
+              await getService$1(strapi2, "history").createVersion({
                 contentType: uid2,
                 data: omit(FIELDS_TO_IGNORE, entry),
                 relatedDocumentId: documentId,
@@ -574,15 +593,19 @@ const createLifecyclesService = ({ strapi: strapi2 }) => {
         });
         return result;
       });
-      state.deleteExpiredJob = scheduleJob("0 0 * * *", () => {
+      state.deleteExpiredJob = scheduleJob("historyDaily", "0 0 * * *", () => {
         const retentionDaysInMilliseconds = serviceUtils.getRetentionDays() * 24 * 60 * 60 * 1e3;
         const expirationDate = new Date(Date.now() - retentionDaysInMilliseconds);
         strapi2.db.query(HISTORY_VERSION_UID).deleteMany({
           where: {
             created_at: {
-              $lt: expirationDate.toISOString()
+              $lt: expirationDate
             }
           }
+        }).catch((error) => {
+          if (error instanceof Error) {
+            strapi2.log.error("Error deleting expired history versions", error.message);
+          }
         });
       });
       state.isInitialized = true;
@@ -594,17 +617,17 @@ const createLifecyclesService = ({ strapi: strapi2 }) => {
     }
   };
 };
-const services$1 = {
+const services$2 = {
   history: createHistoryService,
   lifecycles: createLifecyclesService
 };
-const info = { pluginName: "content-manager", type: "admin" };
+const info$1 = { pluginName: "content-manager", type: "admin" };
 const historyVersionRouter = {
   type: "admin",
   routes: [
     {
       method: "GET",
-      info,
+      info: info$1,
       path: "/history-versions",
       handler: "history-version.findMany",
       config: {
@@ -613,7 +636,7 @@ const historyVersionRouter = {
     },
     {
       method: "PUT",
-      info,
+      info: info$1,
       path: "/history-versions/:versionId/restore",
       handler: "history-version.restoreVersion",
       config: {
@@ -622,7 +645,7 @@ const historyVersionRouter = {
     }
   ]
 };
-const routes$1 = {
+const routes$2 = {
   "history-version": historyVersionRouter
 };
 const historyVersion = {
@@ -669,21 +692,21 @@ const historyVersion = {
     }
   }
 };
-const getFeature = () => {
+const getFeature$1 = () => {
   if (strapi.ee.features.isEnabled("cms-content-history")) {
     return {
       register({ strapi: strapi2 }) {
         strapi2.get("models").add(historyVersion);
       },
       bootstrap({ strapi: strapi2 }) {
-        getService(strapi2, "lifecycles").bootstrap();
+        getService$1(strapi2, "lifecycles").bootstrap();
       },
       destroy({ strapi: strapi2 }) {
-        getService(strapi2, "lifecycles").destroy();
+        getService$1(strapi2, "lifecycles").destroy();
       },
-      controllers: controllers$1,
-      services: services$1,
-      routes: routes$1
+      controllers: controllers$2,
+      services: services$2,
+      routes: routes$2
     };
   }
   return {
@@ -692,9 +715,201 @@ const getFeature = () => {
     }
   };
 };
-const history = getFeature();
+const history = getFeature$1();
+const info = { pluginName: "content-manager", type: "admin" };
+const previewRouter = {
+  type: "admin",
+  routes: [
+    {
+      method: "GET",
+      info,
+      path: "/preview/url/:contentType",
+      handler: "preview.getPreviewUrl",
+      config: {
+        policies: ["admin::isAuthenticatedAdmin"]
+      }
+    }
+  ]
+};
+const routes$1 = {
+  preview: previewRouter
+};
+function getService(strapi2, name) {
+  return strapi2.service(`plugin::content-manager.${name}`);
+}
+const getPreviewUrlSchema = yup.object().shape({
+  // Will be undefined for single types
+  documentId: yup.string(),
+  locale: yup.string().nullable(),
+  status: yup.string()
+}).required();
+const validatePreviewUrl = async (strapi2, uid2, params) => {
+  await validateYupSchema(getPreviewUrlSchema)(params);
+  const newParams = pick(["documentId", "locale", "status"], params);
+  const model = strapi2.getModel(uid2);
+  if (!model || model.modelType !== "contentType") {
+    throw new errors.ValidationError("Invalid content type");
+  }
+  const isSingleType = model?.kind === "singleType";
+  if (!isSingleType && !params.documentId) {
+    throw new errors.ValidationError("documentId is required for Collection Types");
+  }
+  if (isSingleType) {
+    const doc = await strapi2.documents(uid2).findFirst();
+    if (!doc) {
+      throw new errors.NotFoundError("Document not found");
+    }
+    newParams.documentId = doc?.documentId;
+  }
+  if (!newParams.status) {
+    const isDPEnabled = model?.options?.draftAndPublish;
+    newParams.status = isDPEnabled ? "draft" : "published";
+  }
+  return newParams;
+};
+const createPreviewController = () => {
+  return {
+    /**
+     * Transforms an entry into a preview URL, so that it can be previewed
+     * in the Content Manager.
+     */
+    async getPreviewUrl(ctx) {
+      const uid2 = ctx.params.contentType;
+      const query = ctx.request.query;
+      const params = await validatePreviewUrl(strapi, uid2, query);
+      const previewService = getService(strapi, "preview");
+      const url = await previewService.getPreviewUrl(uid2, params);
+      if (!url) {
+        ctx.status = 204;
+      }
+      return {
+        data: { url }
+      };
+    }
+  };
+};
+const controllers$1 = {
+  preview: createPreviewController
+  /**
+   * Casting is needed because the types aren't aware that Strapi supports
+   * passing a controller factory as the value, instead of a controller object directly
+   */
+};
+const createPreviewService = ({ strapi: strapi2 }) => {
+  const config = getService(strapi2, "preview-config");
+  return {
+    async getPreviewUrl(uid2, params) {
+      const handler = config.getPreviewHandler();
+      try {
+        return handler(uid2, params);
+      } catch (error) {
+        strapi2.log.error(`Failed to get preview URL: ${error}`);
+        throw new errors.ApplicationError("Failed to get preview URL");
+      }
+      return;
+    }
+  };
+};
+const extendMiddlewareConfiguration = (middleware = { name: "", config: {} }) => {
+  const middlewares = strapi.config.get("middlewares");
+  const configuredMiddlewares = middlewares.map((currentMiddleware) => {
+    if (currentMiddleware === middleware.name) {
+      return middleware;
+    }
+    if (currentMiddleware.name === middleware.name) {
+      return mergeWith(
+        (objValue, srcValue) => {
+          if (Array.isArray(objValue)) {
+            return objValue.concat(srcValue);
+          }
+          return void 0;
+        },
+        currentMiddleware,
+        middleware
+      );
+    }
+    return currentMiddleware;
+  });
+  strapi.config.set("middlewares", configuredMiddlewares);
+};
+const createPreviewConfigService = ({ strapi: strapi2 }) => {
+  return {
+    register() {
+      if (!this.isEnabled()) {
+        return;
+      }
+      const config = strapi2.config.get("admin.preview");
+      if (config.config?.allowedOrigins) {
+        extendMiddlewareConfiguration({
+          name: "strapi::security",
+          config: {
+            contentSecurityPolicy: {
+              directives: {
+                "frame-src": config.config.allowedOrigins
+              }
+            }
+          }
+        });
+      }
+    },
+    isEnabled() {
+      const config = strapi2.config.get("admin.preview");
+      if (!config) {
+        return false;
+      }
+      return config?.enabled ?? true;
+    },
+    /**
+     * Validate if the configuration is valid
+     */
+    validate() {
+      if (!this.isEnabled()) {
+        return;
+      }
+      const handler = this.getPreviewHandler();
+      if (typeof handler !== "function") {
+        throw new errors.ValidationError(
+          "Preview configuration is invalid. Handler must be a function"
+        );
+      }
+    },
+    /**
+     * Utility to get the preview handler from the configuration
+     */
+    getPreviewHandler() {
+      const config = strapi2.config.get("admin.preview");
+      const emptyHandler = () => {
+        return void 0;
+      };
+      if (!this.isEnabled()) {
+        return emptyHandler;
+      }
+      return config?.config?.handler || emptyHandler;
+    }
+  };
+};
+const services$1 = {
+  preview: createPreviewService,
+  "preview-config": createPreviewConfigService
+};
+const getFeature = () => {
+  return {
+    register() {
+      const config = getService(strapi, "preview-config");
+      config.validate();
+      config.register();
+    },
+    bootstrap() {
+    },
+    routes: routes$1,
+    controllers: controllers$1,
+    services: services$1
+  };
+};
+const preview = getFeature();
 const register = async ({ strapi: strapi2 }) => {
   await history.register?.({ strapi: strapi2 });
+  await preview.register?.({ strapi: strapi2 });
 };
 const ALLOWED_WEBHOOK_EVENTS = {
   ENTRY_PUBLISH: "entry.publish",
@@ -704,11 +919,12 @@ const bootstrap = async () => {
   Object.entries(ALLOWED_WEBHOOK_EVENTS).forEach(([key, value]) => {
     strapi.get("webhookStore").addAllowedEvent(key, value);
   });
-  getService$1("field-sizes").setCustomFieldInputSizes();
-  await getService$1("components").syncConfigurations();
-  await getService$1("content-types").syncConfigurations();
-  await getService$1("permission").registerPermissions();
+  getService$2("field-sizes").setCustomFieldInputSizes();
+  await getService$2("components").syncConfigurations();
+  await getService$2("content-types").syncConfigurations();
+  await getService$2("permission").registerPermissions();
   await history.bootstrap?.({ strapi });
+  await preview.bootstrap?.({ strapi });
 };
 const destroy = async ({ strapi: strapi2 }) => {
   await history.destroy?.({ strapi: strapi2 });
@@ -1198,7 +1414,8 @@ const admin = {
 };
 const routes = {
   admin,
-  ...history.routes ? history.routes : {}
+  ...history.routes ? history.routes : {},
+  ...preview.routes ? preview.routes : {}
 };
 const hasPermissionsSchema = yup$1.object({
   actions: yup$1.array().of(yup$1.string()),
@@ -1261,8 +1478,7 @@ const isSortable = (schema, name) => {
   if (!_.has(schema.attributes, name)) {
     return false;
   }
-  if (schema.modelType === "component" && name === "id")
-    return false;
+  if (schema.modelType === "component" && name === "id") return false;
   const attribute = schema.attributes[name];
   if (NON_SORTABLES.includes(attribute.type)) {
     return false;
@@ -1407,8 +1623,7 @@ const createDefaultSettings = async (schema) => {
   };
 };
 const syncSettings = async (configuration, schema) => {
-  if (isEmpty(configuration.settings))
-    return createDefaultSettings(schema);
+  if (isEmpty(configuration.settings)) return createDefaultSettings(schema);
   const defaultField = getDefaultMainField(schema);
   const { mainField = defaultField, defaultSortBy = defaultField } = configuration.settings || {};
   return {
@@ -1455,7 +1670,7 @@ const createMetadasSchema = (schema) => {
             if (!value) {
               return yup$1.string();
             }
-            const targetSchema = getService$1("content-types").findContentType(
+            const targetSchema = getService$2("content-types").findContentType(
               schema.attributes[key].targetModel
             );
             if (!targetSchema) {
@@ -1584,8 +1799,7 @@ const excludeNotCreatableFields = (uid2, permissionChecker2) => (body, path = []
     }
     switch (attribute.type) {
       case "relation": {
-        if (canCreate(attributePath))
-          return body2;
+        if (canCreate(attributePath)) return body2;
         return set(attributePath, { set: [] }, body2);
       }
       case "component": {
@@ -1595,8 +1809,7 @@ const excludeNotCreatableFields = (uid2, permissionChecker2) => (body, path = []
         ]);
       }
       default: {
-        if (canCreate(attributePath))
-          return body2;
+        if (canCreate(attributePath)) return body2;
         return set(attributePath, null, body2);
       }
     }
@@ -1624,7 +1837,7 @@ const getDocumentLocaleAndStatus = async (request, model, opts = { allowMultiple
   }
 };
 const formatDocumentWithMetadata = async (permissionChecker2, uid2, document, opts = {}) => {
-  const documentMetadata2 = getService$1("document-metadata");
+  const documentMetadata2 = getService$2("document-metadata");
   const serviceOutput = await documentMetadata2.formatDocumentWithMetadata(uid2, document, opts);
   let {
     meta: { availableLocales, availableStatus }
@@ -1650,8 +1863,8 @@ const createDocument = async (ctx, opts) => {
   const { userAbility, user } = ctx.state;
   const { model } = ctx.params;
   const { body } = ctx.request;
-  const documentManager2 = getService$1("document-manager");
-  const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+  const documentManager2 = getService$2("document-manager");
+  const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
   if (permissionChecker2.cannot.create()) {
     throw new errors.ForbiddenError();
   }
@@ -1671,13 +1884,13 @@ const updateDocument = async (ctx, opts) => {
   const { userAbility, user } = ctx.state;
   const { id, model } = ctx.params;
   const { body } = ctx.request;
-  const documentManager2 = getService$1("document-manager");
-  const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+  const documentManager2 = getService$2("document-manager");
+  const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
   if (permissionChecker2.cannot.update()) {
     throw new errors.ForbiddenError();
   }
   const permissionQuery = await permissionChecker2.sanitizedQuery.update(ctx.query);
-  const populate = await getService$1("populate-builder")(model).populateFromQuery(permissionQuery).build();
+  const populate = await getService$2("populate-builder")(model).populateFromQuery(permissionQuery).build();
   const { locale } = await getDocumentLocaleAndStatus(body, model);
   const [documentVersion, documentExists] = await Promise.all([
     documentManager2.findOne(id, model, { populate, locale, status: "draft" }),
@@ -1708,14 +1921,14 @@ const collectionTypes = {
     const { userAbility } = ctx.state;
     const { model } = ctx.params;
     const { query } = ctx.request;
-    const documentMetadata2 = getService$1("document-metadata");
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentMetadata2 = getService$2("document-metadata");
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.read()) {
       return ctx.forbidden();
     }
     const permissionQuery = await permissionChecker2.sanitizedQuery.read(query);
-    const populate = await getService$1("populate-builder")(model).populateFromQuery(permissionQuery).populateDeep(1).countRelations({ toOne: false, toMany: true }).build();
+    const populate = await getService$2("populate-builder")(model).populateFromQuery(permissionQuery).populateDeep(1).countRelations({ toOne: false, toMany: true }).build();
     const { locale, status } = await getDocumentLocaleAndStatus(query, model);
     const { results: documents, pagination: pagination2 } = await documentManager2.findPage(
       { ...permissionQuery, populate, locale, status },
@@ -1744,13 +1957,13 @@ const collectionTypes = {
   async findOne(ctx) {
     const { userAbility } = ctx.state;
     const { model, id } = ctx.params;
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.read()) {
       return ctx.forbidden();
     }
     const permissionQuery = await permissionChecker2.sanitizedQuery.read(ctx.query);
-    const populate = await getService$1("populate-builder")(model).populateFromQuery(permissionQuery).populateDeep(Infinity).countRelations().build();
+    const populate = await getService$2("populate-builder")(model).populateFromQuery(permissionQuery).populateDeep(Infinity).countRelations().build();
     const { locale, status } = await getDocumentLocaleAndStatus(ctx.query, model);
     const version = await documentManager2.findOne(id, model, {
       populate,
@@ -1781,7 +1994,7 @@ const collectionTypes = {
   async create(ctx) {
     const { userAbility } = ctx.state;
     const { model } = ctx.params;
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     const [totalEntries, document] = await Promise.all([
       strapi.db.query(model).count(),
       createDocument(ctx)
@@ -1802,7 +2015,7 @@ const collectionTypes = {
   async update(ctx) {
     const { userAbility } = ctx.state;
     const { model } = ctx.params;
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     const updatedVersion = await updateDocument(ctx);
     const sanitizedVersion = await permissionChecker2.sanitizeOutput(updatedVersion);
     ctx.body = await formatDocumentWithMetadata(permissionChecker2, model, sanitizedVersion);
@@ -1811,13 +2024,13 @@ const collectionTypes = {
     const { userAbility, user } = ctx.state;
     const { model, sourceId: id } = ctx.params;
     const { body } = ctx.request;
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.create()) {
       return ctx.forbidden();
     }
     const permissionQuery = await permissionChecker2.sanitizedQuery.create(ctx.query);
-    const populate = await getService$1("populate-builder")(model).populateFromQuery(permissionQuery).build();
+    const populate = await getService$2("populate-builder")(model).populateFromQuery(permissionQuery).build();
     const { locale } = await getDocumentLocaleAndStatus(body, model);
     const document = await documentManager2.findOne(id, model, {
       populate,
@@ -1856,13 +2069,13 @@ const collectionTypes = {
   async delete(ctx) {
     const { userAbility } = ctx.state;
     const { id, model } = ctx.params;
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.delete()) {
       return ctx.forbidden();
     }
     const permissionQuery = await permissionChecker2.sanitizedQuery.delete(ctx.query);
-    const populate = await getService$1("populate-builder")(model).populateFromQuery(permissionQuery).build();
+    const populate = await getService$2("populate-builder")(model).populateFromQuery(permissionQuery).build();
     const { locale } = await getDocumentLocaleAndStatus(ctx.query, model);
     const documentLocales = await documentManager2.findLocales(id, model, { populate, locale });
     if (documentLocales.length === 0) {
@@ -1884,14 +2097,14 @@ const collectionTypes = {
     const { userAbility } = ctx.state;
     const { id, model } = ctx.params;
     const { body } = ctx.request;
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.publish()) {
       return ctx.forbidden();
     }
     const publishedDocument = await strapi.db.transaction(async () => {
       const permissionQuery = await permissionChecker2.sanitizedQuery.publish(ctx.query);
-      const populate = await getService$1("populate-builder")(model).populateFromQuery(permissionQuery).populateDeep(Infinity).countRelations().build();
+      const populate = await getService$2("populate-builder")(model).populateFromQuery(permissionQuery).populateDeep(Infinity).countRelations().build();
       let document;
       const { locale } = await getDocumentLocaleAndStatus(body, model);
       const isCreate = isNil$1(id);
@@ -1939,13 +2152,13 @@ const collectionTypes = {
     const { body } = ctx.request;
     const { documentIds } = body;
     await validateBulkActionInput(body);
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.publish()) {
       return ctx.forbidden();
     }
     const permissionQuery = await permissionChecker2.sanitizedQuery.publish(ctx.query);
-    const populate = await getService$1("populate-builder")(model).populateFromQuery(permissionQuery).populateDeep(Infinity).countRelations().build();
+    const populate = await getService$2("populate-builder")(model).populateFromQuery(permissionQuery).populateDeep(Infinity).countRelations().build();
     const { locale } = await getDocumentLocaleAndStatus(body, model, {
       allowMultipleLocales: true
     });
@@ -1970,8 +2183,8 @@ const collectionTypes = {
     const { body } = ctx.request;
     const { documentIds } = body;
     await validateBulkActionInput(body);
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.unpublish()) {
       return ctx.forbidden();
     }
@@ -2000,8 +2213,8 @@ const collectionTypes = {
     const {
       body: { discardDraft, ...body }
     } = ctx.request;
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.unpublish()) {
       return ctx.forbidden();
     }
@@ -2009,7 +2222,7 @@ const collectionTypes = {
       return ctx.forbidden();
     }
     const permissionQuery = await permissionChecker2.sanitizedQuery.unpublish(ctx.query);
-    const populate = await getService$1("populate-builder")(model).populateFromQuery(permissionQuery).build();
+    const populate = await getService$2("populate-builder")(model).populateFromQuery(permissionQuery).build();
     const { locale } = await getDocumentLocaleAndStatus(body, model);
     const document = await documentManager2.findOne(id, model, {
       populate,
@@ -2040,13 +2253,13 @@ const collectionTypes = {
     const { userAbility } = ctx.state;
     const { id, model } = ctx.params;
     const { body } = ctx.request;
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.discard()) {
       return ctx.forbidden();
     }
     const permissionQuery = await permissionChecker2.sanitizedQuery.discard(ctx.query);
-    const populate = await getService$1("populate-builder")(model).populateFromQuery(permissionQuery).build();
+    const populate = await getService$2("populate-builder")(model).populateFromQuery(permissionQuery).build();
     const { locale } = await getDocumentLocaleAndStatus(body, model);
     const document = await documentManager2.findOne(id, model, {
       populate,
@@ -2071,13 +2284,13 @@ const collectionTypes = {
     const { query, body } = ctx.request;
     const { documentIds } = body;
     await validateBulkActionInput(body);
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.delete()) {
       return ctx.forbidden();
     }
     const permissionQuery = await permissionChecker2.sanitizedQuery.delete(query);
-    const populate = await getService$1("populate-builder")(model).populateFromQuery(permissionQuery).build();
+    const populate = await getService$2("populate-builder")(model).populateFromQuery(permissionQuery).build();
     const { locale } = await getDocumentLocaleAndStatus(body, model);
     const documentLocales = await documentManager2.findLocales(documentIds, model, {
       populate,
@@ -2098,13 +2311,13 @@ const collectionTypes = {
   async countDraftRelations(ctx) {
     const { userAbility } = ctx.state;
     const { model, id } = ctx.params;
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.read()) {
       return ctx.forbidden();
     }
     const permissionQuery = await permissionChecker2.sanitizedQuery.read(ctx.query);
-    const populate = await getService$1("populate-builder")(model).populateFromQuery(permissionQuery).build();
+    const populate = await getService$2("populate-builder")(model).populateFromQuery(permissionQuery).build();
     const { locale, status } = await getDocumentLocaleAndStatus(ctx.query, model);
     const entity = await documentManager2.findOne(id, model, { populate, locale, status });
     if (!entity) {
@@ -2123,8 +2336,8 @@ const collectionTypes = {
     const ids = ctx.request.query.documentIds;
     const locale = ctx.request.query.locale;
     const { model } = ctx.params;
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.read()) {
       return ctx.forbidden();
     }
@@ -2148,13 +2361,13 @@ const collectionTypes = {
 };
 const components$1 = {
   findComponents(ctx) {
-    const components2 = getService$1("components").findAllComponents();
-    const { toDto } = getService$1("data-mapper");
+    const components2 = getService$2("components").findAllComponents();
+    const { toDto } = getService$2("data-mapper");
     ctx.body = { data: components2.map(toDto) };
   },
   async findComponentConfiguration(ctx) {
     const { uid: uid2 } = ctx.params;
-    const componentService = getService$1("components");
+    const componentService = getService$2("components");
     const component = componentService.findComponent(uid2);
     if (!component) {
       return ctx.notFound("component.notFound");
@@ -2171,7 +2384,7 @@ const components$1 = {
   async updateComponentConfiguration(ctx) {
     const { uid: uid2 } = ctx.params;
     const { body } = ctx.request;
-    const componentService = getService$1("components");
+    const componentService = getService$2("components");
     const component = componentService.findComponent(uid2);
     if (!component) {
       return ctx.notFound("component.notFound");
@@ -2205,12 +2418,12 @@ const contentTypes = {
     } catch (error) {
       return ctx.send({ error }, 400);
     }
-    const contentTypes2 = getService$1("content-types").findContentTypesByKind(kind);
-    const { toDto } = getService$1("data-mapper");
+    const contentTypes2 = getService$2("content-types").findContentTypesByKind(kind);
+    const { toDto } = getService$2("data-mapper");
     ctx.body = { data: contentTypes2.map(toDto) };
   },
   async findContentTypesSettings(ctx) {
-    const { findAllContentTypes, findConfiguration } = getService$1("content-types");
+    const { findAllContentTypes, findConfiguration } = getService$2("content-types");
     const contentTypes2 = await findAllContentTypes();
     const configurations = await Promise.all(
       contentTypes2.map(async (contentType) => {
@@ -2224,7 +2437,7 @@ const contentTypes = {
   },
   async findContentTypeConfiguration(ctx) {
     const { uid: uid2 } = ctx.params;
-    const contentTypeService = getService$1("content-types");
+    const contentTypeService = getService$2("content-types");
     const contentType = await contentTypeService.findContentType(uid2);
     if (!contentType) {
       return ctx.notFound("contentType.notFound");
@@ -2246,13 +2459,13 @@ const contentTypes = {
     const { userAbility } = ctx.state;
     const { uid: uid2 } = ctx.params;
     const { body } = ctx.request;
-    const contentTypeService = getService$1("content-types");
-    const metricsService = getService$1("metrics");
+    const contentTypeService = getService$2("content-types");
+    const metricsService = getService$2("metrics");
     const contentType = await contentTypeService.findContentType(uid2);
     if (!contentType) {
       return ctx.notFound("contentType.notFound");
     }
-    if (!getService$1("permission").canConfigureContentType({ userAbility, contentType })) {
+    if (!getService$2("permission").canConfigureContentType({ userAbility, contentType })) {
       return ctx.forbidden();
     }
     let input;
@@ -2285,10 +2498,10 @@ const contentTypes = {
 };
 const init = {
   getInitData(ctx) {
-    const { toDto } = getService$1("data-mapper");
-    const { findAllComponents } = getService$1("components");
-    const { getAllFieldSizes } = getService$1("field-sizes");
-    const { findAllContentTypes } = getService$1("content-types");
+    const { toDto } = getService$2("data-mapper");
+    const { findAllComponents } = getService$2("components");
+    const { getAllFieldSizes } = getService$2("field-sizes");
+    const { findAllContentTypes } = getService$2("content-types");
     ctx.body = {
       data: {
         fieldSizes: getAllFieldSizes(),
@@ -2324,7 +2537,7 @@ const addFiltersClause = (params, filtersClause) => {
   params.filters.$and.push(filtersClause);
 };
 const sanitizeMainField = (model, mainField, userAbility) => {
-  const permissionChecker2 = getService$1("permission-checker").create({
+  const permissionChecker2 = getService$2("permission-checker").create({
     userAbility,
     model: model.uid
   });
@@ -2338,15 +2551,27 @@ const sanitizeMainField = (model, mainField, userAbility) => {
   }
   return mainField;
 };
-const addStatusToRelations = async (uid2, relations2) => {
-  if (!contentTypes$1.hasDraftAndPublish(strapi.contentTypes[uid2])) {
+const addStatusToRelations = async (targetUid, relations2) => {
+  if (!contentTypes$1.hasDraftAndPublish(strapi.getModel(targetUid))) {
     return relations2;
   }
-  const documentMetadata2 = getService$1("document-metadata");
-  const documentsAvailableStatus = await documentMetadata2.getManyAvailableStatus(uid2, relations2);
+  const documentMetadata2 = getService$2("document-metadata");
+  if (!relations2.length) {
+    return relations2;
+  }
+  const firstRelation = relations2[0];
+  const filters = {
+    documentId: { $in: relations2.map((r) => r.documentId) },
+    // NOTE: find the "opposite" status
+    publishedAt: firstRelation.publishedAt !== null ? { $null: true } : { $notNull: true }
+  };
+  const availableStatus = await strapi.query(targetUid).findMany({
+    select: ["id", "documentId", "locale", "updatedAt", "createdAt", "publishedAt"],
+    filters
+  });
   return relations2.map((relation) => {
-    const availableStatuses = documentsAvailableStatus.filter(
-      (availableDocument) => availableDocument.documentId === relation.documentId
+    const availableStatuses = availableStatus.filter(
+      (availableDocument) => availableDocument.documentId === relation.documentId && (relation.locale ? availableDocument.locale === relation.locale : true)
     );
     return {
       ...relation,
@@ -2377,8 +2602,7 @@ const validateStatus = (sourceUid, status) => {
   const sourceModel = strapi.getModel(sourceUid);
   const isDP = contentTypes$1.hasDraftAndPublish;
   const isSourceDP = isDP(sourceModel);
-  if (!isSourceDP)
-    return { status: void 0 };
+  if (!isSourceDP) return { status: void 0 };
   switch (status) {
     case "published":
       return { status: "published" };
@@ -2408,7 +2632,7 @@ const relations = {
       ctx.request?.query?.locale
     );
     const { status } = validateStatus(sourceUid, ctx.request?.query?.status);
-    const permissionChecker2 = getService$1("permission-checker").create({
+    const permissionChecker2 = getService$2("permission-checker").create({
       userAbility,
       model
     });
@@ -2433,7 +2657,7 @@ const relations = {
         where.id = id;
       }
       const permissionQuery = await permissionChecker2.sanitizedQuery.read(ctx.query);
-      const populate = await getService$1("populate-builder")(model).populateFromQuery(permissionQuery).build();
+      const populate = await getService$2("populate-builder")(model).populateFromQuery(permissionQuery).build();
       const currentEntity = await strapi.db.query(model).findOne({
         where,
         populate
@@ -2448,7 +2672,7 @@ const relations = {
       }
       entryId = currentEntity.id;
     }
-    const modelConfig = isComponent2 ? await getService$1("components").findConfiguration(sourceSchema) : await getService$1("content-types").findConfiguration(sourceSchema);
+    const modelConfig = isComponent2 ? await getService$2("components").findConfiguration(sourceSchema) : await getService$2("content-types").findConfiguration(sourceSchema);
     const targetSchema = strapi.getModel(targetUid);
     const mainField = flow(
       prop(`metadatas.${targetField}.edit.mainField`),
@@ -2502,7 +2726,7 @@ const relations = {
       }
     } = await this.extractAndValidateRequestInfo(ctx, id);
     const { idsToOmit, idsToInclude, _q, ...query } = ctx.request.query;
-    const permissionChecker2 = getService$1("permission-checker").create({
+    const permissionChecker2 = getService$2("permission-checker").create({
       userAbility: ctx.state.userAbility,
       model: targetUid
     });
@@ -2575,21 +2799,33 @@ const relations = {
       attribute,
       targetField,
       fieldsToSelect,
-      source: {
-        schema: { uid: sourceUid }
-      },
-      target: {
-        schema: { uid: targetUid }
-      }
+      status,
+      source: { schema: sourceSchema },
+      target: { schema: targetSchema }
     } = await this.extractAndValidateRequestInfo(ctx, id);
-    const permissionQuery = await getService$1("permission-checker").create({ userAbility, model: targetUid }).sanitizedQuery.read({ fields: fieldsToSelect });
+    const { uid: sourceUid } = sourceSchema;
+    const { uid: targetUid } = targetSchema;
+    const permissionQuery = await getService$2("permission-checker").create({ userAbility, model: targetUid }).sanitizedQuery.read({ fields: fieldsToSelect });
     const dbQuery = strapi.db.query(sourceUid);
     const loadRelations = relations$1.isAnyToMany(attribute) ? (...args) => dbQuery.loadPages(...args) : (...args) => dbQuery.load(...args).then((res2) => ({ results: res2 ? [res2] : [] }));
+    const filters = {};
+    if (sourceSchema?.options?.draftAndPublish) {
+      if (targetSchema?.options?.draftAndPublish) {
+        if (status === "published") {
+          filters.publishedAt = { $notNull: true };
+        } else {
+          filters.publishedAt = { $null: true };
+        }
+      }
+    } else if (targetSchema?.options?.draftAndPublish) {
+      filters.publishedAt = { $null: true };
+    }
     const res = await loadRelations({ id: entryId }, targetField, {
-      select: ["id", "documentId", "locale", "publishedAt"],
+      select: ["id", "documentId", "locale", "publishedAt", "updatedAt"],
       ordering: "desc",
       page: ctx.request.query.page,
-      pageSize: ctx.request.query.pageSize
+      pageSize: ctx.request.query.pageSize,
+      filters
     });
     const loadedIds = res.results.map((item) => item.id);
     addFiltersClause(permissionQuery, { id: { $in: loadedIds } });
@@ -2597,12 +2833,7 @@ const relations = {
       ...strapi.get("query-params").transform(targetUid, permissionQuery),
       ordering: "desc"
     });
-    const relationsUnion = uniqBy(
-      (res2) => {
-        return res2.locale ? `${res2.documentId}-${res2.locale}` : `${res2.documentId}-`;
-      },
-      concat(sanitizedRes.results, res.results)
-    );
+    const relationsUnion = uniqBy("id", concat(sanitizedRes.results, res.results));
     ctx.body = {
       pagination: res.pagination || {
         page: 1,
@@ -2615,10 +2846,10 @@ const relations = {
   }
 };
 const buildPopulateFromQuery = async (query, model) => {
-  return getService$1("populate-builder")(model).populateFromQuery(query).populateDeep(Infinity).countRelations().build();
+  return getService$2("populate-builder")(model).populateFromQuery(query).populateDeep(Infinity).countRelations().build();
 };
 const findDocument = async (query, uid2, opts = {}) => {
-  const documentManager2 = getService$1("document-manager");
+  const documentManager2 = getService$2("document-manager");
   const populate = await buildPopulateFromQuery(query, uid2);
   return documentManager2.findMany({ ...opts, populate }, uid2).then((documents) => documents[0]);
 };
@@ -2626,8 +2857,8 @@ const createOrUpdateDocument = async (ctx, opts) => {
   const { user, userAbility } = ctx.state;
   const { model } = ctx.params;
   const { body, query } = ctx.request;
-  const documentManager2 = getService$1("document-manager");
-  const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+  const documentManager2 = getService$2("document-manager");
+  const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
   if (permissionChecker2.cannot.create() && permissionChecker2.cannot.update()) {
     throw new errors.ForbiddenError();
   }
@@ -2668,7 +2899,7 @@ const singleTypes = {
     const { userAbility } = ctx.state;
     const { model } = ctx.params;
     const { query = {} } = ctx.request;
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.read()) {
       return ctx.forbidden();
     }
@@ -2702,7 +2933,7 @@ const singleTypes = {
   async createOrUpdate(ctx) {
     const { userAbility } = ctx.state;
     const { model } = ctx.params;
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     const document = await createOrUpdateDocument(ctx);
     const sanitizedDocument = await permissionChecker2.sanitizeOutput(document);
     ctx.body = await formatDocumentWithMetadata(permissionChecker2, model, sanitizedDocument);
@@ -2711,8 +2942,8 @@ const singleTypes = {
     const { userAbility } = ctx.state;
     const { model } = ctx.params;
     const { query = {} } = ctx.request;
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.delete()) {
       return ctx.forbidden();
     }
@@ -2740,8 +2971,8 @@ const singleTypes = {
     const { userAbility } = ctx.state;
     const { model } = ctx.params;
     const { query = {} } = ctx.request;
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.publish()) {
       return ctx.forbidden();
     }
@@ -2769,8 +3000,8 @@ const singleTypes = {
       body: { discardDraft, ...body },
       query = {}
     } = ctx.request;
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.unpublish()) {
       return ctx.forbidden();
     }
@@ -2804,8 +3035,8 @@ const singleTypes = {
     const { userAbility } = ctx.state;
     const { model } = ctx.params;
     const { body, query = {} } = ctx.request;
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     if (permissionChecker2.cannot.discard()) {
       return ctx.forbidden();
     }
@@ -2828,8 +3059,8 @@ const singleTypes = {
     const { userAbility } = ctx.state;
     const { model } = ctx.params;
     const { query } = ctx.request;
-    const documentManager2 = getService$1("document-manager");
-    const permissionChecker2 = getService$1("permission-checker").create({ userAbility, model });
+    const documentManager2 = getService$2("document-manager");
+    const permissionChecker2 = getService$2("permission-checker").create({ userAbility, model });
     const { locale } = await getDocumentLocaleAndStatus(query, model);
     if (permissionChecker2.cannot.read()) {
       return ctx.forbidden();
@@ -2853,7 +3084,7 @@ const uid$1 = {
     const { query = {} } = ctx.request;
     const { locale } = await getDocumentLocaleAndStatus(query, contentTypeUID);
     await validateUIDField(contentTypeUID, field);
-    const uidService = getService$1("uid");
+    const uidService = getService$2("uid");
     ctx.body = {
       data: await uidService.generateUIDField({ contentTypeUID, field, data, locale })
     };
@@ -2865,7 +3096,7 @@ const uid$1 = {
     const { query = {} } = ctx.request;
     const { locale } = await getDocumentLocaleAndStatus(query, contentTypeUID);
     await validateUIDField(contentTypeUID, field);
-    const uidService = getService$1("uid");
+    const uidService = getService$2("uid");
     const isAvailable = await uidService.checkUIDAvailability({
       contentTypeUID,
       field,
@@ -2886,7 +3117,8 @@ const controllers = {
   relations,
   "single-types": singleTypes,
   uid: uid$1,
-  ...history.controllers ? history.controllers : {}
+  ...history.controllers ? history.controllers : {},
+  ...preview.controllers ? preview.controllers : {}
 };
 const keys = {
   CONFIGURATION: "configuration"
@@ -3015,18 +3247,15 @@ async function syncMetadatas(configuration, schema) {
       _.set(updatedMeta, ["list", "searchable"], false);
       _.set(acc, [key], updatedMeta);
     }
-    if (!_.has(edit, "mainField"))
-      return acc;
+    if (!_.has(edit, "mainField")) return acc;
     if (!isRelation$1(attr)) {
       _.set(updatedMeta, "edit", _.omit(edit, ["mainField"]));
       _.set(acc, [key], updatedMeta);
       return acc;
     }
-    if (edit.mainField === "id")
-      return acc;
+    if (edit.mainField === "id") return acc;
     const targetSchema = getTargetSchema(attr.targetModel);
-    if (!targetSchema)
-      return acc;
+    if (!targetSchema) return acc;
     if (!isSortable(targetSchema, edit.mainField) && !isListable(targetSchema, edit.mainField)) {
       _.set(updatedMeta, ["edit", "mainField"], getDefaultMainField(targetSchema));
       _.set(acc, [key], updatedMeta);
@@ -3037,12 +3266,12 @@ async function syncMetadatas(configuration, schema) {
   return _.assign(metasWithDefaults, updatedMetas);
 }
 const getTargetSchema = (targetModel) => {
-  return getService$1("content-types").findContentType(targetModel);
+  return getService$2("content-types").findContentType(targetModel);
 };
 const DEFAULT_LIST_LENGTH = 4;
 const MAX_ROW_SIZE = 12;
 const isAllowedFieldSize = (type, size) => {
-  const { getFieldSize } = getService$1("field-sizes");
+  const { getFieldSize } = getService$2("field-sizes");
   const fieldSize = getFieldSize(type);
   if (!fieldSize.isResizable && size !== fieldSize.default) {
     return false;
@@ -3050,7 +3279,7 @@ const isAllowedFieldSize = (type, size) => {
   return size <= MAX_ROW_SIZE;
 };
 const getDefaultFieldSize = (attribute) => {
-  const { hasFieldSize, getFieldSize } = getService$1("field-sizes");
+  const { hasFieldSize, getFieldSize } = getService$2("field-sizes");
   return getFieldSize(hasFieldSize(attribute.customField) ? attribute.customField : attribute.type).default;
 };
 async function createDefaultLayouts(schema) {
@@ -3071,8 +3300,7 @@ function createDefaultEditLayout(schema) {
   return appendToEditLayout([], keys2, schema);
 }
 function syncLayouts(configuration, schema) {
-  if (_.isEmpty(configuration.layouts))
-    return createDefaultLayouts(schema);
+  if (_.isEmpty(configuration.layouts)) return createDefaultLayouts(schema);
   const { list = [], editRelations = [], edit = [] } = configuration.layouts || {};
   let cleanList = list.filter((attr) => isListable(schema, attr));
   const cleanEditRelations = editRelations.filter(
@@ -3083,9 +3311,8 @@ function syncLayouts(configuration, schema) {
   for (const row of edit) {
     const newRow = [];
     for (const el of row) {
-      if (!hasEditableAttribute(schema, el.name))
-        continue;
-      const { hasFieldSize } = getService$1("field-sizes");
+      if (!hasEditableAttribute(schema, el.name)) continue;
+      const { hasFieldSize } = getService$2("field-sizes");
       const fieldType = hasFieldSize(schema.attributes[el.name].customField) ? schema.attributes[el.name].customField : schema.attributes[el.name].type;
       if (!isAllowedFieldSize(fieldType, el.size)) {
         elementsToReAppend.push(el.name);
@@ -3115,8 +3342,7 @@ function syncLayouts(configuration, schema) {
   };
 }
 const appendToEditLayout = (layout = [], keysToAppend, schema) => {
-  if (keysToAppend.length === 0)
-    return layout;
+  if (keysToAppend.length === 0) return layout;
   let currentRowIndex = Math.max(layout.length - 1, 0);
   if (!layout[currentRowIndex]) {
     layout[currentRowIndex] = [];
@@ -3225,17 +3451,17 @@ const configurationService$1 = createConfigurationService({
   isComponent: true,
   prefix: STORE_KEY_PREFIX,
   getModels() {
-    const { toContentManagerModel } = getService$1("data-mapper");
+    const { toContentManagerModel } = getService$2("data-mapper");
     return mapValues(toContentManagerModel, strapi.components);
   }
 });
 const components = ({ strapi: strapi2 }) => ({
   findAllComponents() {
-    const { toContentManagerModel } = getService$1("data-mapper");
+    const { toContentManagerModel } = getService$2("data-mapper");
     return Object.values(strapi2.components).map(toContentManagerModel);
   },
   findComponent(uid2) {
-    const { toContentManagerModel } = getService$1("data-mapper");
+    const { toContentManagerModel } = getService$2("data-mapper");
     const component = strapi2.components[uid2];
     return isNil$1(component) ? component : toContentManagerModel(component);
   },
@@ -3286,17 +3512,17 @@ const configurationService = createConfigurationService({
   storeUtils,
   prefix: "content_types",
   getModels() {
-    const { toContentManagerModel } = getService$1("data-mapper");
+    const { toContentManagerModel } = getService$2("data-mapper");
     return mapValues(toContentManagerModel, strapi.contentTypes);
   }
 });
 const service = ({ strapi: strapi2 }) => ({
   findAllContentTypes() {
-    const { toContentManagerModel } = getService$1("data-mapper");
+    const { toContentManagerModel } = getService$2("data-mapper");
     return Object.values(strapi2.contentTypes).map(toContentManagerModel);
   },
   findContentType(uid2) {
-    const { toContentManagerModel } = getService$1("data-mapper");
+    const { toContentManagerModel } = getService$2("data-mapper");
     const contentType = strapi2.contentTypes[uid2];
     return isNil$1(contentType) ? contentType : toContentManagerModel(contentType);
   },
@@ -3325,7 +3551,7 @@ const service = ({ strapi: strapi2 }) => ({
     return this.findConfiguration(contentType);
   },
   findComponentsConfigurations(contentType) {
-    return getService$1("components").findComponentsConfigurations(contentType);
+    return getService$2("components").findComponentsConfigurations(contentType);
   },
   syncConfigurations() {
     return configurationService.syncConfigurations();
@@ -3597,7 +3823,7 @@ const permission = ({ strapi: strapi2 }) => ({
     return userAbility.can(action);
   },
   async registerPermissions() {
-    const displayedContentTypes = getService$1("content-types").findDisplayedContentTypes();
+    const displayedContentTypes = getService$2("content-types").findDisplayedContentTypes();
     const contentTypesUids = displayedContentTypes.map(prop("uid"));
     const actions = [
       {
@@ -3682,6 +3908,12 @@ function getPopulateForRelation(attribute, model, attributeName, { countMany, co
   if (initialPopulate) {
     return initialPopulate;
   }
+  if (attributeName === "localizations") {
+    const validationPopulate = getPopulateForValidation(model.uid);
+    return {
+      populate: validationPopulate.populate
+    };
+  }
   if (!isVisibleAttribute$1(model, attributeName)) {
     return true;
   }
@@ -3741,6 +3973,9 @@ const getDeepPopulate = (uid2, {
     return {};
   }
   const model = strapi.getModel(uid2);
+  if (!model) {
+    return {};
+  }
   return Object.keys(model.attributes).reduce(
     (populateAcc, attributeName) => merge(
       populateAcc,
@@ -3760,40 +3995,46 @@ const getDeepPopulate = (uid2, {
     {}
   );
 };
-const getValidatableFieldsPopulate = (uid2, {
-  initialPopulate = {},
-  countMany = false,
-  countOne = false,
-  maxLevel = Infinity
-} = {}, level = 1) => {
-  if (level > maxLevel) {
+const getPopulateForValidation = (uid2) => {
+  const model = strapi.getModel(uid2);
+  if (!model) {
     return {};
   }
-  const model = strapi.getModel(uid2);
   return Object.entries(model.attributes).reduce((populateAcc, [attributeName, attribute]) => {
-    if (!getDoesAttributeRequireValidation(attribute)) {
+    if (isScalarAttribute(attribute)) {
+      if (getDoesAttributeRequireValidation(attribute)) {
+        populateAcc.fields = populateAcc.fields || [];
+        populateAcc.fields.push(attributeName);
+      }
       return populateAcc;
     }
-    if (isScalarAttribute(attribute)) {
-      return merge(populateAcc, {
-        [attributeName]: true
-      });
+    if (isComponent(attribute)) {
+      const component = attribute.component;
+      const componentResult = getPopulateForValidation(component);
+      if (Object.keys(componentResult).length > 0) {
+        populateAcc.populate = populateAcc.populate || {};
+        populateAcc.populate[attributeName] = componentResult;
+      }
+      return populateAcc;
     }
-    return merge(
-      populateAcc,
-      getPopulateFor(
-        attributeName,
-        model,
-        {
-          // @ts-expect-error - improve types
-          initialPopulate: initialPopulate?.[attributeName],
-          countMany,
-          countOne,
-          maxLevel
+    if (isDynamicZone(attribute)) {
+      const components2 = attribute.components;
+      const componentsResult = (components2 || []).reduce(
+        (acc, componentUID) => {
+          const componentResult = getPopulateForValidation(componentUID);
+          if (Object.keys(componentResult).length > 0) {
+            acc[componentUID] = componentResult;
+          }
+          return acc;
         },
-        level
-      )
-    );
+        {}
+      );
+      if (Object.keys(componentsResult).length > 0) {
+        populateAcc.populate = populateAcc.populate || {};
+        populateAcc.populate[attributeName] = { on: componentsResult };
+      }
+    }
+    return populateAcc;
   }, {});
 };
 const getDeepPopulateDraftCount = (uid2) => {
@@ -3873,7 +4114,7 @@ const getQueryPopulate = async (uid2, query) => {
   return populateQuery;
 };
 const buildDeepPopulate = (uid2) => {
-  return getService$1("populate-builder")(uid2).populateDeep(Infinity).countRelations().build();
+  return getService$2("populate-builder")(uid2).populateDeep(Infinity).countRelations().build();
 };
 const populateBuilder = (uid2) => {
   let getInitialPopulate = async () => {
@@ -4035,7 +4276,6 @@ const AVAILABLE_LOCALES_FIELDS = [
   "locale",
   "updatedAt",
   "createdAt",
-  "status",
   "publishedAt",
   "documentId"
 ];
@@ -4056,34 +4296,20 @@ const documentMetadata = ({ strapi: strapi2 }) => ({
   /**
    * Returns available locales of a document for the current status
    */
-  async getAvailableLocales(uid2, version, allVersions, validatableFields = []) {
+  async getAvailableLocales(uid2, version, allVersions) {
     const versionsByLocale = groupBy("locale", allVersions);
-    delete versionsByLocale[version.locale];
+    if (version.locale) {
+      delete versionsByLocale[version.locale];
+    }
     const model = strapi2.getModel(uid2);
-    const keysToKeep = [...AVAILABLE_LOCALES_FIELDS, ...validatableFields];
-    const traversalFunction = async (localeVersion) => traverseEntity(
-      ({ key }, { remove }) => {
-        if (keysToKeep.includes(key)) {
-          return;
-        }
-        remove(key);
-      },
-      { schema: model, getModel: strapi2.getModel.bind(strapi2) },
-      // @ts-expect-error fix types DocumentVersion incompatible with Data
-      localeVersion
-    );
     const mappingResult = await async.map(
       Object.values(versionsByLocale),
       async (localeVersions) => {
-        const mappedLocaleVersions = await async.map(
-          localeVersions,
-          traversalFunction
-        );
         if (!contentTypes$1.hasDraftAndPublish(model)) {
-          return mappedLocaleVersions[0];
+          return localeVersions[0];
         }
-        const draftVersion = mappedLocaleVersions.find((v) => v.publishedAt === null);
-        const otherVersions = mappedLocaleVersions.filter((v) => v.id !== draftVersion?.id);
+        const draftVersion = localeVersions.find((v) => v.publishedAt === null);
+        const otherVersions = localeVersions.filter((v) => v.id !== draftVersion?.id);
         if (!draftVersion) {
           return;
         }
@@ -4105,8 +4331,7 @@ const documentMetadata = ({ strapi: strapi2 }) => ({
       const matchStatus = status === "published" ? v.publishedAt !== null : v.publishedAt === null;
       return matchLocale && matchStatus;
     });
-    if (!availableStatus)
-      return availableStatus;
+    if (!availableStatus) return availableStatus;
     return pick(AVAILABLE_STATUS_FIELDS, availableStatus);
   },
   /**
@@ -4116,18 +4341,19 @@ const documentMetadata = ({ strapi: strapi2 }) => ({
    * @returns
    */
   async getManyAvailableStatus(uid2, documents) {
-    if (!documents.length)
-      return [];
+    if (!documents.length) return [];
     const status = documents[0].publishedAt !== null ? "published" : "draft";
-    const locale = documents[0]?.locale;
-    const otherStatus = status === "published" ? "draft" : "published";
-    return strapi2.documents(uid2).findMany({
-      filters: {
-        documentId: { $in: documents.map((d) => d.documentId).filter(Boolean) }
-      },
-      status: otherStatus,
-      locale,
-      fields: ["documentId", "locale", "updatedAt", "createdAt", "publishedAt"]
+    const locales = documents.map((d) => d.locale).filter(Boolean);
+    const where = {
+      documentId: { $in: documents.map((d) => d.documentId).filter(Boolean) },
+      publishedAt: { $null: status === "published" }
+    };
+    if (locales.length) {
+      where.locale = { $in: locales };
+    }
+    return strapi2.query(uid2).findMany({
+      where,
+      select: ["id", "documentId", "locale", "updatedAt", "createdAt", "publishedAt"]
     });
   },
   getStatus(version, otherDocumentStatuses) {
@@ -4144,10 +4370,8 @@ const documentMetadata = ({ strapi: strapi2 }) => ({
     } else if (otherVersion) {
       draftVersion = otherVersion;
     }
-    if (!draftVersion)
-      return CONTENT_MANAGER_STATUS.PUBLISHED;
-    if (!publishedVersion)
-      return CONTENT_MANAGER_STATUS.DRAFT;
+    if (!draftVersion) return CONTENT_MANAGER_STATUS.PUBLISHED;
+    if (!publishedVersion) return CONTENT_MANAGER_STATUS.DRAFT;
     const isDraftModified = getIsVersionLatestModification(draftVersion, publishedVersion);
     return isDraftModified ? CONTENT_MANAGER_STATUS.MODIFIED : CONTENT_MANAGER_STATUS.PUBLISHED;
   },
@@ -4155,11 +4379,9 @@ const documentMetadata = ({ strapi: strapi2 }) => ({
   // We could refactor this so the locales are only loaded when they're
   // needed. e.g. in the bulk locale action modal.
   async getMetadata(uid2, version, { availableLocales = true, availableStatus = true } = {}) {
-    const populate = getValidatableFieldsPopulate(uid2);
-    const versions = await strapi2.db.query(uid2).findMany({
-      where: { documentId: version.documentId },
+    const { populate = {}, fields = [] } = getPopulateForValidation(uid2);
+    const params = {
       populate: {
-        // Populate only fields that require validation for bulk locale actions
         ...populate,
         // NOTE: creator fields are selected in this way to avoid exposing sensitive data
         createdBy: {
@@ -4168,9 +4390,15 @@ const documentMetadata = ({ strapi: strapi2 }) => ({
         updatedBy: {
           select: ["id", "firstname", "lastname", "email"]
         }
+      },
+      fields: uniq([...AVAILABLE_LOCALES_FIELDS, ...fields]),
+      filters: {
+        documentId: version.documentId
       }
-    });
-    const availableLocalesResult = availableLocales ? await this.getAvailableLocales(uid2, version, versions, Object.keys(populate)) : [];
+    };
+    const dbParams = strapi2.get("query-params").transform(uid2, params);
+    const versions = await strapi2.db.query(uid2).findMany(dbParams);
+    const availableLocalesResult = availableLocales ? await this.getAvailableLocales(uid2, version, versions) : [];
     const availableStatusResult = availableStatus ? this.getAvailableStatus(version, versions) : null;
     return {
       availableLocales: availableLocalesResult,
@@ -4197,6 +4425,16 @@ const documentMetadata = ({ strapi: strapi2 }) => ({
       opts.availableStatus = false;
     }
     const meta = await this.getMetadata(uid2, document, opts);
+    if (document.localizations) {
+      const otherStatus = await this.getManyAvailableStatus(uid2, document.localizations);
+      document.localizations = document.localizations.map((d) => {
+        const status = otherStatus.find((s) => s.documentId === d.documentId);
+        return {
+          ...d,
+          status: this.getStatus(d, status ? [status] : [])
+        };
+      });
+    }
     return {
       data: {
         ...document,
@@ -4414,7 +4652,8 @@ const services = {
   permission,
   "populate-builder": populateBuilder$1,
   uid,
-  ...history.services ? history.services : {}
+  ...history.services ? history.services : {},
+  ...preview.services ? preview.services : {}
 };
 const index = () => {
   return {