@strapi/content-releases 5.2.0 → 5.3.0

package/dist/_chunks/{App-Cne--1Z8.mjs → App-BX6_LcmS.mjs}

@@ -1,21 +1,306 @@
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { useNotification, useAPIErrorHandler, useQueryParams, useTracking, useRBAC, Page, Layouts, Pagination, isFetchError, ConfirmDialog, BackButton, useStrapiApp, Table } from "@strapi/admin/strapi-admin";
-import { useLocation, useNavigate, NavLink, useParams, Navigate, Link as Link$1, Routes, Route } from "react-router-dom";
-import { g as getTimezones, p as pluginId, u as useGetReleasesQuery, a as useGetReleaseSettingsQuery, b as useCreateReleaseMutation, P as PERMISSIONS, c as useGetReleaseQuery, d as useUpdateReleaseMutation, e as useDeleteReleaseMutation, f as usePublishReleaseMutation, h as getTimezoneOffset, i as useGetReleaseActionsQuery, j as useUpdateReleaseActionMutation, R as ReleaseActionOptions, k as ReleaseActionMenu, r as releaseApi } from "./index-Cy7qwpaU.mjs";
+import { Link, useLocation, useNavigate, NavLink, useParams, Navigate, Routes, Route } from "react-router-dom";
+import { g as getTimezones, p as pluginId, u as useGetReleasesQuery, a as useGetReleaseSettingsQuery, b as useCreateReleaseMutation, P as PERMISSIONS, c as useGetReleaseQuery, d as useUpdateReleaseMutation, e as useDeleteReleaseMutation, f as usePublishReleaseMutation, h as getTimezoneOffset, i as useGetReleaseActionsQuery, j as useUpdateReleaseActionMutation, R as ReleaseActionOptions, k as ReleaseActionMenu, r as releaseApi } from "./index-CBsSVKTv.mjs";
 import * as React from "react";
-import { unstable_useDocument } from "@strapi/content-manager/strapi-admin";
-import { Modal, Flex, Field, TextInput, Box, Checkbox, Typography, DatePicker, TimePicker, Button, Combobox, ComboboxOption, Link, Alert, Main, Tabs, Divider, EmptyStateLayout, Grid, Badge, MenuItem, SimpleMenu, Dialog, LinkButton, SingleSelect, SingleSelectOption, Tr, Td, Tooltip } from "@strapi/design-system";
-import { Plus, Pencil, Trash, More, CrossCircle, CheckCircle, ArrowsCounterClockwise } from "@strapi/icons";
+import { Flex, Popover, Button, Typography, LinkButton, Modal, Field, TextInput, Box, Checkbox, DatePicker, TimePicker, Combobox, ComboboxOption, Link as Link$1, Alert, Main, Tabs, Divider, EmptyStateLayout, Grid, Badge, MenuItem, SimpleMenu, Dialog, SingleSelect, SingleSelectOption, Tr, Td } from "@strapi/design-system";
+import { CrossCircle, CaretDown, CheckCircle, ArrowsCounterClockwise, Plus, Pencil, Trash, More } from "@strapi/icons";
 import { EmptyDocuments } from "@strapi/icons/symbols";
 import format$1 from "date-fns/format";
 import { utcToZonedTime, zonedTimeToUtc } from "date-fns-tz";
 import { useIntl } from "react-intl";
 import { styled } from "styled-components";
+import { unstable_useDocument } from "@strapi/content-manager/strapi-admin";
+import { stringify } from "qs";
 import { intervalToDuration, isPast, formatISO, format } from "date-fns";
 import { Formik, Form, useFormikContext } from "formik";
 import { R as RELEASE_SCHEMA } from "./schemas-DdA2ic2U.mjs";
 import { useDispatch } from "react-redux";
 import { useLicenseLimits } from "@strapi/admin/strapi-admin/ee";
+const StyledPopoverFlex = styled(Flex)`
+  width: 100%;
+  max-width: 256px;
+
+  & > * {
+    border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};
+  }
+
+  & > *:last-child {
+    border-bottom: none;
+  }
+`;
+const EntryStatusTrigger = ({
+  action,
+  status,
+  hasErrors,
+  requiredStage,
+  entryStage
+}) => {
+  const { formatMessage } = useIntl();
+  if (action === "publish") {
+    if (hasErrors || requiredStage && requiredStage.id !== entryStage?.id) {
+      return /* @__PURE__ */ jsx(Popover.Trigger, { children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          startIcon: /* @__PURE__ */ jsx(CrossCircle, { fill: "danger600" }),
+          endIcon: /* @__PURE__ */ jsx(CaretDown, {}),
+          children: /* @__PURE__ */ jsx(Typography, { textColor: "danger600", variant: "omega", fontWeight: "bold", children: formatMessage({
+            id: "content-releases.pages.ReleaseDetails.entry-validation.not-ready",
+            defaultMessage: "Not ready to publish"
+          }) })
+        }
+      ) });
+    }
+    if (status === "draft") {
+      return /* @__PURE__ */ jsx(Popover.Trigger, { children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          startIcon: /* @__PURE__ */ jsx(CheckCircle, { fill: "success600" }),
+          endIcon: /* @__PURE__ */ jsx(CaretDown, {}),
+          children: /* @__PURE__ */ jsx(Typography, { textColor: "success600", variant: "omega", fontWeight: "bold", children: formatMessage({
+            id: "content-releases.pages.ReleaseDetails.entry-validation.ready-to-publish",
+            defaultMessage: "Ready to publish"
+          }) })
+        }
+      ) });
+    }
+    if (status === "modified") {
+      return /* @__PURE__ */ jsx(Popover.Trigger, { children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          startIcon: /* @__PURE__ */ jsx(ArrowsCounterClockwise, { fill: "alternative600" }),
+          endIcon: /* @__PURE__ */ jsx(CaretDown, {}),
+          children: /* @__PURE__ */ jsx(Typography, { variant: "omega", fontWeight: "bold", textColor: "alternative600", children: formatMessage({
+            id: "content-releases.pages.ReleaseDetails.entry-validation.modified",
+            defaultMessage: "Ready to publish changes"
+          }) })
+        }
+      ) });
+    }
+    return /* @__PURE__ */ jsx(Popover.Trigger, { children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "ghost",
+        startIcon: /* @__PURE__ */ jsx(CheckCircle, { fill: "success600" }),
+        endIcon: /* @__PURE__ */ jsx(CaretDown, {}),
+        children: /* @__PURE__ */ jsx(Typography, { textColor: "success600", variant: "omega", fontWeight: "bold", children: formatMessage({
+          id: "content-releases.pages.ReleaseDetails.entry-validation.already-published",
+          defaultMessage: "Already published"
+        }) })
+      }
+    ) });
+  }
+  if (status === "published") {
+    return /* @__PURE__ */ jsx(Popover.Trigger, { children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "ghost",
+        startIcon: /* @__PURE__ */ jsx(CheckCircle, { fill: "success600" }),
+        endIcon: /* @__PURE__ */ jsx(CaretDown, {}),
+        children: /* @__PURE__ */ jsx(Typography, { textColor: "success600", variant: "omega", fontWeight: "bold", children: formatMessage({
+          id: "content-releases.pages.ReleaseDetails.entry-validation.ready-to-unpublish",
+          defaultMessage: "Ready to unpublish"
+        }) })
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsx(Popover.Trigger, { children: /* @__PURE__ */ jsx(Button, { variant: "ghost", startIcon: /* @__PURE__ */ jsx(CheckCircle, { fill: "success600" }), endIcon: /* @__PURE__ */ jsx(CaretDown, {}), children: /* @__PURE__ */ jsx(Typography, { textColor: "success600", variant: "omega", fontWeight: "bold", children: formatMessage({
+    id: "content-releases.pages.ReleaseDetails.entry-validation.already-unpublished",
+    defaultMessage: "Already unpublished"
+  }) }) }) });
+};
+const FieldsValidation = ({
+  hasErrors,
+  errors,
+  kind,
+  contentTypeUid,
+  documentId,
+  locale
+}) => {
+  const { formatMessage } = useIntl();
+  return /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 1, width: "100%", padding: 5, children: [
+    /* @__PURE__ */ jsxs(Flex, { gap: 2, width: "100%", children: [
+      /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", children: formatMessage({
+        id: "content-releases.pages.ReleaseDetails.entry-validation.fields",
+        defaultMessage: "Fields"
+      }) }),
+      hasErrors ? /* @__PURE__ */ jsx(CrossCircle, { fill: "danger600" }) : /* @__PURE__ */ jsx(CheckCircle, { fill: "success600" })
+    ] }),
+    /* @__PURE__ */ jsx(Typography, { width: "100%", textColor: "neutral600", children: hasErrors ? formatMessage(
+      {
+        id: "content-releases.pages.ReleaseDetails.entry-validation.fields.error",
+        defaultMessage: "{errors} errors on fields."
+      },
+      { errors: errors ? Object.keys(errors).length : 0 }
+    ) : formatMessage({
+      id: "content-releases.pages.ReleaseDetails.entry-validation.fields.success",
+      defaultMessage: "All fields are filled correctly."
+    }) }),
+    hasErrors && /* @__PURE__ */ jsx(
+      LinkButton,
+      {
+        tag: Link,
+        to: {
+          pathname: `/content-manager/${kind === "collectionType" ? "collection-types" : "single-types"}/${contentTypeUid}/${documentId}`,
+          search: locale ? stringify({
+            plugins: {
+              i18n: {
+                locale
+              }
+            }
+          }) : ""
+        },
+        variant: "secondary",
+        fullWidth: true,
+        state: { forceValidation: true },
+        children: formatMessage({
+          id: "content-releases.pages.ReleaseDetails.entry-validation.fields.see-errors",
+          defaultMessage: "See errors"
+        })
+      }
+    )
+  ] });
+};
+const getReviewStageIcon = ({
+  contentTypeHasReviewWorkflow,
+  requiredStage,
+  entryStage
+}) => {
+  if (!contentTypeHasReviewWorkflow) {
+    return /* @__PURE__ */ jsx(CheckCircle, { fill: "neutral200" });
+  }
+  if (requiredStage && requiredStage.id !== entryStage?.id) {
+    return /* @__PURE__ */ jsx(CrossCircle, { fill: "danger600" });
+  }
+  return /* @__PURE__ */ jsx(CheckCircle, { fill: "success600" });
+};
+const getReviewStageMessage = ({
+  contentTypeHasReviewWorkflow,
+  requiredStage,
+  entryStage,
+  formatMessage
+}) => {
+  if (!contentTypeHasReviewWorkflow) {
+    return formatMessage({
+      id: "content-releases.pages.ReleaseDetails.entry-validation.review-stage.not-enabled",
+      defaultMessage: "This entry is not associated to any workflow."
+    });
+  }
+  if (requiredStage && requiredStage.id !== entryStage?.id) {
+    return formatMessage(
+      {
+        id: "content-releases.pages.ReleaseDetails.entry-validation.review-stage.not-ready",
+        defaultMessage: "This entry is not at the required stage for publishing. ({stageName})"
+      },
+      {
+        stageName: requiredStage?.name ?? ""
+      }
+    );
+  }
+  if (requiredStage && requiredStage.id === entryStage?.id) {
+    return formatMessage(
+      {
+        id: "content-releases.pages.ReleaseDetails.entry-validation.review-stage.ready",
+        defaultMessage: "This entry is at the required stage for publishing. ({stageName})"
+      },
+      {
+        stageName: requiredStage?.name ?? ""
+      }
+    );
+  }
+  return formatMessage({
+    id: "content-releases.pages.ReleaseDetails.entry-validation.review-stage.stage-not-required",
+    defaultMessage: "No required stage for publication"
+  });
+};
+const ReviewStageValidation = ({
+  contentTypeHasReviewWorkflow,
+  requiredStage,
+  entryStage
+}) => {
+  const { formatMessage } = useIntl();
+  const Icon = getReviewStageIcon({
+    contentTypeHasReviewWorkflow,
+    requiredStage,
+    entryStage
+  });
+  return /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 1, width: "100%", padding: 5, children: [
+    /* @__PURE__ */ jsxs(Flex, { gap: 2, width: "100%", children: [
+      /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", children: formatMessage({
+        id: "content-releases.pages.ReleaseDetails.entry-validation.review-stage",
+        defaultMessage: "Review stage"
+      }) }),
+      Icon
+    ] }),
+    /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", children: getReviewStageMessage({
+      contentTypeHasReviewWorkflow,
+      requiredStage,
+      entryStage,
+      formatMessage
+    }) })
+  ] });
+};
+const EntryValidationPopover = ({
+  schema,
+  entry,
+  status,
+  action
+}) => {
+  const { validate, isLoading } = unstable_useDocument(
+    {
+      collectionType: schema?.kind ?? "",
+      model: schema?.uid ?? ""
+    },
+    {
+      // useDocument makes a request to get more data about the entry, but we only want to have the validation function so we skip the request
+      skip: true
+    }
+  );
+  const errors = isLoading ? null : validate(entry);
+  const hasErrors = errors ? Object.keys(errors).length > 0 : false;
+  const contentTypeHasReviewWorkflow = schema?.hasReviewWorkflow ?? false;
+  const requiredStage = schema?.stageRequiredToPublish;
+  const entryStage = entry.strapi_stage;
+  if (isLoading) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs(Popover.Root, { children: [
+    /* @__PURE__ */ jsx(
+      EntryStatusTrigger,
+      {
+        action,
+        status,
+        hasErrors,
+        requiredStage,
+        entryStage
+      }
+    ),
+    /* @__PURE__ */ jsx(Popover.Content, { children: /* @__PURE__ */ jsxs(StyledPopoverFlex, { direction: "column", children: [
+      /* @__PURE__ */ jsx(
+        FieldsValidation,
+        {
+          hasErrors,
+          errors,
+          contentTypeUid: schema?.uid,
+          kind: schema?.kind,
+          documentId: entry.documentId,
+          locale: entry.locale
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        ReviewStageValidation,
+        {
+          contentTypeHasReviewWorkflow,
+          requiredStage,
+          entryStage
+        }
+      )
+    ] }) })
+  ] });
+};
 const intervals = ["years", "months", "days", "hours", "minutes", "seconds"];
 const RelativeTime$1 = React.forwardRef(
   ({ timestamp, customIntervals = [], ...restProps }, forwardedRef) => {
@@ -286,7 +571,7 @@ const useTypedDispatch = useDispatch;
 const isBaseQueryError = (error) => {
   return typeof error !== "undefined" && error.name !== void 0;
 };
-const LinkCard = styled(Link)`
+const LinkCard = styled(Link$1)`
   display: block;
 `;
 const RelativeTime = styled(RelativeTime$1)`
@@ -498,7 +783,7 @@ const ReleasesPage = () => {
         StyledAlert,
         {
           marginBottom: 6,
-          action: /* @__PURE__ */ jsx(Link, { href: "https://strapi.io/pricing-cloud", isExternal: true, children: formatMessage({
+          action: /* @__PURE__ */ jsx(Link$1, { href: "https://strapi.io/pricing-cloud", isExternal: true, children: formatMessage({
             id: "content-releases.pages.Releases.max-limit-reached.action",
             defaultMessage: "Explore plans"
           }) }),
@@ -622,105 +907,6 @@ const TrashIcon = styled(Trash)`
     fill: ${({ theme }) => theme.colors.danger600};
   }
 `;
-const TypographyMaxWidth = styled(Typography)`
-  max-width: 300px;
-`;
-const EntryValidationText = ({ action, schema, entry, status }) => {
-  const { formatMessage } = useIntl();
-  const { validate, isLoading } = unstable_useDocument(
-    {
-      collectionType: schema?.kind ?? "",
-      model: schema?.uid ?? ""
-    },
-    {
-      // useDocument makes a request to get more data about the entry, but we only want to have the validation function so we skip the request
-      skip: true
-    }
-  );
-  const errorsToString = (errors2, prefix = "") => {
-    if (Object.keys(errors2).length === 0) {
-      return "";
-    }
-    return Object.entries(errors2).map(([key, value]) => {
-      if (value === void 0 || value === null) {
-        return "";
-      }
-      if (typeof value === "string") {
-        return formatMessage(
-          { id: value, defaultMessage: value },
-          { field: prefix ? `${prefix}.${key}` : key }
-        );
-      }
-      if (typeof value === "object" && value !== null && "id" in value && "defaultMessage" in value) {
-        return formatMessage(
-          // @ts-expect-error – TODO: default message will be a string
-          { id: `${value.id}.withField`, defaultMessage: value.defaultMessage },
-          { field: prefix ? `${prefix}.${key}` : key }
-        );
-      }
-      return errorsToString(value, key);
-    }).join(" ");
-  };
-  if (isLoading) {
-    return null;
-  }
-  const errors = validate(entry) ?? {};
-  if (action === "publish") {
-    if (Object.keys(errors).length > 0) {
-      const validationErrorsMessages = errorsToString(errors);
-      return /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
-        /* @__PURE__ */ jsx(CrossCircle, { fill: "danger600" }),
-        /* @__PURE__ */ jsx(Tooltip, { description: validationErrorsMessages, children: /* @__PURE__ */ jsx(
-          TypographyMaxWidth,
-          {
-            textColor: "danger600",
-            variant: "omega",
-            fontWeight: "semiBold",
-            ellipsis: true,
-            children: validationErrorsMessages
-          }
-        ) })
-      ] });
-    }
-    if (status === "draft") {
-      return /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
-        /* @__PURE__ */ jsx(CheckCircle, { fill: "success600" }),
-        /* @__PURE__ */ jsx(Typography, { children: formatMessage({
-          id: "content-releases.pages.ReleaseDetails.entry-validation.ready-to-publish",
-          defaultMessage: "Ready to publish"
-        }) })
-      ] });
-    }
-    if (status === "modified") {
-      return /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
-        /* @__PURE__ */ jsx(ArrowsCounterClockwise, { fill: "alternative600" }),
-        /* @__PURE__ */ jsx(Typography, { children: formatMessage({
-          id: "content-releases.pages.ReleaseDetails.entry-validation.modified",
-          defaultMessage: "Ready to publish changes"
-        }) })
-      ] });
-    }
-    if (status === "published") {
-      return /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
-        /* @__PURE__ */ jsx(CheckCircle, { fill: "success600" }),
-        /* @__PURE__ */ jsx(Typography, { children: formatMessage({
-          id: "content-releases.pages.ReleaseDetails.entry-validation.already-published",
-          defaultMessage: "Already published"
-        }) })
-      ] });
-    }
-  }
-  return /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
-    /* @__PURE__ */ jsx(CheckCircle, { fill: "success600" }),
-    !entry.publishedAt ? /* @__PURE__ */ jsx(Typography, { textColor: "success600", fontWeight: "bold", children: formatMessage({
-      id: "content-releases.pages.ReleaseDetails.entry-validation.already-unpublished",
-      defaultMessage: "Already unpublished"
-    }) }) : /* @__PURE__ */ jsx(Typography, { children: formatMessage({
-      id: "content-releases.pages.ReleaseDetails.entry-validation.ready-to-unpublish",
-      defaultMessage: "Ready to unpublish"
-    }) })
-  ] });
-};
 const ReleaseDetailsLayout = ({
   toggleEditReleaseModal,
   toggleWarningSubmit,
@@ -1041,7 +1227,7 @@ const ReleaseDetailsBody = ({ releaseId }) => {
   const releaseActions = data?.data;
   const releaseMeta = data?.meta;
   const contentTypes = releaseMeta?.contentTypes || {};
-  const components = releaseMeta?.components || {};
+  releaseMeta?.components || {};
   if (isBaseQueryError(releaseError) || !release) {
     const errorsArray = [];
     if (releaseError && "code" in releaseError) {
@@ -1074,7 +1260,7 @@ const ReleaseDetailsBody = ({ releaseId }) => {
         action: /* @__PURE__ */ jsx(
           LinkButton,
           {
-            tag: Link$1,
+            tag: Link,
             to: {
               pathname: "/content-manager"
             },
@@ -1184,11 +1370,10 @@ const ReleaseDetailsBody = ({ releaseId }) => {
                 ) }),
                 !release.releasedAt && /* @__PURE__ */ jsxs(Fragment, { children: [
                   /* @__PURE__ */ jsx(Td, { width: "20%", minWidth: "200px", children: /* @__PURE__ */ jsx(
-                    EntryValidationText,
+                    EntryValidationPopover,
                     {
                       action: type,
                       schema: contentTypes?.[contentType.uid],
-                      components,
                       entry,
                       status
                     }
@@ -1371,4 +1556,4 @@ const App = () => {
 export {
   App
 };
-//# sourceMappingURL=App-Cne--1Z8.mjs.map
+//# sourceMappingURL=App-BX6_LcmS.mjs.map