@strapi/content-manager 0.0.0-experimental.81dfdf02b1367004c7deed9e01afa9d3a15d0fa5 → 0.0.0-experimental.86fea32ae4240d73f76516d7238e302b6b927e88

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (103) hide show
  1. package/dist/_chunks/{ComponentConfigurationPage-qemkOlnj.mjs → ComponentConfigurationPage-B2g3icXu.mjs} +3 -3
  2. package/dist/_chunks/{ComponentConfigurationPage-qemkOlnj.mjs.map → ComponentConfigurationPage-B2g3icXu.mjs.map} +1 -1
  3. package/dist/_chunks/{ComponentConfigurationPage-D_M8iBw5.js → ComponentConfigurationPage-CzDn8Uxh.js} +3 -3
  4. package/dist/_chunks/{ComponentConfigurationPage-D_M8iBw5.js.map → ComponentConfigurationPage-CzDn8Uxh.js.map} +1 -1
  5. package/dist/_chunks/{EditConfigurationPage-BePwPuHy.js → EditConfigurationPage-Bcbi6r5y.js} +3 -3
  6. package/dist/_chunks/{EditConfigurationPage-BePwPuHy.js.map → EditConfigurationPage-Bcbi6r5y.js.map} +1 -1
  7. package/dist/_chunks/{EditConfigurationPage-CjUrEewK.mjs → EditConfigurationPage-DSA1zONV.mjs} +3 -3
  8. package/dist/_chunks/{EditConfigurationPage-CjUrEewK.mjs.map → EditConfigurationPage-DSA1zONV.mjs.map} +1 -1
  9. package/dist/_chunks/{EditViewPage-B-RJeiJD.js → EditViewPage-BvcMXaP2.js} +15 -5
  10. package/dist/_chunks/EditViewPage-BvcMXaP2.js.map +1 -0
  11. package/dist/_chunks/{EditViewPage-De8GyU8P.mjs → EditViewPage-Ca2EmJpb.mjs} +15 -5
  12. package/dist/_chunks/EditViewPage-Ca2EmJpb.mjs.map +1 -0
  13. package/dist/_chunks/{Field-pb2o8uBe.mjs → Field-BEYkgCZ0.mjs} +86 -80
  14. package/dist/_chunks/Field-BEYkgCZ0.mjs.map +1 -0
  15. package/dist/_chunks/{Field-dq8Tg1M_.js → Field-CmaWxdpf.js} +90 -84
  16. package/dist/_chunks/Field-CmaWxdpf.js.map +1 -0
  17. package/dist/_chunks/{Form-DJn0Dxha.mjs → Form-BJVbU6w4.mjs} +16 -8
  18. package/dist/_chunks/Form-BJVbU6w4.mjs.map +1 -0
  19. package/dist/_chunks/{Form-DGIf4jQU.js → Form-DAUpPBVM.js} +16 -8
  20. package/dist/_chunks/Form-DAUpPBVM.js.map +1 -0
  21. package/dist/_chunks/{History-Dh2NEHnR.js → History-Bw9vfT1k.js} +23 -10
  22. package/dist/_chunks/History-Bw9vfT1k.js.map +1 -0
  23. package/dist/_chunks/{History-BowL3JKP.mjs → History-M6Pk9CoY.mjs} +24 -11
  24. package/dist/_chunks/History-M6Pk9CoY.mjs.map +1 -0
  25. package/dist/_chunks/{ListConfigurationPage-BpVOB-hn.mjs → ListConfigurationPage-D7ior2zq.mjs} +2 -2
  26. package/dist/_chunks/{ListConfigurationPage-BpVOB-hn.mjs.map → ListConfigurationPage-D7ior2zq.mjs.map} +1 -1
  27. package/dist/_chunks/{ListConfigurationPage-BxYCWz9e.js → ListConfigurationPage-DBVqF5fc.js} +2 -2
  28. package/dist/_chunks/{ListConfigurationPage-BxYCWz9e.js.map → ListConfigurationPage-DBVqF5fc.js.map} +1 -1
  29. package/dist/_chunks/{ListViewPage-CXFUjZQC.mjs → ListViewPage-BH37wONY.mjs} +40 -36
  30. package/dist/_chunks/ListViewPage-BH37wONY.mjs.map +1 -0
  31. package/dist/_chunks/{ListViewPage-4XsciqHZ.js → ListViewPage-MZu-8OKX.js} +43 -39
  32. package/dist/_chunks/ListViewPage-MZu-8OKX.js.map +1 -0
  33. package/dist/_chunks/{NoContentTypePage-C8OpoHeU.js → NoContentTypePage-C9lRMTCa.js} +2 -2
  34. package/dist/_chunks/{NoContentTypePage-C8OpoHeU.js.map → NoContentTypePage-C9lRMTCa.js.map} +1 -1
  35. package/dist/_chunks/{NoContentTypePage-DuhOTp3x.mjs → NoContentTypePage-DRp7Aem_.mjs} +2 -2
  36. package/dist/_chunks/{NoContentTypePage-DuhOTp3x.mjs.map → NoContentTypePage-DRp7Aem_.mjs.map} +1 -1
  37. package/dist/_chunks/{NoPermissionsPage-y_r7DVA2.js → NoPermissionsPage-COs61PpB.js} +2 -2
  38. package/dist/_chunks/{NoPermissionsPage-y_r7DVA2.js.map → NoPermissionsPage-COs61PpB.js.map} +1 -1
  39. package/dist/_chunks/{NoPermissionsPage-DVz3mzDz.mjs → NoPermissionsPage-CzhRt5CA.mjs} +2 -2
  40. package/dist/_chunks/{NoPermissionsPage-DVz3mzDz.mjs.map → NoPermissionsPage-CzhRt5CA.mjs.map} +1 -1
  41. package/dist/_chunks/{Relations-CVNLrn1Y.mjs → Relations-68XxIzPI.mjs} +49 -28
  42. package/dist/_chunks/Relations-68XxIzPI.mjs.map +1 -0
  43. package/dist/_chunks/{Relations-DPFCAa7b.js → Relations-CsGlulU_.js} +49 -28
  44. package/dist/_chunks/Relations-CsGlulU_.js.map +1 -0
  45. package/dist/_chunks/{en-uOUIxfcQ.js → en-Bm0D0IWz.js} +13 -12
  46. package/dist/_chunks/{en-uOUIxfcQ.js.map → en-Bm0D0IWz.js.map} +1 -1
  47. package/dist/_chunks/{en-BrCTWlZv.mjs → en-DKV44jRb.mjs} +13 -12
  48. package/dist/_chunks/{en-BrCTWlZv.mjs.map → en-DKV44jRb.mjs.map} +1 -1
  49. package/dist/_chunks/{index-DiMrfcfy.mjs → index-CsfwpRfc.mjs} +1896 -1773
  50. package/dist/_chunks/index-CsfwpRfc.mjs.map +1 -0
  51. package/dist/_chunks/{index-C3fJE-1-.js → index-oDq3VO9j.js} +1893 -1769
  52. package/dist/_chunks/index-oDq3VO9j.js.map +1 -0
  53. package/dist/_chunks/{layout-ls3gxfpH.mjs → layout-C5uSVTqi.mjs} +5 -4
  54. package/dist/_chunks/{layout-ls3gxfpH.mjs.map → layout-C5uSVTqi.mjs.map} +1 -1
  55. package/dist/_chunks/{layout-C788OmNr.js → layout-Euka-kfv.js} +5 -4
  56. package/dist/_chunks/{layout-C788OmNr.js.map → layout-Euka-kfv.js.map} +1 -1
  57. package/dist/_chunks/{relations-CLcOmGO0.mjs → relations-BpHVgFuV.mjs} +2 -2
  58. package/dist/_chunks/{relations-CLcOmGO0.mjs.map → relations-BpHVgFuV.mjs.map} +1 -1
  59. package/dist/_chunks/{relations-DYeotliT.js → relations-DG7kmxa0.js} +2 -2
  60. package/dist/_chunks/{relations-DYeotliT.js.map → relations-DG7kmxa0.js.map} +1 -1
  61. package/dist/_chunks/{usePrev-B9w_-eYc.js → useDebounce-CtcjDB3L.js} +14 -1
  62. package/dist/_chunks/useDebounce-CtcjDB3L.js.map +1 -0
  63. package/dist/_chunks/useDebounce-DmuSJIF3.mjs +29 -0
  64. package/dist/_chunks/useDebounce-DmuSJIF3.mjs.map +1 -0
  65. package/dist/admin/index.js +2 -1
  66. package/dist/admin/index.js.map +1 -1
  67. package/dist/admin/index.mjs +3 -2
  68. package/dist/admin/src/exports.d.ts +1 -1
  69. package/dist/admin/src/hooks/useDocument.d.ts +32 -1
  70. package/dist/admin/src/pages/EditView/components/FormInputs/Wysiwyg/WysiwygStyles.d.ts +0 -32
  71. package/dist/admin/src/pages/EditView/components/Header.d.ts +11 -11
  72. package/dist/admin/src/services/documents.d.ts +3 -1
  73. package/dist/server/index.js +54 -22
  74. package/dist/server/index.js.map +1 -1
  75. package/dist/server/index.mjs +54 -22
  76. package/dist/server/index.mjs.map +1 -1
  77. package/dist/server/src/controllers/collection-types.d.ts.map +1 -1
  78. package/dist/server/src/controllers/relations.d.ts.map +1 -1
  79. package/dist/server/src/history/services/history.d.ts.map +1 -1
  80. package/dist/server/src/history/services/lifecycles.d.ts.map +1 -1
  81. package/dist/server/src/history/services/utils.d.ts +1 -0
  82. package/dist/server/src/history/services/utils.d.ts.map +1 -1
  83. package/dist/shared/contracts/collection-types.d.ts +3 -1
  84. package/dist/shared/contracts/collection-types.d.ts.map +1 -1
  85. package/package.json +12 -12
  86. package/dist/_chunks/EditViewPage-B-RJeiJD.js.map +0 -1
  87. package/dist/_chunks/EditViewPage-De8GyU8P.mjs.map +0 -1
  88. package/dist/_chunks/Field-dq8Tg1M_.js.map +0 -1
  89. package/dist/_chunks/Field-pb2o8uBe.mjs.map +0 -1
  90. package/dist/_chunks/Form-DGIf4jQU.js.map +0 -1
  91. package/dist/_chunks/Form-DJn0Dxha.mjs.map +0 -1
  92. package/dist/_chunks/History-BowL3JKP.mjs.map +0 -1
  93. package/dist/_chunks/History-Dh2NEHnR.js.map +0 -1
  94. package/dist/_chunks/ListViewPage-4XsciqHZ.js.map +0 -1
  95. package/dist/_chunks/ListViewPage-CXFUjZQC.mjs.map +0 -1
  96. package/dist/_chunks/Relations-CVNLrn1Y.mjs.map +0 -1
  97. package/dist/_chunks/Relations-DPFCAa7b.js.map +0 -1
  98. package/dist/_chunks/index-C3fJE-1-.js.map +0 -1
  99. package/dist/_chunks/index-DiMrfcfy.mjs.map +0 -1
  100. package/dist/_chunks/usePrev-B9w_-eYc.js.map +0 -1
  101. package/dist/_chunks/usePrev-DH6iah0A.mjs +0 -16
  102. package/dist/_chunks/usePrev-DH6iah0A.mjs.map +0 -1
  103. package/strapi-server.js +0 -3
@@ -1,16 +1,17 @@
1
- import { CrossCircle, More, WarningCircle, ListPlus, Pencil, Trash, Check, CheckCircle, ArrowsCounterClockwise, ChevronRight, Duplicate, ClockCounterClockwise, Feather } from "@strapi/icons";
1
+ import { More, Cross, WarningCircle, ListPlus, Pencil, Trash, Check, CrossCircle, CheckCircle, ArrowsCounterClockwise, ChevronRight, Duplicate, ClockCounterClockwise, Feather } from "@strapi/icons";
2
2
  import { jsx, Fragment, jsxs } from "react/jsx-runtime";
3
- import { useStrapiApp, createContext, useAuth, useRBAC, Page, adminApi, translatedErrors, useNotification, useAPIErrorHandler, getYupValidationErrors, useQueryParams, useTracking, useForm, BackButton, DescriptionComponentRenderer, useTable, Table } from "@strapi/admin/strapi-admin";
3
+ import { useStrapiApp, createContext, useQueryParams, useAuth, useRBAC, Page, adminApi, translatedErrors, useNotification, useAPIErrorHandler, getYupValidationErrors, useForm, useTracking, useGuidedTour, BackButton, DescriptionComponentRenderer, useTable, Table } from "@strapi/admin/strapi-admin";
4
4
  import * as React from "react";
5
5
  import { lazy } from "react";
6
- import { Menu, Button, VisuallyHidden, Flex, Typography, Dialog, Modal, Radio, Status, Box, SingleSelect, SingleSelectOption, Loader, IconButton, Tooltip, LinkButton } from "@strapi/design-system";
6
+ import { Button, Menu, VisuallyHidden, Flex, Typography, Dialog, Modal, Radio, Status, Box, SingleSelect, SingleSelectOption, IconButton, Loader, Tooltip, LinkButton } from "@strapi/design-system";
7
+ import mapValues from "lodash/fp/mapValues";
7
8
  import { useIntl } from "react-intl";
8
9
  import { useParams, useNavigate, Navigate, useMatch, useLocation, Link, NavLink } from "react-router-dom";
9
- import { styled } from "styled-components";
10
10
  import * as yup from "yup";
11
11
  import { ValidationError } from "yup";
12
12
  import pipe from "lodash/fp/pipe";
13
13
  import { intervalToDuration, isPast } from "date-fns";
14
+ import { styled } from "styled-components";
14
15
  import { stringify } from "qs";
15
16
  import { createSlice, combineReducers } from "@reduxjs/toolkit";
16
17
  const __variableDynamicImportRuntimeHelper = (glob, path) => {
@@ -100,6 +101,7 @@ const DocumentRBAC = ({ children, permissions }) => {
100
101
  if (!slug) {
101
102
  throw new Error("Cannot find the slug param in the URL");
102
103
  }
104
+ const [{ rawQuery }] = useQueryParams();
103
105
  const userPermissions = useAuth("DocumentRBAC", (state) => state.permissions);
104
106
  const contentTypePermissions = React.useMemo(() => {
105
107
  const contentTypePermissions2 = userPermissions.filter(
@@ -110,7 +112,14 @@ const DocumentRBAC = ({ children, permissions }) => {
110
112
  return { ...acc, [action]: [permission] };
111
113
  }, {});
112
114
  }, [slug, userPermissions]);
113
- const { isLoading, allowedActions } = useRBAC(contentTypePermissions, permissions ?? void 0);
115
+ const { isLoading, allowedActions } = useRBAC(
116
+ contentTypePermissions,
117
+ permissions ?? void 0,
118
+ // TODO: useRBAC context should be typed and built differently
119
+ // We are passing raw query as context to the hook so that it can
120
+ // rely on the locale provided from DocumentRBAC for its permission calculations.
121
+ rawQuery
122
+ );
114
123
  const canCreateFields = !isLoading && allowedActions.canCreate ? extractAndDedupeFields(contentTypePermissions.create) : [];
115
124
  const canReadFields = !isLoading && allowedActions.canRead ? extractAndDedupeFields(contentTypePermissions.read) : [];
116
125
  const canUpdateFields = !isLoading && allowedActions.canUpdate ? extractAndDedupeFields(contentTypePermissions.update) : [];
@@ -461,6 +470,24 @@ const buildValidParams = (query) => {
461
470
  const isBaseQueryError = (error) => {
462
471
  return error.name !== void 0;
463
472
  };
473
+ const arrayValidator = (attribute, options) => ({
474
+ message: translatedErrors.required,
475
+ test(value) {
476
+ if (options.status === "draft") {
477
+ return true;
478
+ }
479
+ if (!attribute.required) {
480
+ return true;
481
+ }
482
+ if (!value) {
483
+ return false;
484
+ }
485
+ if (Array.isArray(value) && value.length === 0) {
486
+ return false;
487
+ }
488
+ return true;
489
+ }
490
+ });
464
491
  const createYupSchema = (attributes = {}, components = {}, options = { status: null }) => {
465
492
  const createModelSchema = (attributes2) => yup.object().shape(
466
493
  Object.entries(attributes2).reduce((acc, [name, attribute]) => {
@@ -468,6 +495,7 @@ const createYupSchema = (attributes = {}, components = {}, options = { status: n
468
495
  return acc;
469
496
  }
470
497
  const validations = [
498
+ addNullableValidation,
471
499
  addRequiredValidation,
472
500
  addMinLengthValidation,
473
501
  addMaxLengthValidation,
@@ -484,12 +512,12 @@ const createYupSchema = (attributes = {}, components = {}, options = { status: n
484
512
  ...acc,
485
513
  [name]: transformSchema(
486
514
  yup.array().of(createModelSchema(attributes3).nullable(false))
487
- )
515
+ ).test(arrayValidator(attribute, options))
488
516
  };
489
517
  } else {
490
518
  return {
491
519
  ...acc,
492
- [name]: transformSchema(createModelSchema(attributes3))
520
+ [name]: transformSchema(createModelSchema(attributes3).nullable())
493
521
  };
494
522
  }
495
523
  }
@@ -511,7 +539,7 @@ const createYupSchema = (attributes = {}, components = {}, options = { status: n
511
539
  }
512
540
  )
513
541
  )
514
- )
542
+ ).test(arrayValidator(attribute, options))
515
543
  };
516
544
  case "relation":
517
545
  return {
@@ -523,7 +551,7 @@ const createYupSchema = (attributes = {}, components = {}, options = { status: n
523
551
  } else if (Array.isArray(value)) {
524
552
  return yup.array().of(
525
553
  yup.object().shape({
526
- id: yup.string().required()
554
+ id: yup.number().required()
527
555
  })
528
556
  );
529
557
  } else if (typeof value === "object") {
@@ -609,17 +637,17 @@ const nullableSchema = (schema) => {
609
637
  schema
610
638
  );
611
639
  };
640
+ const addNullableValidation = () => (schema) => {
641
+ return nullableSchema(schema);
642
+ };
612
643
  const addRequiredValidation = (attribute, options) => (schema) => {
613
- if (options.status === "draft") {
614
- return nullableSchema(schema);
615
- }
616
- if ((attribute.type === "component" && attribute.repeatable || attribute.type === "dynamiczone") && attribute.required && "min" in schema) {
617
- return schema.min(1, translatedErrors.required);
644
+ if (options.status === "draft" || !attribute.required) {
645
+ return schema;
618
646
  }
619
- if (attribute.required && attribute.type !== "relation") {
647
+ if (attribute.required && "required" in schema) {
620
648
  return schema.required(translatedErrors.required);
621
649
  }
622
- return nullableSchema(schema);
650
+ return schema;
623
651
  };
624
652
  const addMinLengthValidation = (attribute, options) => (schema) => {
625
653
  if (options.status === "draft") {
@@ -647,31 +675,12 @@ const addMaxLengthValidation = (attribute) => (schema) => {
647
675
  return schema;
648
676
  };
649
677
  const addMinValidation = (attribute, options) => (schema) => {
650
- if ("min" in attribute) {
678
+ if (options.status === "draft") {
679
+ return schema;
680
+ }
681
+ if ("min" in attribute && "min" in schema) {
651
682
  const min = toInteger(attribute.min);
652
- if (attribute.type === "component" && attribute.repeatable || attribute.type === "dynamiczone") {
653
- if (options.status !== "draft" && !attribute.required && "test" in schema && min) {
654
- return schema.test(
655
- "custom-min",
656
- {
657
- ...translatedErrors.min,
658
- values: {
659
- min: attribute.min
660
- }
661
- },
662
- (value) => {
663
- if (!value) {
664
- return true;
665
- }
666
- if (Array.isArray(value) && value.length === 0) {
667
- return true;
668
- }
669
- return value.length >= min;
670
- }
671
- );
672
- }
673
- }
674
- if ("min" in schema && min) {
683
+ if (min) {
675
684
  return schema.min(min, {
676
685
  ...translatedErrors.min,
677
686
  values: {
@@ -789,19 +798,115 @@ const extractContentTypeComponents = (attributes = {}, allComponents = {}) => {
789
798
  }, {});
790
799
  return componentsByKey;
791
800
  };
792
- const useDocument = (args, opts) => {
801
+ const HOOKS = {
802
+ /**
803
+ * Hook that allows to mutate the displayed headers of the list view table
804
+ * @constant
805
+ * @type {string}
806
+ */
807
+ INJECT_COLUMN_IN_TABLE: "Admin/CM/pages/ListView/inject-column-in-table",
808
+ /**
809
+ * Hook that allows to mutate the CM's collection types links pre-set filters
810
+ * @constant
811
+ * @type {string}
812
+ */
813
+ MUTATE_COLLECTION_TYPES_LINKS: "Admin/CM/pages/App/mutate-collection-types-links",
814
+ /**
815
+ * Hook that allows to mutate the CM's edit view layout
816
+ * @constant
817
+ * @type {string}
818
+ */
819
+ MUTATE_EDIT_VIEW_LAYOUT: "Admin/CM/pages/EditView/mutate-edit-view-layout",
820
+ /**
821
+ * Hook that allows to mutate the CM's single types links pre-set filters
822
+ * @constant
823
+ * @type {string}
824
+ */
825
+ MUTATE_SINGLE_TYPES_LINKS: "Admin/CM/pages/App/mutate-single-types-links"
826
+ };
827
+ const contentTypesApi = contentManagerApi.injectEndpoints({
828
+ endpoints: (builder) => ({
829
+ getContentTypeConfiguration: builder.query({
830
+ query: (uid) => ({
831
+ url: `/content-manager/content-types/${uid}/configuration`,
832
+ method: "GET"
833
+ }),
834
+ transformResponse: (response) => response.data,
835
+ providesTags: (_result, _error, uid) => [
836
+ { type: "ContentTypesConfiguration", id: uid },
837
+ { type: "ContentTypeSettings", id: "LIST" }
838
+ ]
839
+ }),
840
+ getAllContentTypeSettings: builder.query({
841
+ query: () => "/content-manager/content-types-settings",
842
+ transformResponse: (response) => response.data,
843
+ providesTags: [{ type: "ContentTypeSettings", id: "LIST" }]
844
+ }),
845
+ updateContentTypeConfiguration: builder.mutation({
846
+ query: ({ uid, ...body }) => ({
847
+ url: `/content-manager/content-types/${uid}/configuration`,
848
+ method: "PUT",
849
+ data: body
850
+ }),
851
+ transformResponse: (response) => response.data,
852
+ invalidatesTags: (_result, _error, { uid }) => [
853
+ { type: "ContentTypesConfiguration", id: uid },
854
+ { type: "ContentTypeSettings", id: "LIST" },
855
+ // Is this necessary?
856
+ { type: "InitialData" }
857
+ ]
858
+ })
859
+ })
860
+ });
861
+ const {
862
+ useGetContentTypeConfigurationQuery,
863
+ useGetAllContentTypeSettingsQuery,
864
+ useUpdateContentTypeConfigurationMutation
865
+ } = contentTypesApi;
866
+ const checkIfAttributeIsDisplayable = (attribute) => {
867
+ const { type } = attribute;
868
+ if (type === "relation") {
869
+ return !attribute.relation.toLowerCase().includes("morph");
870
+ }
871
+ return !["json", "dynamiczone", "richtext", "password", "blocks"].includes(type) && !!type;
872
+ };
873
+ const getMainField = (attribute, mainFieldName, { schemas, components }) => {
874
+ if (!mainFieldName) {
875
+ return void 0;
876
+ }
877
+ const mainFieldType = attribute.type === "component" ? components[attribute.component].attributes[mainFieldName].type : (
878
+ // @ts-expect-error – `targetModel` does exist on the attribute for a relation.
879
+ schemas.find((schema) => schema.uid === attribute.targetModel)?.attributes[mainFieldName].type
880
+ );
881
+ return {
882
+ name: mainFieldName,
883
+ type: mainFieldType ?? "string"
884
+ };
885
+ };
886
+ const DEFAULT_SETTINGS = {
887
+ bulkable: false,
888
+ filterable: false,
889
+ searchable: false,
890
+ pagination: false,
891
+ defaultSortBy: "",
892
+ defaultSortOrder: "asc",
893
+ mainField: "id",
894
+ pageSize: 10
895
+ };
896
+ const useDocumentLayout = (model) => {
897
+ const { schema, components } = useDocument({ model, collectionType: "" }, { skip: true });
898
+ const [{ query }] = useQueryParams();
899
+ const runHookWaterfall = useStrapiApp("useDocumentLayout", (state) => state.runHookWaterfall);
793
900
  const { toggleNotification } = useNotification();
794
901
  const { _unstableFormatAPIError: formatAPIError } = useAPIErrorHandler();
902
+ const { isLoading: isLoadingSchemas, schemas } = useContentTypeSchema();
795
903
  const {
796
- currentData: data,
797
- isLoading: isLoadingDocument,
798
- isFetching: isFetchingDocument,
799
- error
800
- } = useGetDocumentQuery(args, {
801
- ...opts,
802
- skip: !args.documentId && args.collectionType !== SINGLE_TYPES || opts?.skip
803
- });
804
- const { components, schema, isLoading: isLoadingSchema } = useContentTypeSchema(args.model);
904
+ data,
905
+ isLoading: isLoadingConfigs,
906
+ error,
907
+ isFetching: isFetchingConfigs
908
+ } = useGetContentTypeConfigurationQuery(model);
909
+ const isLoading = isLoadingSchemas || isFetchingConfigs || isLoadingConfigs;
805
910
  React.useEffect(() => {
806
911
  if (error) {
807
912
  toggleNotification({
@@ -809,398 +914,656 @@ const useDocument = (args, opts) => {
809
914
  message: formatAPIError(error)
810
915
  });
811
916
  }
812
- }, [toggleNotification, error, formatAPIError, args.collectionType]);
813
- const validationSchema = React.useMemo(() => {
814
- if (!schema) {
815
- return null;
816
- }
817
- return createYupSchema(schema.attributes, components);
818
- }, [schema, components]);
819
- const validate = React.useCallback(
820
- (document) => {
821
- if (!validationSchema) {
822
- throw new Error(
823
- "There is no validation schema generated, this is likely due to the schema not being loaded yet."
824
- );
825
- }
826
- try {
827
- validationSchema.validateSync(document, { abortEarly: false, strict: true });
828
- return null;
829
- } catch (error2) {
830
- if (error2 instanceof ValidationError) {
831
- return getYupValidationErrors(error2);
832
- }
833
- throw error2;
834
- }
917
+ }, [error, formatAPIError, toggleNotification]);
918
+ const editLayout = React.useMemo(
919
+ () => data && !isLoading ? formatEditLayout(data, { schemas, schema, components }) : {
920
+ layout: [],
921
+ components: {},
922
+ metadatas: {},
923
+ options: {},
924
+ settings: DEFAULT_SETTINGS
835
925
  },
836
- [validationSchema]
926
+ [data, isLoading, schemas, schema, components]
927
+ );
928
+ const listLayout = React.useMemo(() => {
929
+ return data && !isLoading ? formatListLayout(data, { schemas, schema, components }) : {
930
+ layout: [],
931
+ metadatas: {},
932
+ options: {},
933
+ settings: DEFAULT_SETTINGS
934
+ };
935
+ }, [data, isLoading, schemas, schema, components]);
936
+ const { layout: edit } = React.useMemo(
937
+ () => runHookWaterfall(HOOKS.MUTATE_EDIT_VIEW_LAYOUT, {
938
+ layout: editLayout,
939
+ query
940
+ }),
941
+ [editLayout, query, runHookWaterfall]
837
942
  );
838
- const isLoading = isLoadingDocument || isFetchingDocument || isLoadingSchema;
839
943
  return {
840
- components,
841
- document: data?.data,
842
- meta: data?.meta,
944
+ error,
843
945
  isLoading,
844
- schema,
845
- validate
846
- };
847
- };
848
- const useDoc = () => {
849
- const { id, slug, collectionType, origin } = useParams();
850
- const [{ query }] = useQueryParams();
851
- const params = React.useMemo(() => buildValidParams(query), [query]);
852
- if (!collectionType) {
853
- throw new Error("Could not find collectionType in url params");
854
- }
855
- if (!slug) {
856
- throw new Error("Could not find model in url params");
857
- }
858
- return {
859
- collectionType,
860
- model: slug,
861
- id: origin || id === "create" ? void 0 : id,
862
- ...useDocument(
863
- { documentId: origin || id, model: slug, collectionType, params },
864
- {
865
- skip: id === "create" || !origin && !id && collectionType !== SINGLE_TYPES
866
- }
867
- )
946
+ edit,
947
+ list: listLayout
868
948
  };
869
949
  };
870
- const prefixPluginTranslations = (trad, pluginId) => {
871
- if (!pluginId) {
872
- throw new TypeError("pluginId can't be empty");
873
- }
874
- return Object.keys(trad).reduce((acc, current) => {
875
- acc[`${pluginId}.${current}`] = trad[current];
876
- return acc;
877
- }, {});
878
- };
879
- const getTranslation = (id) => `content-manager.${id}`;
880
- const DEFAULT_UNEXPECTED_ERROR_MSG = {
881
- id: "notification.error",
882
- defaultMessage: "An error occurred, please try again"
950
+ const useDocLayout = () => {
951
+ const { model } = useDoc();
952
+ return useDocumentLayout(model);
883
953
  };
884
- const useDocumentActions = () => {
885
- const { toggleNotification } = useNotification();
886
- const { formatMessage } = useIntl();
887
- const { trackUsage } = useTracking();
888
- const { _unstableFormatAPIError: formatAPIError } = useAPIErrorHandler();
889
- const navigate = useNavigate();
890
- const [deleteDocument] = useDeleteDocumentMutation();
891
- const _delete = React.useCallback(
892
- async ({ collectionType, model, documentId, params }, trackerProperty) => {
893
- try {
894
- trackUsage("willDeleteEntry", trackerProperty);
895
- const res = await deleteDocument({
896
- collectionType,
897
- model,
898
- documentId,
899
- params
900
- });
901
- if ("error" in res) {
902
- toggleNotification({
903
- type: "danger",
904
- message: formatAPIError(res.error)
905
- });
906
- return { error: res.error };
907
- }
908
- toggleNotification({
909
- type: "success",
910
- message: formatMessage({
911
- id: getTranslation("success.record.delete"),
912
- defaultMessage: "Deleted document"
913
- })
914
- });
915
- trackUsage("didDeleteEntry", trackerProperty);
916
- return res.data;
917
- } catch (err) {
918
- toggleNotification({
919
- type: "danger",
920
- message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG)
921
- });
922
- trackUsage("didNotDeleteEntry", { error: err, ...trackerProperty });
923
- throw err;
954
+ const formatEditLayout = (data, {
955
+ schemas,
956
+ schema,
957
+ components
958
+ }) => {
959
+ let currentPanelIndex = 0;
960
+ const panelledEditAttributes = convertEditLayoutToFieldLayouts(
961
+ data.contentType.layouts.edit,
962
+ schema?.attributes,
963
+ data.contentType.metadatas,
964
+ { configurations: data.components, schemas: components },
965
+ schemas
966
+ ).reduce((panels, row) => {
967
+ if (row.some((field) => field.type === "dynamiczone")) {
968
+ panels.push([row]);
969
+ currentPanelIndex += 2;
970
+ } else {
971
+ if (!panels[currentPanelIndex]) {
972
+ panels.push([]);
924
973
  }
925
- },
926
- [trackUsage, deleteDocument, toggleNotification, formatMessage, formatAPIError]
927
- );
928
- const [deleteManyDocuments] = useDeleteManyDocumentsMutation();
929
- const deleteMany = React.useCallback(
930
- async ({ model, documentIds, params }) => {
931
- try {
932
- trackUsage("willBulkDeleteEntries");
933
- const res = await deleteManyDocuments({
934
- model,
935
- documentIds,
936
- params
937
- });
938
- if ("error" in res) {
939
- toggleNotification({
940
- type: "danger",
941
- message: formatAPIError(res.error)
942
- });
943
- return { error: res.error };
974
+ panels[currentPanelIndex].push(row);
975
+ }
976
+ return panels;
977
+ }, []);
978
+ const componentEditAttributes = Object.entries(data.components).reduce(
979
+ (acc, [uid, configuration]) => {
980
+ acc[uid] = {
981
+ layout: convertEditLayoutToFieldLayouts(
982
+ configuration.layouts.edit,
983
+ components[uid].attributes,
984
+ configuration.metadatas,
985
+ { configurations: data.components, schemas: components }
986
+ ),
987
+ settings: {
988
+ ...configuration.settings,
989
+ icon: components[uid].info.icon,
990
+ displayName: components[uid].info.displayName
944
991
  }
945
- toggleNotification({
946
- type: "success",
947
- title: formatMessage({
948
- id: getTranslation("success.records.delete"),
949
- defaultMessage: "Successfully deleted."
950
- }),
951
- message: ""
952
- });
953
- trackUsage("didBulkDeleteEntries");
954
- return res.data;
955
- } catch (err) {
956
- toggleNotification({
957
- type: "danger",
958
- message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG)
959
- });
960
- trackUsage("didNotBulkDeleteEntries");
961
- throw err;
962
- }
992
+ };
993
+ return acc;
963
994
  },
964
- [trackUsage, deleteManyDocuments, toggleNotification, formatMessage, formatAPIError]
995
+ {}
965
996
  );
966
- const [discardDocument] = useDiscardDocumentMutation();
967
- const discard = React.useCallback(
968
- async ({ collectionType, model, documentId, params }) => {
969
- try {
970
- const res = await discardDocument({
971
- collectionType,
972
- model,
973
- documentId,
974
- params
975
- });
976
- if ("error" in res) {
977
- toggleNotification({
978
- type: "danger",
979
- message: formatAPIError(res.error)
980
- });
981
- return { error: res.error };
982
- }
983
- toggleNotification({
984
- type: "success",
985
- message: formatMessage({
986
- id: "content-manager.success.record.discard",
987
- defaultMessage: "Changes discarded"
988
- })
989
- });
990
- return res.data;
991
- } catch (err) {
992
- toggleNotification({
993
- type: "danger",
994
- message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG)
995
- });
996
- throw err;
997
- }
997
+ const editMetadatas = Object.entries(data.contentType.metadatas).reduce(
998
+ (acc, [attribute, metadata]) => {
999
+ return {
1000
+ ...acc,
1001
+ [attribute]: metadata.edit
1002
+ };
998
1003
  },
999
- [discardDocument, formatAPIError, formatMessage, toggleNotification]
1004
+ {}
1000
1005
  );
1001
- const [publishDocument] = usePublishDocumentMutation();
1002
- const publish = React.useCallback(
1003
- async ({ collectionType, model, documentId, params }, data) => {
1004
- try {
1005
- trackUsage("willPublishEntry");
1006
- const res = await publishDocument({
1007
- collectionType,
1008
- model,
1009
- documentId,
1010
- data,
1011
- params
1012
- });
1013
- if ("error" in res) {
1014
- toggleNotification({ type: "danger", message: formatAPIError(res.error) });
1015
- return { error: res.error };
1016
- }
1017
- trackUsage("didPublishEntry");
1018
- toggleNotification({
1019
- type: "success",
1020
- message: formatMessage({
1021
- id: getTranslation("success.record.publish"),
1022
- defaultMessage: "Published document"
1023
- })
1024
- });
1025
- return res.data;
1026
- } catch (err) {
1027
- toggleNotification({
1028
- type: "danger",
1029
- message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG)
1030
- });
1031
- throw err;
1032
- }
1006
+ return {
1007
+ layout: panelledEditAttributes,
1008
+ components: componentEditAttributes,
1009
+ metadatas: editMetadatas,
1010
+ settings: {
1011
+ ...data.contentType.settings,
1012
+ displayName: schema?.info.displayName
1033
1013
  },
1034
- [trackUsage, publishDocument, toggleNotification, formatMessage, formatAPIError]
1035
- );
1036
- const [publishManyDocuments] = usePublishManyDocumentsMutation();
1037
- const publishMany = React.useCallback(
1038
- async ({ model, documentIds, params }) => {
1039
- try {
1040
- const res = await publishManyDocuments({
1041
- model,
1042
- documentIds,
1043
- params
1044
- });
1045
- if ("error" in res) {
1046
- toggleNotification({ type: "danger", message: formatAPIError(res.error) });
1047
- return { error: res.error };
1048
- }
1049
- toggleNotification({
1050
- type: "success",
1051
- message: formatMessage({
1052
- id: getTranslation("success.record.publish"),
1053
- defaultMessage: "Published document"
1054
- })
1055
- });
1056
- return res.data;
1057
- } catch (err) {
1058
- toggleNotification({
1059
- type: "danger",
1060
- message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG)
1061
- });
1062
- throw err;
1014
+ options: {
1015
+ ...schema?.options,
1016
+ ...schema?.pluginOptions,
1017
+ ...data.contentType.options
1018
+ }
1019
+ };
1020
+ };
1021
+ const convertEditLayoutToFieldLayouts = (rows, attributes = {}, metadatas, components, schemas = []) => {
1022
+ return rows.map(
1023
+ (row) => row.map((field) => {
1024
+ const attribute = attributes[field.name];
1025
+ if (!attribute) {
1026
+ return null;
1063
1027
  }
1064
- },
1065
- [
1066
- // trackUsage,
1067
- publishManyDocuments,
1068
- toggleNotification,
1069
- formatMessage,
1070
- formatAPIError
1071
- ]
1028
+ const { edit: metadata } = metadatas[field.name];
1029
+ const settings = attribute.type === "component" && components ? components.configurations[attribute.component].settings : {};
1030
+ return {
1031
+ attribute,
1032
+ disabled: !metadata.editable,
1033
+ hint: metadata.description,
1034
+ label: metadata.label ?? "",
1035
+ name: field.name,
1036
+ // @ts-expect-error – mainField does exist on the metadata for a relation.
1037
+ mainField: getMainField(attribute, metadata.mainField || settings.mainField, {
1038
+ schemas,
1039
+ components: components?.schemas ?? {}
1040
+ }),
1041
+ placeholder: metadata.placeholder ?? "",
1042
+ required: attribute.required ?? false,
1043
+ size: field.size,
1044
+ unique: "unique" in attribute ? attribute.unique : false,
1045
+ visible: metadata.visible ?? true,
1046
+ type: attribute.type
1047
+ };
1048
+ }).filter((field) => field !== null)
1072
1049
  );
1073
- const [updateDocument] = useUpdateDocumentMutation();
1074
- const update = React.useCallback(
1075
- async ({ collectionType, model, documentId, params }, data, trackerProperty) => {
1076
- try {
1077
- trackUsage("willEditEntry", trackerProperty);
1078
- const res = await updateDocument({
1079
- collectionType,
1080
- model,
1081
- documentId,
1082
- data,
1083
- params
1084
- });
1085
- if ("error" in res) {
1086
- toggleNotification({ type: "danger", message: formatAPIError(res.error) });
1087
- trackUsage("didNotEditEntry", { error: res.error, ...trackerProperty });
1088
- return { error: res.error };
1050
+ };
1051
+ const formatListLayout = (data, {
1052
+ schemas,
1053
+ schema,
1054
+ components
1055
+ }) => {
1056
+ const listMetadatas = Object.entries(data.contentType.metadatas).reduce(
1057
+ (acc, [attribute, metadata]) => {
1058
+ return {
1059
+ ...acc,
1060
+ [attribute]: metadata.list
1061
+ };
1062
+ },
1063
+ {}
1064
+ );
1065
+ const listAttributes = convertListLayoutToFieldLayouts(
1066
+ data.contentType.layouts.list,
1067
+ schema?.attributes,
1068
+ listMetadatas,
1069
+ { configurations: data.components, schemas: components },
1070
+ schemas
1071
+ );
1072
+ return {
1073
+ layout: listAttributes,
1074
+ settings: { ...data.contentType.settings, displayName: schema?.info.displayName },
1075
+ metadatas: listMetadatas,
1076
+ options: {
1077
+ ...schema?.options,
1078
+ ...schema?.pluginOptions,
1079
+ ...data.contentType.options
1080
+ }
1081
+ };
1082
+ };
1083
+ const convertListLayoutToFieldLayouts = (columns, attributes = {}, metadatas, components, schemas = []) => {
1084
+ return columns.map((name) => {
1085
+ const attribute = attributes[name];
1086
+ if (!attribute) {
1087
+ return null;
1088
+ }
1089
+ const metadata = metadatas[name];
1090
+ const settings = attribute.type === "component" && components ? components.configurations[attribute.component].settings : {};
1091
+ return {
1092
+ attribute,
1093
+ label: metadata.label ?? "",
1094
+ mainField: getMainField(attribute, metadata.mainField || settings.mainField, {
1095
+ schemas,
1096
+ components: components?.schemas ?? {}
1097
+ }),
1098
+ name,
1099
+ searchable: metadata.searchable ?? true,
1100
+ sortable: metadata.sortable ?? true
1101
+ };
1102
+ }).filter((field) => field !== null);
1103
+ };
1104
+ const useDocument = (args, opts) => {
1105
+ const { toggleNotification } = useNotification();
1106
+ const { _unstableFormatAPIError: formatAPIError } = useAPIErrorHandler();
1107
+ const {
1108
+ currentData: data,
1109
+ isLoading: isLoadingDocument,
1110
+ isFetching: isFetchingDocument,
1111
+ error
1112
+ } = useGetDocumentQuery(args, {
1113
+ ...opts,
1114
+ skip: !args.documentId && args.collectionType !== SINGLE_TYPES || opts?.skip
1115
+ });
1116
+ const {
1117
+ components,
1118
+ schema,
1119
+ schemas,
1120
+ isLoading: isLoadingSchema
1121
+ } = useContentTypeSchema(args.model);
1122
+ React.useEffect(() => {
1123
+ if (error) {
1124
+ toggleNotification({
1125
+ type: "danger",
1126
+ message: formatAPIError(error)
1127
+ });
1128
+ }
1129
+ }, [toggleNotification, error, formatAPIError, args.collectionType]);
1130
+ const validationSchema = React.useMemo(() => {
1131
+ if (!schema) {
1132
+ return null;
1133
+ }
1134
+ return createYupSchema(schema.attributes, components);
1135
+ }, [schema, components]);
1136
+ const validate = React.useCallback(
1137
+ (document) => {
1138
+ if (!validationSchema) {
1139
+ throw new Error(
1140
+ "There is no validation schema generated, this is likely due to the schema not being loaded yet."
1141
+ );
1142
+ }
1143
+ try {
1144
+ validationSchema.validateSync(document, { abortEarly: false, strict: true });
1145
+ return null;
1146
+ } catch (error2) {
1147
+ if (error2 instanceof ValidationError) {
1148
+ return getYupValidationErrors(error2);
1089
1149
  }
1090
- trackUsage("didEditEntry", trackerProperty);
1091
- toggleNotification({
1092
- type: "success",
1093
- message: formatMessage({
1094
- id: getTranslation("success.record.save"),
1095
- defaultMessage: "Saved document"
1096
- })
1097
- });
1098
- return res.data;
1099
- } catch (err) {
1100
- trackUsage("didNotEditEntry", { error: err, ...trackerProperty });
1101
- toggleNotification({
1102
- type: "danger",
1103
- message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG)
1104
- });
1105
- throw err;
1150
+ throw error2;
1106
1151
  }
1107
1152
  },
1108
- [trackUsage, updateDocument, toggleNotification, formatMessage, formatAPIError]
1153
+ [validationSchema]
1109
1154
  );
1110
- const [unpublishDocument] = useUnpublishDocumentMutation();
1111
- const unpublish = React.useCallback(
1112
- async ({ collectionType, model, documentId, params }, discardDraft = false) => {
1155
+ const isLoading = isLoadingDocument || isFetchingDocument || isLoadingSchema;
1156
+ const hasError = !!error;
1157
+ return {
1158
+ components,
1159
+ document: data?.data,
1160
+ meta: data?.meta,
1161
+ isLoading,
1162
+ hasError,
1163
+ schema,
1164
+ schemas,
1165
+ validate
1166
+ };
1167
+ };
1168
+ const useDoc = () => {
1169
+ const { id, slug, collectionType, origin } = useParams();
1170
+ const [{ query }] = useQueryParams();
1171
+ const params = React.useMemo(() => buildValidParams(query), [query]);
1172
+ if (!collectionType) {
1173
+ throw new Error("Could not find collectionType in url params");
1174
+ }
1175
+ if (!slug) {
1176
+ throw new Error("Could not find model in url params");
1177
+ }
1178
+ const document = useDocument(
1179
+ { documentId: origin || id, model: slug, collectionType, params },
1180
+ {
1181
+ skip: id === "create" || !origin && !id && collectionType !== SINGLE_TYPES
1182
+ }
1183
+ );
1184
+ const returnId = origin || id === "create" ? void 0 : id;
1185
+ return {
1186
+ collectionType,
1187
+ model: slug,
1188
+ id: returnId,
1189
+ ...document
1190
+ };
1191
+ };
1192
+ const useContentManagerContext = () => {
1193
+ const {
1194
+ collectionType,
1195
+ model,
1196
+ id,
1197
+ components,
1198
+ isLoading: isLoadingDoc,
1199
+ schema,
1200
+ schemas
1201
+ } = useDoc();
1202
+ const layout = useDocumentLayout(model);
1203
+ const form = useForm("useContentManagerContext", (state) => state);
1204
+ const isSingleType = collectionType === SINGLE_TYPES;
1205
+ const slug = model;
1206
+ const isCreatingEntry = id === "create";
1207
+ useContentTypeSchema();
1208
+ const isLoading = isLoadingDoc || layout.isLoading;
1209
+ const error = layout.error;
1210
+ return {
1211
+ error,
1212
+ isLoading,
1213
+ // Base metadata
1214
+ model,
1215
+ collectionType,
1216
+ id,
1217
+ slug,
1218
+ isCreatingEntry,
1219
+ isSingleType,
1220
+ hasDraftAndPublish: schema?.options?.draftAndPublish ?? false,
1221
+ // All schema infos
1222
+ components,
1223
+ contentType: schema,
1224
+ contentTypes: schemas,
1225
+ // Form state
1226
+ form,
1227
+ // layout infos
1228
+ layout
1229
+ };
1230
+ };
1231
+ const prefixPluginTranslations = (trad, pluginId) => {
1232
+ if (!pluginId) {
1233
+ throw new TypeError("pluginId can't be empty");
1234
+ }
1235
+ return Object.keys(trad).reduce((acc, current) => {
1236
+ acc[`${pluginId}.${current}`] = trad[current];
1237
+ return acc;
1238
+ }, {});
1239
+ };
1240
+ const getTranslation = (id) => `content-manager.${id}`;
1241
+ const DEFAULT_UNEXPECTED_ERROR_MSG = {
1242
+ id: "notification.error",
1243
+ defaultMessage: "An error occurred, please try again"
1244
+ };
1245
+ const useDocumentActions = () => {
1246
+ const { toggleNotification } = useNotification();
1247
+ const { formatMessage } = useIntl();
1248
+ const { trackUsage } = useTracking();
1249
+ const { _unstableFormatAPIError: formatAPIError } = useAPIErrorHandler();
1250
+ const navigate = useNavigate();
1251
+ const setCurrentStep = useGuidedTour("useDocumentActions", (state) => state.setCurrentStep);
1252
+ const [deleteDocument] = useDeleteDocumentMutation();
1253
+ const _delete = React.useCallback(
1254
+ async ({ collectionType, model, documentId, params }, trackerProperty) => {
1113
1255
  try {
1114
- trackUsage("willUnpublishEntry");
1115
- const res = await unpublishDocument({
1256
+ trackUsage("willDeleteEntry", trackerProperty);
1257
+ const res = await deleteDocument({
1116
1258
  collectionType,
1117
1259
  model,
1118
1260
  documentId,
1119
- params,
1120
- data: {
1121
- discardDraft
1122
- }
1261
+ params
1123
1262
  });
1124
1263
  if ("error" in res) {
1125
- toggleNotification({ type: "danger", message: formatAPIError(res.error) });
1264
+ toggleNotification({
1265
+ type: "danger",
1266
+ message: formatAPIError(res.error)
1267
+ });
1126
1268
  return { error: res.error };
1127
1269
  }
1128
- trackUsage("didUnpublishEntry");
1129
1270
  toggleNotification({
1130
1271
  type: "success",
1131
1272
  message: formatMessage({
1132
- id: getTranslation("success.record.unpublish"),
1133
- defaultMessage: "Unpublished document"
1273
+ id: getTranslation("success.record.delete"),
1274
+ defaultMessage: "Deleted document"
1134
1275
  })
1135
1276
  });
1277
+ trackUsage("didDeleteEntry", trackerProperty);
1136
1278
  return res.data;
1137
1279
  } catch (err) {
1138
1280
  toggleNotification({
1139
1281
  type: "danger",
1140
1282
  message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG)
1141
1283
  });
1284
+ trackUsage("didNotDeleteEntry", { error: err, ...trackerProperty });
1142
1285
  throw err;
1143
1286
  }
1144
1287
  },
1145
- [trackUsage, unpublishDocument, toggleNotification, formatMessage, formatAPIError]
1288
+ [trackUsage, deleteDocument, toggleNotification, formatMessage, formatAPIError]
1146
1289
  );
1147
- const [unpublishManyDocuments] = useUnpublishManyDocumentsMutation();
1148
- const unpublishMany = React.useCallback(
1290
+ const [deleteManyDocuments] = useDeleteManyDocumentsMutation();
1291
+ const deleteMany = React.useCallback(
1149
1292
  async ({ model, documentIds, params }) => {
1150
1293
  try {
1151
- trackUsage("willBulkUnpublishEntries");
1152
- const res = await unpublishManyDocuments({
1294
+ trackUsage("willBulkDeleteEntries");
1295
+ const res = await deleteManyDocuments({
1153
1296
  model,
1154
1297
  documentIds,
1155
1298
  params
1156
1299
  });
1157
1300
  if ("error" in res) {
1158
- toggleNotification({ type: "danger", message: formatAPIError(res.error) });
1301
+ toggleNotification({
1302
+ type: "danger",
1303
+ message: formatAPIError(res.error)
1304
+ });
1159
1305
  return { error: res.error };
1160
1306
  }
1161
- trackUsage("didBulkUnpublishEntries");
1162
1307
  toggleNotification({
1163
1308
  type: "success",
1164
1309
  title: formatMessage({
1165
- id: getTranslation("success.records.unpublish"),
1166
- defaultMessage: "Successfully unpublished."
1310
+ id: getTranslation("success.records.delete"),
1311
+ defaultMessage: "Successfully deleted."
1167
1312
  }),
1168
1313
  message: ""
1169
1314
  });
1315
+ trackUsage("didBulkDeleteEntries");
1170
1316
  return res.data;
1171
1317
  } catch (err) {
1172
1318
  toggleNotification({
1173
1319
  type: "danger",
1174
1320
  message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG)
1175
1321
  });
1176
- trackUsage("didNotBulkUnpublishEntries");
1322
+ trackUsage("didNotBulkDeleteEntries");
1177
1323
  throw err;
1178
1324
  }
1179
1325
  },
1180
- [trackUsage, unpublishManyDocuments, toggleNotification, formatMessage, formatAPIError]
1326
+ [trackUsage, deleteManyDocuments, toggleNotification, formatMessage, formatAPIError]
1181
1327
  );
1182
- const [createDocument] = useCreateDocumentMutation();
1183
- const create = React.useCallback(
1184
- async ({ model, params }, data, trackerProperty) => {
1328
+ const [discardDocument] = useDiscardDocumentMutation();
1329
+ const discard = React.useCallback(
1330
+ async ({ collectionType, model, documentId, params }) => {
1185
1331
  try {
1186
- const res = await createDocument({
1332
+ const res = await discardDocument({
1333
+ collectionType,
1187
1334
  model,
1188
- data,
1335
+ documentId,
1189
1336
  params
1190
1337
  });
1191
1338
  if ("error" in res) {
1192
- toggleNotification({ type: "danger", message: formatAPIError(res.error) });
1193
- trackUsage("didNotCreateEntry", { error: res.error, ...trackerProperty });
1339
+ toggleNotification({
1340
+ type: "danger",
1341
+ message: formatAPIError(res.error)
1342
+ });
1194
1343
  return { error: res.error };
1195
1344
  }
1196
- trackUsage("didCreateEntry", trackerProperty);
1197
1345
  toggleNotification({
1198
1346
  type: "success",
1199
1347
  message: formatMessage({
1200
- id: getTranslation("success.record.save"),
1201
- defaultMessage: "Saved document"
1348
+ id: "content-manager.success.record.discard",
1349
+ defaultMessage: "Changes discarded"
1350
+ })
1351
+ });
1352
+ return res.data;
1353
+ } catch (err) {
1354
+ toggleNotification({
1355
+ type: "danger",
1356
+ message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG)
1357
+ });
1358
+ throw err;
1359
+ }
1360
+ },
1361
+ [discardDocument, formatAPIError, formatMessage, toggleNotification]
1362
+ );
1363
+ const [publishDocument] = usePublishDocumentMutation();
1364
+ const publish = React.useCallback(
1365
+ async ({ collectionType, model, documentId, params }, data) => {
1366
+ try {
1367
+ trackUsage("willPublishEntry");
1368
+ const res = await publishDocument({
1369
+ collectionType,
1370
+ model,
1371
+ documentId,
1372
+ data,
1373
+ params
1374
+ });
1375
+ if ("error" in res) {
1376
+ toggleNotification({ type: "danger", message: formatAPIError(res.error) });
1377
+ return { error: res.error };
1378
+ }
1379
+ trackUsage("didPublishEntry");
1380
+ toggleNotification({
1381
+ type: "success",
1382
+ message: formatMessage({
1383
+ id: getTranslation("success.record.publish"),
1384
+ defaultMessage: "Published document"
1385
+ })
1386
+ });
1387
+ return res.data;
1388
+ } catch (err) {
1389
+ toggleNotification({
1390
+ type: "danger",
1391
+ message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG)
1392
+ });
1393
+ throw err;
1394
+ }
1395
+ },
1396
+ [trackUsage, publishDocument, toggleNotification, formatMessage, formatAPIError]
1397
+ );
1398
+ const [publishManyDocuments] = usePublishManyDocumentsMutation();
1399
+ const publishMany = React.useCallback(
1400
+ async ({ model, documentIds, params }) => {
1401
+ try {
1402
+ const res = await publishManyDocuments({
1403
+ model,
1404
+ documentIds,
1405
+ params
1406
+ });
1407
+ if ("error" in res) {
1408
+ toggleNotification({ type: "danger", message: formatAPIError(res.error) });
1409
+ return { error: res.error };
1410
+ }
1411
+ toggleNotification({
1412
+ type: "success",
1413
+ message: formatMessage({
1414
+ id: getTranslation("success.record.publish"),
1415
+ defaultMessage: "Published document"
1416
+ })
1417
+ });
1418
+ return res.data;
1419
+ } catch (err) {
1420
+ toggleNotification({
1421
+ type: "danger",
1422
+ message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG)
1423
+ });
1424
+ throw err;
1425
+ }
1426
+ },
1427
+ [
1428
+ // trackUsage,
1429
+ publishManyDocuments,
1430
+ toggleNotification,
1431
+ formatMessage,
1432
+ formatAPIError
1433
+ ]
1434
+ );
1435
+ const [updateDocument] = useUpdateDocumentMutation();
1436
+ const update = React.useCallback(
1437
+ async ({ collectionType, model, documentId, params }, data, trackerProperty) => {
1438
+ try {
1439
+ trackUsage("willEditEntry", trackerProperty);
1440
+ const res = await updateDocument({
1441
+ collectionType,
1442
+ model,
1443
+ documentId,
1444
+ data,
1445
+ params
1446
+ });
1447
+ if ("error" in res) {
1448
+ toggleNotification({ type: "danger", message: formatAPIError(res.error) });
1449
+ trackUsage("didNotEditEntry", { error: res.error, ...trackerProperty });
1450
+ return { error: res.error };
1451
+ }
1452
+ trackUsage("didEditEntry", trackerProperty);
1453
+ toggleNotification({
1454
+ type: "success",
1455
+ message: formatMessage({
1456
+ id: getTranslation("success.record.save"),
1457
+ defaultMessage: "Saved document"
1458
+ })
1459
+ });
1460
+ return res.data;
1461
+ } catch (err) {
1462
+ trackUsage("didNotEditEntry", { error: err, ...trackerProperty });
1463
+ toggleNotification({
1464
+ type: "danger",
1465
+ message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG)
1466
+ });
1467
+ throw err;
1468
+ }
1469
+ },
1470
+ [trackUsage, updateDocument, toggleNotification, formatMessage, formatAPIError]
1471
+ );
1472
+ const [unpublishDocument] = useUnpublishDocumentMutation();
1473
+ const unpublish = React.useCallback(
1474
+ async ({ collectionType, model, documentId, params }, discardDraft = false) => {
1475
+ try {
1476
+ trackUsage("willUnpublishEntry");
1477
+ const res = await unpublishDocument({
1478
+ collectionType,
1479
+ model,
1480
+ documentId,
1481
+ params,
1482
+ data: {
1483
+ discardDraft
1484
+ }
1485
+ });
1486
+ if ("error" in res) {
1487
+ toggleNotification({ type: "danger", message: formatAPIError(res.error) });
1488
+ return { error: res.error };
1489
+ }
1490
+ trackUsage("didUnpublishEntry");
1491
+ toggleNotification({
1492
+ type: "success",
1493
+ message: formatMessage({
1494
+ id: getTranslation("success.record.unpublish"),
1495
+ defaultMessage: "Unpublished document"
1496
+ })
1497
+ });
1498
+ return res.data;
1499
+ } catch (err) {
1500
+ toggleNotification({
1501
+ type: "danger",
1502
+ message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG)
1503
+ });
1504
+ throw err;
1505
+ }
1506
+ },
1507
+ [trackUsage, unpublishDocument, toggleNotification, formatMessage, formatAPIError]
1508
+ );
1509
+ const [unpublishManyDocuments] = useUnpublishManyDocumentsMutation();
1510
+ const unpublishMany = React.useCallback(
1511
+ async ({ model, documentIds, params }) => {
1512
+ try {
1513
+ trackUsage("willBulkUnpublishEntries");
1514
+ const res = await unpublishManyDocuments({
1515
+ model,
1516
+ documentIds,
1517
+ params
1518
+ });
1519
+ if ("error" in res) {
1520
+ toggleNotification({ type: "danger", message: formatAPIError(res.error) });
1521
+ return { error: res.error };
1522
+ }
1523
+ trackUsage("didBulkUnpublishEntries");
1524
+ toggleNotification({
1525
+ type: "success",
1526
+ title: formatMessage({
1527
+ id: getTranslation("success.records.unpublish"),
1528
+ defaultMessage: "Successfully unpublished."
1529
+ }),
1530
+ message: ""
1531
+ });
1532
+ return res.data;
1533
+ } catch (err) {
1534
+ toggleNotification({
1535
+ type: "danger",
1536
+ message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG)
1537
+ });
1538
+ trackUsage("didNotBulkUnpublishEntries");
1539
+ throw err;
1540
+ }
1541
+ },
1542
+ [trackUsage, unpublishManyDocuments, toggleNotification, formatMessage, formatAPIError]
1543
+ );
1544
+ const [createDocument] = useCreateDocumentMutation();
1545
+ const create = React.useCallback(
1546
+ async ({ model, params }, data, trackerProperty) => {
1547
+ try {
1548
+ const res = await createDocument({
1549
+ model,
1550
+ data,
1551
+ params
1552
+ });
1553
+ if ("error" in res) {
1554
+ toggleNotification({ type: "danger", message: formatAPIError(res.error) });
1555
+ trackUsage("didNotCreateEntry", { error: res.error, ...trackerProperty });
1556
+ return { error: res.error };
1557
+ }
1558
+ trackUsage("didCreateEntry", trackerProperty);
1559
+ toggleNotification({
1560
+ type: "success",
1561
+ message: formatMessage({
1562
+ id: getTranslation("success.record.save"),
1563
+ defaultMessage: "Saved document"
1202
1564
  })
1203
1565
  });
1566
+ setCurrentStep("contentManager.success");
1204
1567
  return res.data;
1205
1568
  } catch (err) {
1206
1569
  toggleNotification({
@@ -1303,7 +1666,7 @@ const useDocumentActions = () => {
1303
1666
  };
1304
1667
  };
1305
1668
  const ProtectedHistoryPage = lazy(
1306
- () => import("./History-BowL3JKP.mjs").then((mod) => ({ default: mod.ProtectedHistoryPage }))
1669
+ () => import("./History-M6Pk9CoY.mjs").then((mod) => ({ default: mod.ProtectedHistoryPage }))
1307
1670
  );
1308
1671
  const routes$1 = [
1309
1672
  {
@@ -1316,31 +1679,31 @@ const routes$1 = [
1316
1679
  }
1317
1680
  ];
1318
1681
  const ProtectedEditViewPage = lazy(
1319
- () => import("./EditViewPage-De8GyU8P.mjs").then((mod) => ({ default: mod.ProtectedEditViewPage }))
1682
+ () => import("./EditViewPage-Ca2EmJpb.mjs").then((mod) => ({ default: mod.ProtectedEditViewPage }))
1320
1683
  );
1321
1684
  const ProtectedListViewPage = lazy(
1322
- () => import("./ListViewPage-CXFUjZQC.mjs").then((mod) => ({ default: mod.ProtectedListViewPage }))
1685
+ () => import("./ListViewPage-BH37wONY.mjs").then((mod) => ({ default: mod.ProtectedListViewPage }))
1323
1686
  );
1324
1687
  const ProtectedListConfiguration = lazy(
1325
- () => import("./ListConfigurationPage-BpVOB-hn.mjs").then((mod) => ({
1688
+ () => import("./ListConfigurationPage-D7ior2zq.mjs").then((mod) => ({
1326
1689
  default: mod.ProtectedListConfiguration
1327
1690
  }))
1328
1691
  );
1329
1692
  const ProtectedEditConfigurationPage = lazy(
1330
- () => import("./EditConfigurationPage-CjUrEewK.mjs").then((mod) => ({
1693
+ () => import("./EditConfigurationPage-DSA1zONV.mjs").then((mod) => ({
1331
1694
  default: mod.ProtectedEditConfigurationPage
1332
1695
  }))
1333
1696
  );
1334
1697
  const ProtectedComponentConfigurationPage = lazy(
1335
- () => import("./ComponentConfigurationPage-qemkOlnj.mjs").then((mod) => ({
1698
+ () => import("./ComponentConfigurationPage-B2g3icXu.mjs").then((mod) => ({
1336
1699
  default: mod.ProtectedComponentConfigurationPage
1337
1700
  }))
1338
1701
  );
1339
1702
  const NoPermissions = lazy(
1340
- () => import("./NoPermissionsPage-DVz3mzDz.mjs").then((mod) => ({ default: mod.NoPermissions }))
1703
+ () => import("./NoPermissionsPage-CzhRt5CA.mjs").then((mod) => ({ default: mod.NoPermissions }))
1341
1704
  );
1342
1705
  const NoContentType = lazy(
1343
- () => import("./NoContentTypePage-DuhOTp3x.mjs").then((mod) => ({ default: mod.NoContentType }))
1706
+ () => import("./NoContentTypePage-DRp7Aem_.mjs").then((mod) => ({ default: mod.NoContentType }))
1344
1707
  );
1345
1708
  const CollectionTypePages = () => {
1346
1709
  const { collectionType } = useParams();
@@ -1394,1067 +1757,749 @@ const DocumentActions = ({ actions: actions2 }) => {
1394
1757
  if (action.position === void 0) {
1395
1758
  return true;
1396
1759
  }
1397
- const positions = Array.isArray(action.position) ? action.position : [action.position];
1398
- return positions.includes("panel");
1399
- });
1400
- if (!primaryAction) {
1401
- return null;
1402
- }
1403
- return /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 2, alignItems: "stretch", width: "100%", children: [
1404
- /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
1405
- /* @__PURE__ */ jsx(DocumentActionButton, { ...primaryAction, variant: primaryAction.variant || "default" }),
1406
- restActions.length > 0 ? /* @__PURE__ */ jsx(
1407
- DocumentActionsMenu,
1408
- {
1409
- actions: restActions,
1410
- label: formatMessage({
1411
- id: "content-manager.containers.edit.panels.default.more-actions",
1412
- defaultMessage: "More document actions"
1413
- })
1414
- }
1415
- ) : null
1416
- ] }),
1417
- secondaryAction ? /* @__PURE__ */ jsx(
1418
- DocumentActionButton,
1419
- {
1420
- ...secondaryAction,
1421
- variant: secondaryAction.variant || "secondary"
1422
- }
1423
- ) : null
1424
- ] });
1425
- };
1426
- const DocumentActionButton = (action) => {
1427
- const [dialogId, setDialogId] = React.useState(null);
1428
- const { toggleNotification } = useNotification();
1429
- const handleClick = (action2) => async (e) => {
1430
- const { onClick = () => false, dialog, id } = action2;
1431
- const muteDialog = await onClick(e);
1432
- if (dialog && !muteDialog) {
1433
- switch (dialog.type) {
1434
- case "notification":
1435
- toggleNotification({
1436
- title: dialog.title,
1437
- message: dialog.content,
1438
- type: dialog.status,
1439
- timeout: dialog.timeout,
1440
- onClose: dialog.onClose
1441
- });
1442
- break;
1443
- case "dialog":
1444
- case "modal":
1445
- e.preventDefault();
1446
- setDialogId(id);
1447
- }
1448
- }
1449
- };
1450
- const handleClose = () => {
1451
- setDialogId(null);
1452
- };
1453
- return /* @__PURE__ */ jsxs(Fragment, { children: [
1454
- /* @__PURE__ */ jsx(
1455
- Button,
1456
- {
1457
- flex: "auto",
1458
- startIcon: action.icon,
1459
- disabled: action.disabled,
1460
- onClick: handleClick(action),
1461
- justifyContent: "center",
1462
- variant: action.variant || "default",
1463
- paddingTop: "7px",
1464
- paddingBottom: "7px",
1465
- children: action.label
1466
- }
1467
- ),
1468
- action.dialog?.type === "dialog" ? /* @__PURE__ */ jsx(
1469
- DocumentActionConfirmDialog,
1470
- {
1471
- ...action.dialog,
1472
- variant: action.dialog?.variant ?? action.variant,
1473
- isOpen: dialogId === action.id,
1474
- onClose: handleClose
1475
- }
1476
- ) : null,
1477
- action.dialog?.type === "modal" ? /* @__PURE__ */ jsx(
1478
- DocumentActionModal,
1479
- {
1480
- ...action.dialog,
1481
- onModalClose: handleClose,
1482
- isOpen: dialogId === action.id
1483
- }
1484
- ) : null
1485
- ] });
1486
- };
1487
- const DocumentActionsMenu = ({
1488
- actions: actions2,
1489
- children,
1490
- label,
1491
- variant = "tertiary"
1492
- }) => {
1493
- const [isOpen, setIsOpen] = React.useState(false);
1494
- const [dialogId, setDialogId] = React.useState(null);
1495
- const { formatMessage } = useIntl();
1496
- const { toggleNotification } = useNotification();
1497
- const isDisabled = actions2.every((action) => action.disabled) || actions2.length === 0;
1498
- const handleClick = (action) => async (e) => {
1499
- const { onClick = () => false, dialog, id } = action;
1500
- const muteDialog = await onClick(e);
1501
- if (dialog && !muteDialog) {
1502
- switch (dialog.type) {
1503
- case "notification":
1504
- toggleNotification({
1505
- title: dialog.title,
1506
- message: dialog.content,
1507
- type: dialog.status,
1508
- timeout: dialog.timeout,
1509
- onClose: dialog.onClose
1510
- });
1511
- break;
1512
- case "dialog":
1513
- case "modal":
1514
- setDialogId(id);
1515
- }
1516
- }
1517
- };
1518
- const handleClose = () => {
1519
- setDialogId(null);
1520
- setIsOpen(false);
1521
- };
1522
- return /* @__PURE__ */ jsxs(Menu.Root, { open: isOpen, onOpenChange: setIsOpen, children: [
1523
- /* @__PURE__ */ jsxs(
1524
- StyledMoreButton,
1525
- {
1526
- disabled: isDisabled,
1527
- size: "S",
1528
- endIcon: null,
1529
- paddingTop: "4px",
1530
- paddingLeft: "7px",
1531
- paddingRight: "7px",
1532
- variant,
1533
- children: [
1534
- /* @__PURE__ */ jsx(More, { "aria-hidden": true, focusable: false }),
1535
- /* @__PURE__ */ jsx(VisuallyHidden, { tag: "span", children: label || formatMessage({
1536
- id: "content-manager.containers.edit.panels.default.more-actions",
1537
- defaultMessage: "More document actions"
1538
- }) })
1539
- ]
1540
- }
1541
- ),
1542
- /* @__PURE__ */ jsxs(Menu.Content, { top: "4px", maxHeight: void 0, popoverPlacement: "bottom-end", children: [
1543
- actions2.map((action) => {
1544
- return /* @__PURE__ */ jsx(
1545
- Menu.Item,
1546
- {
1547
- disabled: action.disabled,
1548
- onSelect: handleClick(action),
1549
- display: "block",
1550
- children: /* @__PURE__ */ jsxs(Flex, { justifyContent: "space-between", gap: 4, children: [
1551
- /* @__PURE__ */ jsxs(
1552
- Flex,
1553
- {
1554
- color: !action.disabled ? convertActionVariantToColor(action.variant) : "inherit",
1555
- gap: 2,
1556
- tag: "span",
1557
- children: [
1558
- /* @__PURE__ */ jsx(
1559
- Flex,
1560
- {
1561
- tag: "span",
1562
- color: !action.disabled ? convertActionVariantToIconColor(action.variant) : "inherit",
1563
- children: action.icon
1564
- }
1565
- ),
1566
- action.label
1567
- ]
1568
- }
1569
- ),
1570
- action.id.startsWith("HistoryAction") && /* @__PURE__ */ jsx(
1571
- Flex,
1572
- {
1573
- alignItems: "center",
1574
- background: "alternative100",
1575
- borderStyle: "solid",
1576
- borderColor: "alternative200",
1577
- borderWidth: "1px",
1578
- height: 5,
1579
- paddingLeft: 2,
1580
- paddingRight: 2,
1581
- hasRadius: true,
1582
- color: "alternative600",
1583
- children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", fontWeight: "bold", lineHeight: 1, children: formatMessage({ id: "global.new", defaultMessage: "New" }) })
1584
- }
1585
- )
1586
- ] })
1587
- },
1588
- action.id
1589
- );
1590
- }),
1591
- children
1592
- ] }),
1593
- actions2.map((action) => {
1594
- return /* @__PURE__ */ jsxs(React.Fragment, { children: [
1595
- action.dialog?.type === "dialog" ? /* @__PURE__ */ jsx(
1596
- DocumentActionConfirmDialog,
1597
- {
1598
- ...action.dialog,
1599
- variant: action.variant,
1600
- isOpen: dialogId === action.id,
1601
- onClose: handleClose
1602
- }
1603
- ) : null,
1604
- action.dialog?.type === "modal" ? /* @__PURE__ */ jsx(
1605
- DocumentActionModal,
1606
- {
1607
- ...action.dialog,
1608
- onModalClose: handleClose,
1609
- isOpen: dialogId === action.id
1610
- }
1611
- ) : null
1612
- ] }, action.id);
1613
- })
1614
- ] });
1615
- };
1616
- const convertActionVariantToColor = (variant = "secondary") => {
1617
- switch (variant) {
1618
- case "danger":
1619
- return "danger600";
1620
- case "secondary":
1621
- return void 0;
1622
- case "success":
1623
- return "success600";
1624
- default:
1625
- return "primary600";
1626
- }
1627
- };
1628
- const convertActionVariantToIconColor = (variant = "secondary") => {
1629
- switch (variant) {
1630
- case "danger":
1631
- return "danger600";
1632
- case "secondary":
1633
- return "neutral500";
1634
- case "success":
1635
- return "success600";
1636
- default:
1637
- return "primary600";
1638
- }
1639
- };
1640
- const StyledMoreButton = styled(Menu.Trigger)`
1641
- & > span {
1642
- display: flex;
1643
- }
1644
- `;
1645
- const DocumentActionConfirmDialog = ({
1646
- onClose,
1647
- onCancel,
1648
- onConfirm,
1649
- title,
1650
- content,
1651
- isOpen,
1652
- variant = "secondary"
1653
- }) => {
1654
- const { formatMessage } = useIntl();
1655
- const handleClose = async () => {
1656
- if (onCancel) {
1657
- await onCancel();
1658
- }
1659
- onClose();
1660
- };
1661
- const handleConfirm = async () => {
1662
- if (onConfirm) {
1663
- await onConfirm();
1664
- }
1665
- onClose();
1666
- };
1667
- return /* @__PURE__ */ jsx(Dialog.Root, { open: isOpen, onOpenChange: handleClose, children: /* @__PURE__ */ jsxs(Dialog.Content, { children: [
1668
- /* @__PURE__ */ jsx(Dialog.Header, { children: title }),
1669
- /* @__PURE__ */ jsx(Dialog.Body, { children: content }),
1670
- /* @__PURE__ */ jsxs(Dialog.Footer, { children: [
1671
- /* @__PURE__ */ jsx(Dialog.Cancel, { children: /* @__PURE__ */ jsx(Button, { variant: "tertiary", children: formatMessage({
1672
- id: "app.components.Button.cancel",
1673
- defaultMessage: "Cancel"
1674
- }) }) }),
1675
- /* @__PURE__ */ jsx(Button, { onClick: handleConfirm, variant, children: formatMessage({
1676
- id: "app.components.Button.confirm",
1677
- defaultMessage: "Confirm"
1678
- }) })
1679
- ] })
1680
- ] }) });
1681
- };
1682
- const DocumentActionModal = ({
1683
- isOpen,
1684
- title,
1685
- onClose,
1686
- footer: Footer,
1687
- content: Content,
1688
- onModalClose
1689
- }) => {
1690
- const handleClose = () => {
1691
- if (onClose) {
1692
- onClose();
1693
- }
1694
- onModalClose();
1695
- };
1696
- return /* @__PURE__ */ jsx(Modal.Root, { open: isOpen, onOpenChange: handleClose, children: /* @__PURE__ */ jsxs(Modal.Content, { children: [
1697
- /* @__PURE__ */ jsx(Modal.Header, { children: /* @__PURE__ */ jsx(Modal.Title, { children: title }) }),
1698
- typeof Content === "function" ? /* @__PURE__ */ jsx(Content, { onClose: handleClose }) : /* @__PURE__ */ jsx(Modal.Body, { children: Content }),
1699
- typeof Footer === "function" ? /* @__PURE__ */ jsx(Footer, { onClose: handleClose }) : Footer
1700
- ] }) });
1701
- };
1702
- const PublishAction$1 = ({
1703
- activeTab,
1704
- documentId,
1705
- model,
1706
- collectionType,
1707
- meta,
1708
- document
1709
- }) => {
1710
- const { schema } = useDoc();
1711
- const navigate = useNavigate();
1712
- const { toggleNotification } = useNotification();
1713
- const { _unstableFormatValidationErrors: formatValidationErrors } = useAPIErrorHandler();
1714
- const isListView = useMatch(LIST_PATH) !== null;
1715
- const isCloning = useMatch(CLONE_PATH) !== null;
1716
- const { formatMessage } = useIntl();
1717
- const canPublish = useDocumentRBAC("PublishAction", ({ canPublish: canPublish2 }) => canPublish2);
1718
- const { publish } = useDocumentActions();
1719
- const [
1720
- countDraftRelations,
1721
- { isLoading: isLoadingDraftRelations, isError: isErrorDraftRelations }
1722
- ] = useLazyGetDraftRelationCountQuery();
1723
- const [localCountOfDraftRelations, setLocalCountOfDraftRelations] = React.useState(0);
1724
- const [serverCountOfDraftRelations, setServerCountOfDraftRelations] = React.useState(0);
1725
- const [{ query, rawQuery }] = useQueryParams();
1726
- const params = React.useMemo(() => buildValidParams(query), [query]);
1727
- const modified = useForm("PublishAction", ({ modified: modified2 }) => modified2);
1728
- const setSubmitting = useForm("PublishAction", ({ setSubmitting: setSubmitting2 }) => setSubmitting2);
1729
- const isSubmitting = useForm("PublishAction", ({ isSubmitting: isSubmitting2 }) => isSubmitting2);
1730
- const validate = useForm("PublishAction", (state) => state.validate);
1731
- const setErrors = useForm("PublishAction", (state) => state.setErrors);
1732
- const formValues = useForm("PublishAction", ({ values }) => values);
1733
- React.useEffect(() => {
1734
- if (isErrorDraftRelations) {
1735
- toggleNotification({
1736
- type: "danger",
1737
- message: formatMessage({
1738
- id: getTranslation("error.records.fetch-draft-relatons"),
1739
- defaultMessage: "An error occurred while fetching draft relations on this document."
1740
- })
1741
- });
1742
- }
1743
- }, [isErrorDraftRelations, toggleNotification, formatMessage]);
1744
- React.useEffect(() => {
1745
- const localDraftRelations = /* @__PURE__ */ new Set();
1746
- const extractDraftRelations = (data) => {
1747
- const relations = data.connect || [];
1748
- relations.forEach((relation) => {
1749
- if (relation.status === "draft") {
1750
- localDraftRelations.add(relation.id);
1751
- }
1752
- });
1753
- };
1754
- const traverseAndExtract = (data) => {
1755
- Object.entries(data).forEach(([key, value]) => {
1756
- if (key === "connect" && Array.isArray(value)) {
1757
- extractDraftRelations({ connect: value });
1758
- } else if (typeof value === "object" && value !== null) {
1759
- traverseAndExtract(value);
1760
- }
1761
- });
1762
- };
1763
- if (!documentId || modified) {
1764
- traverseAndExtract(formValues);
1765
- setLocalCountOfDraftRelations(localDraftRelations.size);
1766
- }
1767
- }, [documentId, modified, formValues, setLocalCountOfDraftRelations]);
1768
- React.useEffect(() => {
1769
- if (documentId && !isListView) {
1770
- const fetchDraftRelationsCount = async () => {
1771
- const { data, error } = await countDraftRelations({
1772
- collectionType,
1773
- model,
1774
- documentId,
1775
- params
1776
- });
1777
- if (error) {
1778
- throw error;
1779
- }
1780
- if (data) {
1781
- setServerCountOfDraftRelations(data.data);
1782
- }
1783
- };
1784
- fetchDraftRelationsCount();
1785
- }
1786
- }, [isListView, documentId, countDraftRelations, collectionType, model, params]);
1787
- const isDocumentPublished = (document?.[PUBLISHED_AT_ATTRIBUTE_NAME] || meta?.availableStatus.some((doc) => doc[PUBLISHED_AT_ATTRIBUTE_NAME] !== null)) && document?.status !== "modified";
1788
- if (!schema?.options?.draftAndPublish) {
1760
+ const positions = Array.isArray(action.position) ? action.position : [action.position];
1761
+ return positions.includes("panel");
1762
+ });
1763
+ if (!primaryAction) {
1789
1764
  return null;
1790
1765
  }
1791
- const performPublish = async () => {
1792
- setSubmitting(true);
1793
- try {
1794
- const { errors } = await validate();
1795
- if (errors) {
1796
- toggleNotification({
1797
- type: "danger",
1798
- message: formatMessage({
1799
- id: "content-manager.validation.error",
1800
- defaultMessage: "There are validation errors in your document. Please fix them before saving."
1801
- })
1802
- });
1803
- return;
1804
- }
1805
- const res = await publish(
1806
- {
1807
- collectionType,
1808
- model,
1809
- documentId,
1810
- params
1811
- },
1812
- formValues
1813
- );
1814
- if ("data" in res && collectionType !== SINGLE_TYPES) {
1815
- navigate({
1816
- pathname: `../${collectionType}/${model}/${res.data.documentId}`,
1817
- search: rawQuery
1818
- });
1819
- } else if ("error" in res && isBaseQueryError(res.error) && res.error.name === "ValidationError") {
1820
- setErrors(formatValidationErrors(res.error));
1821
- }
1822
- } finally {
1823
- setSubmitting(false);
1824
- }
1825
- };
1826
- const totalDraftRelations = localCountOfDraftRelations + serverCountOfDraftRelations;
1827
- const hasDraftRelations = totalDraftRelations > 0;
1828
- return {
1829
- /**
1830
- * Disabled when:
1831
- * - currently if you're cloning a document we don't support publish & clone at the same time.
1832
- * - the form is submitting
1833
- * - the active tab is the published tab
1834
- * - the document is already published & not modified
1835
- * - the document is being created & not modified
1836
- * - the user doesn't have the permission to publish
1837
- */
1838
- disabled: isCloning || isSubmitting || isLoadingDraftRelations || activeTab === "published" || !modified && isDocumentPublished || !modified && !document?.documentId || !canPublish,
1839
- label: formatMessage({
1840
- id: "app.utils.publish",
1841
- defaultMessage: "Publish"
1842
- }),
1843
- onClick: async () => {
1844
- if (hasDraftRelations) {
1845
- return;
1846
- }
1847
- await performPublish();
1848
- },
1849
- dialog: hasDraftRelations ? {
1850
- type: "dialog",
1851
- variant: "danger",
1852
- footer: null,
1853
- title: formatMessage({
1854
- id: getTranslation(`popUpwarning.warning.bulk-has-draft-relations.title`),
1855
- defaultMessage: "Confirmation"
1856
- }),
1857
- content: formatMessage(
1858
- {
1859
- id: getTranslation(`popUpwarning.warning.bulk-has-draft-relations.message`),
1860
- defaultMessage: "This entry is related to {count, plural, one {# draft entry} other {# draft entries}}. Publishing it could leave broken links in your app."
1861
- },
1766
+ return /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 2, alignItems: "stretch", width: "100%", children: [
1767
+ /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
1768
+ /* @__PURE__ */ jsx(DocumentActionButton, { ...primaryAction, variant: primaryAction.variant || "default" }),
1769
+ restActions.length > 0 ? /* @__PURE__ */ jsx(
1770
+ DocumentActionsMenu,
1862
1771
  {
1863
- count: totalDraftRelations
1772
+ actions: restActions,
1773
+ label: formatMessage({
1774
+ id: "content-manager.containers.edit.panels.default.more-actions",
1775
+ defaultMessage: "More document actions"
1776
+ })
1864
1777
  }
1865
- ),
1866
- onConfirm: async () => {
1867
- await performPublish();
1778
+ ) : null
1779
+ ] }),
1780
+ secondaryAction ? /* @__PURE__ */ jsx(
1781
+ DocumentActionButton,
1782
+ {
1783
+ ...secondaryAction,
1784
+ variant: secondaryAction.variant || "secondary"
1868
1785
  }
1869
- } : void 0
1870
- };
1786
+ ) : null
1787
+ ] });
1871
1788
  };
1872
- PublishAction$1.type = "publish";
1873
- const UpdateAction = ({
1874
- activeTab,
1875
- documentId,
1876
- model,
1877
- collectionType
1878
- }) => {
1879
- const navigate = useNavigate();
1789
+ const DocumentActionButton = (action) => {
1790
+ const [dialogId, setDialogId] = React.useState(null);
1880
1791
  const { toggleNotification } = useNotification();
1881
- const { _unstableFormatValidationErrors: formatValidationErrors } = useAPIErrorHandler();
1882
- const cloneMatch = useMatch(CLONE_PATH);
1883
- const isCloning = cloneMatch !== null;
1884
- const { formatMessage } = useIntl();
1885
- const { create, update, clone } = useDocumentActions();
1886
- const [{ query, rawQuery }] = useQueryParams();
1887
- const params = React.useMemo(() => buildValidParams(query), [query]);
1888
- const isSubmitting = useForm("UpdateAction", ({ isSubmitting: isSubmitting2 }) => isSubmitting2);
1889
- const modified = useForm("UpdateAction", ({ modified: modified2 }) => modified2);
1890
- const setSubmitting = useForm("UpdateAction", ({ setSubmitting: setSubmitting2 }) => setSubmitting2);
1891
- const document = useForm("UpdateAction", ({ values }) => values);
1892
- const validate = useForm("UpdateAction", (state) => state.validate);
1893
- const setErrors = useForm("UpdateAction", (state) => state.setErrors);
1894
- const resetForm = useForm("PublishAction", ({ resetForm: resetForm2 }) => resetForm2);
1895
- return {
1896
- /**
1897
- * Disabled when:
1898
- * - the form is submitting
1899
- * - the document is not modified & we're not cloning (you can save a clone entity straight away)
1900
- * - the active tab is the published tab
1901
- */
1902
- disabled: isSubmitting || !modified && !isCloning || activeTab === "published",
1903
- label: formatMessage({
1904
- id: "content-manager.containers.Edit.save",
1905
- defaultMessage: "Save"
1906
- }),
1907
- onClick: async () => {
1908
- setSubmitting(true);
1909
- try {
1910
- if (activeTab !== "draft") {
1911
- const { errors } = await validate();
1912
- if (errors) {
1913
- toggleNotification({
1914
- type: "danger",
1915
- message: formatMessage({
1916
- id: "content-manager.validation.error",
1917
- defaultMessage: "There are validation errors in your document. Please fix them before saving."
1918
- })
1919
- });
1920
- return;
1921
- }
1922
- }
1923
- if (isCloning) {
1924
- const res = await clone(
1925
- {
1926
- model,
1927
- documentId: cloneMatch.params.origin,
1928
- params
1929
- },
1930
- document
1931
- );
1932
- if ("data" in res) {
1933
- navigate(
1934
- {
1935
- pathname: `../${res.data.documentId}`,
1936
- search: rawQuery
1937
- },
1938
- { relative: "path" }
1939
- );
1940
- } else if ("error" in res && isBaseQueryError(res.error) && res.error.name === "ValidationError") {
1941
- setErrors(formatValidationErrors(res.error));
1942
- }
1943
- } else if (documentId || collectionType === SINGLE_TYPES) {
1944
- const res = await update(
1945
- {
1946
- collectionType,
1947
- model,
1948
- documentId,
1949
- params
1950
- },
1951
- document
1952
- );
1953
- if ("error" in res && isBaseQueryError(res.error) && res.error.name === "ValidationError") {
1954
- setErrors(formatValidationErrors(res.error));
1955
- } else {
1956
- resetForm();
1957
- }
1958
- } else {
1959
- const res = await create(
1960
- {
1961
- model,
1962
- params
1963
- },
1964
- document
1965
- );
1966
- if ("data" in res && collectionType !== SINGLE_TYPES) {
1967
- navigate(
1968
- {
1969
- pathname: `../${res.data.documentId}`,
1970
- search: rawQuery
1971
- },
1972
- { replace: true, relative: "path" }
1973
- );
1974
- } else if ("error" in res && isBaseQueryError(res.error) && res.error.name === "ValidationError") {
1975
- setErrors(formatValidationErrors(res.error));
1976
- }
1977
- }
1978
- } finally {
1979
- setSubmitting(false);
1792
+ const handleClick = (action2) => async (e) => {
1793
+ const { onClick = () => false, dialog, id } = action2;
1794
+ const muteDialog = await onClick(e);
1795
+ if (dialog && !muteDialog) {
1796
+ switch (dialog.type) {
1797
+ case "notification":
1798
+ toggleNotification({
1799
+ title: dialog.title,
1800
+ message: dialog.content,
1801
+ type: dialog.status,
1802
+ timeout: dialog.timeout,
1803
+ onClose: dialog.onClose
1804
+ });
1805
+ break;
1806
+ case "dialog":
1807
+ case "modal":
1808
+ e.preventDefault();
1809
+ setDialogId(id);
1980
1810
  }
1981
1811
  }
1982
1812
  };
1813
+ const handleClose = () => {
1814
+ setDialogId(null);
1815
+ };
1816
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
1817
+ /* @__PURE__ */ jsx(
1818
+ Button,
1819
+ {
1820
+ flex: "auto",
1821
+ startIcon: action.icon,
1822
+ disabled: action.disabled,
1823
+ onClick: handleClick(action),
1824
+ justifyContent: "center",
1825
+ variant: action.variant || "default",
1826
+ paddingTop: "7px",
1827
+ paddingBottom: "7px",
1828
+ children: action.label
1829
+ }
1830
+ ),
1831
+ action.dialog?.type === "dialog" ? /* @__PURE__ */ jsx(
1832
+ DocumentActionConfirmDialog,
1833
+ {
1834
+ ...action.dialog,
1835
+ variant: action.dialog?.variant ?? action.variant,
1836
+ isOpen: dialogId === action.id,
1837
+ onClose: handleClose
1838
+ }
1839
+ ) : null,
1840
+ action.dialog?.type === "modal" ? /* @__PURE__ */ jsx(
1841
+ DocumentActionModal,
1842
+ {
1843
+ ...action.dialog,
1844
+ onModalClose: handleClose,
1845
+ isOpen: dialogId === action.id
1846
+ }
1847
+ ) : null
1848
+ ] });
1983
1849
  };
1984
- UpdateAction.type = "update";
1985
- const UNPUBLISH_DRAFT_OPTIONS = {
1986
- KEEP: "keep",
1987
- DISCARD: "discard"
1988
- };
1989
- const UnpublishAction$1 = ({
1990
- activeTab,
1991
- documentId,
1992
- model,
1993
- collectionType,
1994
- document
1850
+ const DocumentActionsMenu = ({
1851
+ actions: actions2,
1852
+ children,
1853
+ label,
1854
+ variant = "tertiary"
1995
1855
  }) => {
1856
+ const [isOpen, setIsOpen] = React.useState(false);
1857
+ const [dialogId, setDialogId] = React.useState(null);
1996
1858
  const { formatMessage } = useIntl();
1997
- const { schema } = useDoc();
1998
- const canPublish = useDocumentRBAC("UnpublishAction", ({ canPublish: canPublish2 }) => canPublish2);
1999
- const { unpublish } = useDocumentActions();
2000
- const [{ query }] = useQueryParams();
2001
- const params = React.useMemo(() => buildValidParams(query), [query]);
2002
1859
  const { toggleNotification } = useNotification();
2003
- const [shouldKeepDraft, setShouldKeepDraft] = React.useState(true);
2004
- const isDocumentModified = document?.status === "modified";
2005
- const handleChange = (value) => {
2006
- setShouldKeepDraft(value === UNPUBLISH_DRAFT_OPTIONS.KEEP);
2007
- };
2008
- if (!schema?.options?.draftAndPublish) {
2009
- return null;
2010
- }
2011
- return {
2012
- disabled: !canPublish || activeTab === "published" || document?.status !== "published" && document?.status !== "modified",
2013
- label: formatMessage({
2014
- id: "app.utils.unpublish",
2015
- defaultMessage: "Unpublish"
2016
- }),
2017
- icon: /* @__PURE__ */ jsx(StyledCrossCircle, {}),
2018
- onClick: async () => {
2019
- if (!documentId && collectionType !== SINGLE_TYPES || isDocumentModified) {
2020
- if (!documentId) {
2021
- console.error(
2022
- "You're trying to unpublish a document without an id, this is likely a bug with Strapi. Please open an issue."
2023
- );
1860
+ const isDisabled = actions2.every((action) => action.disabled) || actions2.length === 0;
1861
+ const handleClick = (action) => async (e) => {
1862
+ const { onClick = () => false, dialog, id } = action;
1863
+ const muteDialog = await onClick(e);
1864
+ if (dialog && !muteDialog) {
1865
+ switch (dialog.type) {
1866
+ case "notification":
2024
1867
  toggleNotification({
2025
- message: formatMessage({
2026
- id: "content-manager.actions.unpublish.error",
2027
- defaultMessage: "An error occurred while trying to unpublish the document."
2028
- }),
2029
- type: "danger"
1868
+ title: dialog.title,
1869
+ message: dialog.content,
1870
+ type: dialog.status,
1871
+ timeout: dialog.timeout,
1872
+ onClose: dialog.onClose
2030
1873
  });
2031
- }
2032
- return;
1874
+ break;
1875
+ case "dialog":
1876
+ case "modal":
1877
+ setDialogId(id);
2033
1878
  }
2034
- await unpublish({
2035
- collectionType,
2036
- model,
2037
- documentId,
2038
- params
2039
- });
2040
- },
2041
- dialog: isDocumentModified ? {
2042
- type: "dialog",
2043
- title: formatMessage({
2044
- id: "app.components.ConfirmDialog.title",
2045
- defaultMessage: "Confirmation"
2046
- }),
2047
- content: /* @__PURE__ */ jsxs(Flex, { alignItems: "flex-start", direction: "column", gap: 6, children: [
2048
- /* @__PURE__ */ jsxs(Flex, { width: "100%", direction: "column", gap: 2, children: [
2049
- /* @__PURE__ */ jsx(WarningCircle, { width: "24px", height: "24px", fill: "danger600" }),
2050
- /* @__PURE__ */ jsx(Typography, { tag: "p", variant: "omega", textAlign: "center", children: formatMessage({
2051
- id: "content-manager.actions.unpublish.dialog.body",
2052
- defaultMessage: "Are you sure?"
1879
+ }
1880
+ };
1881
+ const handleClose = () => {
1882
+ setDialogId(null);
1883
+ setIsOpen(false);
1884
+ };
1885
+ return /* @__PURE__ */ jsxs(Menu.Root, { open: isOpen, onOpenChange: setIsOpen, children: [
1886
+ /* @__PURE__ */ jsxs(
1887
+ Menu.Trigger,
1888
+ {
1889
+ disabled: isDisabled,
1890
+ size: "S",
1891
+ endIcon: null,
1892
+ paddingTop: "4px",
1893
+ paddingLeft: "7px",
1894
+ paddingRight: "7px",
1895
+ variant,
1896
+ children: [
1897
+ /* @__PURE__ */ jsx(More, { "aria-hidden": true, focusable: false }),
1898
+ /* @__PURE__ */ jsx(VisuallyHidden, { tag: "span", children: label || formatMessage({
1899
+ id: "content-manager.containers.edit.panels.default.more-actions",
1900
+ defaultMessage: "More document actions"
2053
1901
  }) })
2054
- ] }),
2055
- /* @__PURE__ */ jsxs(
2056
- Radio.Group,
2057
- {
2058
- defaultValue: UNPUBLISH_DRAFT_OPTIONS.KEEP,
2059
- name: "discard-options",
2060
- "aria-label": formatMessage({
2061
- id: "content-manager.actions.unpublish.dialog.radio-label",
2062
- defaultMessage: "Choose an option to unpublish the document."
2063
- }),
2064
- onValueChange: handleChange,
2065
- children: [
2066
- /* @__PURE__ */ jsx(Radio.Item, { checked: shouldKeepDraft, value: UNPUBLISH_DRAFT_OPTIONS.KEEP, children: formatMessage({
2067
- id: "content-manager.actions.unpublish.dialog.option.keep-draft",
2068
- defaultMessage: "Keep draft"
2069
- }) }),
2070
- /* @__PURE__ */ jsx(Radio.Item, { checked: !shouldKeepDraft, value: UNPUBLISH_DRAFT_OPTIONS.DISCARD, children: formatMessage({
2071
- id: "content-manager.actions.unpublish.dialog.option.replace-draft",
2072
- defaultMessage: "Replace draft"
2073
- }) })
2074
- ]
2075
- }
2076
- )
2077
- ] }),
2078
- onConfirm: async () => {
2079
- if (!documentId && collectionType !== SINGLE_TYPES) {
2080
- console.error(
2081
- "You're trying to unpublish a document without an id, this is likely a bug with Strapi. Please open an issue."
2082
- );
2083
- toggleNotification({
2084
- message: formatMessage({
2085
- id: "content-manager.actions.unpublish.error",
2086
- defaultMessage: "An error occurred while trying to unpublish the document."
2087
- }),
2088
- type: "danger"
2089
- });
2090
- }
2091
- await unpublish(
1902
+ ]
1903
+ }
1904
+ ),
1905
+ /* @__PURE__ */ jsxs(Menu.Content, { maxHeight: void 0, popoverPlacement: "bottom-end", children: [
1906
+ actions2.map((action) => {
1907
+ return /* @__PURE__ */ jsx(
1908
+ Menu.Item,
2092
1909
  {
2093
- collectionType,
2094
- model,
2095
- documentId,
2096
- params
1910
+ disabled: action.disabled,
1911
+ onSelect: handleClick(action),
1912
+ display: "block",
1913
+ children: /* @__PURE__ */ jsxs(Flex, { justifyContent: "space-between", gap: 4, children: [
1914
+ /* @__PURE__ */ jsxs(
1915
+ Flex,
1916
+ {
1917
+ color: !action.disabled ? convertActionVariantToColor(action.variant) : "inherit",
1918
+ gap: 2,
1919
+ tag: "span",
1920
+ children: [
1921
+ /* @__PURE__ */ jsx(
1922
+ Flex,
1923
+ {
1924
+ tag: "span",
1925
+ color: !action.disabled ? convertActionVariantToIconColor(action.variant) : "inherit",
1926
+ children: action.icon
1927
+ }
1928
+ ),
1929
+ action.label
1930
+ ]
1931
+ }
1932
+ ),
1933
+ action.id.startsWith("HistoryAction") && /* @__PURE__ */ jsx(
1934
+ Flex,
1935
+ {
1936
+ alignItems: "center",
1937
+ background: "alternative100",
1938
+ borderStyle: "solid",
1939
+ borderColor: "alternative200",
1940
+ borderWidth: "1px",
1941
+ height: 5,
1942
+ paddingLeft: 2,
1943
+ paddingRight: 2,
1944
+ hasRadius: true,
1945
+ color: "alternative600",
1946
+ children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", fontWeight: "bold", lineHeight: 1, children: formatMessage({ id: "global.new", defaultMessage: "New" }) })
1947
+ }
1948
+ )
1949
+ ] })
2097
1950
  },
2098
- !shouldKeepDraft
1951
+ action.id
2099
1952
  );
2100
- }
2101
- } : void 0,
2102
- variant: "danger",
2103
- position: ["panel", "table-row"]
1953
+ }),
1954
+ children
1955
+ ] }),
1956
+ actions2.map((action) => {
1957
+ return /* @__PURE__ */ jsxs(React.Fragment, { children: [
1958
+ action.dialog?.type === "dialog" ? /* @__PURE__ */ jsx(
1959
+ DocumentActionConfirmDialog,
1960
+ {
1961
+ ...action.dialog,
1962
+ variant: action.variant,
1963
+ isOpen: dialogId === action.id,
1964
+ onClose: handleClose
1965
+ }
1966
+ ) : null,
1967
+ action.dialog?.type === "modal" ? /* @__PURE__ */ jsx(
1968
+ DocumentActionModal,
1969
+ {
1970
+ ...action.dialog,
1971
+ onModalClose: handleClose,
1972
+ isOpen: dialogId === action.id
1973
+ }
1974
+ ) : null
1975
+ ] }, action.id);
1976
+ })
1977
+ ] });
1978
+ };
1979
+ const convertActionVariantToColor = (variant = "secondary") => {
1980
+ switch (variant) {
1981
+ case "danger":
1982
+ return "danger600";
1983
+ case "secondary":
1984
+ return void 0;
1985
+ case "success":
1986
+ return "success600";
1987
+ default:
1988
+ return "primary600";
1989
+ }
1990
+ };
1991
+ const convertActionVariantToIconColor = (variant = "secondary") => {
1992
+ switch (variant) {
1993
+ case "danger":
1994
+ return "danger600";
1995
+ case "secondary":
1996
+ return "neutral500";
1997
+ case "success":
1998
+ return "success600";
1999
+ default:
2000
+ return "primary600";
2001
+ }
2002
+ };
2003
+ const DocumentActionConfirmDialog = ({
2004
+ onClose,
2005
+ onCancel,
2006
+ onConfirm,
2007
+ title,
2008
+ content,
2009
+ isOpen,
2010
+ variant = "secondary"
2011
+ }) => {
2012
+ const { formatMessage } = useIntl();
2013
+ const handleClose = async () => {
2014
+ if (onCancel) {
2015
+ await onCancel();
2016
+ }
2017
+ onClose();
2018
+ };
2019
+ const handleConfirm = async () => {
2020
+ if (onConfirm) {
2021
+ await onConfirm();
2022
+ }
2023
+ onClose();
2104
2024
  };
2025
+ return /* @__PURE__ */ jsx(Dialog.Root, { open: isOpen, onOpenChange: handleClose, children: /* @__PURE__ */ jsxs(Dialog.Content, { children: [
2026
+ /* @__PURE__ */ jsx(Dialog.Header, { children: title }),
2027
+ /* @__PURE__ */ jsx(Dialog.Body, { children: content }),
2028
+ /* @__PURE__ */ jsxs(Dialog.Footer, { children: [
2029
+ /* @__PURE__ */ jsx(Dialog.Cancel, { children: /* @__PURE__ */ jsx(Button, { variant: "tertiary", fullWidth: true, children: formatMessage({
2030
+ id: "app.components.Button.cancel",
2031
+ defaultMessage: "Cancel"
2032
+ }) }) }),
2033
+ /* @__PURE__ */ jsx(Button, { onClick: handleConfirm, variant, fullWidth: true, children: formatMessage({
2034
+ id: "app.components.Button.confirm",
2035
+ defaultMessage: "Confirm"
2036
+ }) })
2037
+ ] })
2038
+ ] }) });
2105
2039
  };
2106
- UnpublishAction$1.type = "unpublish";
2107
- const DiscardAction = ({
2108
- activeTab,
2109
- documentId,
2110
- model,
2111
- collectionType,
2112
- document
2040
+ const DocumentActionModal = ({
2041
+ isOpen,
2042
+ title,
2043
+ onClose,
2044
+ footer: Footer,
2045
+ content: Content,
2046
+ onModalClose
2113
2047
  }) => {
2114
- const { formatMessage } = useIntl();
2115
- const { schema } = useDoc();
2116
- const canUpdate = useDocumentRBAC("DiscardAction", ({ canUpdate: canUpdate2 }) => canUpdate2);
2117
- const { discard } = useDocumentActions();
2118
- const [{ query }] = useQueryParams();
2119
- const params = React.useMemo(() => buildValidParams(query), [query]);
2120
- if (!schema?.options?.draftAndPublish) {
2121
- return null;
2122
- }
2123
- return {
2124
- disabled: !canUpdate || activeTab === "published" || document?.status !== "modified",
2125
- label: formatMessage({
2126
- id: "content-manager.actions.discard.label",
2127
- defaultMessage: "Discard changes"
2128
- }),
2129
- icon: /* @__PURE__ */ jsx(StyledCrossCircle, {}),
2130
- position: ["panel", "table-row"],
2131
- variant: "danger",
2132
- dialog: {
2133
- type: "dialog",
2134
- title: formatMessage({
2135
- id: "app.components.ConfirmDialog.title",
2136
- defaultMessage: "Confirmation"
2137
- }),
2138
- content: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 2, children: [
2139
- /* @__PURE__ */ jsx(WarningCircle, { width: "24px", height: "24px", fill: "danger600" }),
2140
- /* @__PURE__ */ jsx(Typography, { tag: "p", variant: "omega", textAlign: "center", children: formatMessage({
2141
- id: "content-manager.actions.discard.dialog.body",
2142
- defaultMessage: "Are you sure?"
2143
- }) })
2144
- ] }),
2145
- onConfirm: async () => {
2146
- await discard({
2147
- collectionType,
2148
- model,
2149
- documentId,
2150
- params
2151
- });
2152
- }
2048
+ const handleClose = () => {
2049
+ if (onClose) {
2050
+ onClose();
2153
2051
  }
2052
+ onModalClose();
2154
2053
  };
2054
+ return /* @__PURE__ */ jsx(Modal.Root, { open: isOpen, onOpenChange: handleClose, children: /* @__PURE__ */ jsxs(Modal.Content, { children: [
2055
+ /* @__PURE__ */ jsx(Modal.Header, { children: /* @__PURE__ */ jsx(Modal.Title, { children: title }) }),
2056
+ typeof Content === "function" ? /* @__PURE__ */ jsx(Content, { onClose: handleClose }) : /* @__PURE__ */ jsx(Modal.Body, { children: Content }),
2057
+ typeof Footer === "function" ? /* @__PURE__ */ jsx(Footer, { onClose: handleClose }) : Footer
2058
+ ] }) });
2155
2059
  };
2156
- DiscardAction.type = "discard";
2157
- const StyledCrossCircle = styled(CrossCircle)`
2158
- path {
2159
- fill: currentColor;
2160
- }
2161
- `;
2162
- const DEFAULT_ACTIONS = [PublishAction$1, UpdateAction, UnpublishAction$1, DiscardAction];
2163
- const intervals = ["years", "months", "days", "hours", "minutes", "seconds"];
2164
- const RelativeTime = React.forwardRef(
2165
- ({ timestamp, customIntervals = [], ...restProps }, forwardedRef) => {
2166
- const { formatRelativeTime, formatDate, formatTime } = useIntl();
2167
- const interval = intervalToDuration({
2168
- start: timestamp,
2169
- end: Date.now()
2170
- // see https://github.com/date-fns/date-fns/issues/2891 – No idea why it's all partial it returns it every time.
2171
- });
2172
- const unit = intervals.find((intervalUnit) => {
2173
- return interval[intervalUnit] > 0 && Object.keys(interval).includes(intervalUnit);
2174
- });
2175
- const relativeTime = isPast(timestamp) ? -interval[unit] : interval[unit];
2176
- const customInterval = customIntervals.find(
2177
- (custom) => interval[custom.unit] < custom.threshold
2178
- );
2179
- const displayText = customInterval ? customInterval.text : formatRelativeTime(relativeTime, unit, { numeric: "auto" });
2180
- return /* @__PURE__ */ jsx(
2181
- "time",
2182
- {
2183
- ref: forwardedRef,
2184
- dateTime: timestamp.toISOString(),
2185
- role: "time",
2186
- title: `${formatDate(timestamp)} ${formatTime(timestamp)}`,
2187
- ...restProps,
2188
- children: displayText
2189
- }
2190
- );
2191
- }
2192
- );
2193
- const getDisplayName = ({
2194
- firstname,
2195
- lastname,
2196
- username,
2197
- email
2198
- } = {}) => {
2199
- if (username) {
2200
- return username;
2060
+ const transformData = (data) => {
2061
+ if (Array.isArray(data)) {
2062
+ return data.map(transformData);
2201
2063
  }
2202
- if (firstname) {
2203
- return `${firstname} ${lastname ?? ""}`.trim();
2064
+ if (typeof data === "object" && data !== null) {
2065
+ if ("apiData" in data) {
2066
+ return data.apiData;
2067
+ }
2068
+ return mapValues(transformData)(data);
2204
2069
  }
2205
- return email ?? "";
2206
- };
2207
- const capitalise = (str) => str.charAt(0).toUpperCase() + str.slice(1);
2208
- const DocumentStatus = ({ status = "draft", ...restProps }) => {
2209
- const statusVariant = status === "draft" ? "primary" : status === "published" ? "success" : "alternative";
2210
- return /* @__PURE__ */ jsx(Status, { ...restProps, showBullet: false, size: "S", variant: statusVariant, children: /* @__PURE__ */ jsx(Typography, { tag: "span", variant: "omega", fontWeight: "bold", children: capitalise(status) }) });
2070
+ return data;
2211
2071
  };
2212
- const Header = ({ isCreating, status, title: documentTitle = "Untitled" }) => {
2213
- const { formatMessage } = useIntl();
2072
+ const PublishAction$1 = ({
2073
+ activeTab,
2074
+ documentId,
2075
+ model,
2076
+ collectionType,
2077
+ meta,
2078
+ document
2079
+ }) => {
2080
+ const { schema } = useDoc();
2081
+ const navigate = useNavigate();
2082
+ const { toggleNotification } = useNotification();
2083
+ const { _unstableFormatValidationErrors: formatValidationErrors } = useAPIErrorHandler();
2084
+ const isListView = useMatch(LIST_PATH) !== null;
2214
2085
  const isCloning = useMatch(CLONE_PATH) !== null;
2215
- const title = isCreating ? formatMessage({
2216
- id: "content-manager.containers.edit.title.new",
2217
- defaultMessage: "Create an entry"
2218
- }) : documentTitle;
2219
- return /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "flex-start", paddingTop: 6, paddingBottom: 4, gap: 2, children: [
2220
- /* @__PURE__ */ jsx(BackButton, {}),
2221
- /* @__PURE__ */ jsxs(Flex, { width: "100%", justifyContent: "space-between", gap: "80px", alignItems: "flex-start", children: [
2222
- /* @__PURE__ */ jsx(Typography, { variant: "alpha", tag: "h1", children: title }),
2223
- /* @__PURE__ */ jsx(HeaderToolbar, {})
2224
- ] }),
2225
- status ? /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(DocumentStatus, { status: isCloning ? "draft" : status }) }) : null
2226
- ] });
2227
- };
2228
- const HeaderToolbar = () => {
2229
2086
  const { formatMessage } = useIntl();
2230
- const isCloning = useMatch(CLONE_PATH) !== null;
2087
+ const canPublish = useDocumentRBAC("PublishAction", ({ canPublish: canPublish2 }) => canPublish2);
2088
+ const { publish } = useDocumentActions();
2231
2089
  const [
2232
- {
2233
- query: { status = "draft" }
2090
+ countDraftRelations,
2091
+ { isLoading: isLoadingDraftRelations, isError: isErrorDraftRelations }
2092
+ ] = useLazyGetDraftRelationCountQuery();
2093
+ const [localCountOfDraftRelations, setLocalCountOfDraftRelations] = React.useState(0);
2094
+ const [serverCountOfDraftRelations, setServerCountOfDraftRelations] = React.useState(0);
2095
+ const [{ query, rawQuery }] = useQueryParams();
2096
+ const params = React.useMemo(() => buildValidParams(query), [query]);
2097
+ const modified = useForm("PublishAction", ({ modified: modified2 }) => modified2);
2098
+ const setSubmitting = useForm("PublishAction", ({ setSubmitting: setSubmitting2 }) => setSubmitting2);
2099
+ const isSubmitting = useForm("PublishAction", ({ isSubmitting: isSubmitting2 }) => isSubmitting2);
2100
+ const validate = useForm("PublishAction", (state) => state.validate);
2101
+ const setErrors = useForm("PublishAction", (state) => state.setErrors);
2102
+ const formValues = useForm("PublishAction", ({ values }) => values);
2103
+ React.useEffect(() => {
2104
+ if (isErrorDraftRelations) {
2105
+ toggleNotification({
2106
+ type: "danger",
2107
+ message: formatMessage({
2108
+ id: getTranslation("error.records.fetch-draft-relatons"),
2109
+ defaultMessage: "An error occurred while fetching draft relations on this document."
2110
+ })
2111
+ });
2234
2112
  }
2235
- ] = useQueryParams();
2236
- const { model, id, document, meta, collectionType } = useDoc();
2237
- const plugins = useStrapiApp("HeaderToolbar", (state) => state.plugins);
2238
- return /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
2239
- /* @__PURE__ */ jsx(
2240
- DescriptionComponentRenderer,
2241
- {
2242
- props: {
2243
- activeTab: status,
2244
- model,
2245
- documentId: id,
2246
- document: isCloning ? void 0 : document,
2247
- meta: isCloning ? void 0 : meta,
2248
- collectionType
2249
- },
2250
- descriptions: plugins["content-manager"].apis.getHeaderActions(),
2251
- children: (actions2) => {
2252
- if (actions2.length > 0) {
2253
- return /* @__PURE__ */ jsx(HeaderActions, { actions: actions2 });
2254
- } else {
2255
- return null;
2256
- }
2113
+ }, [isErrorDraftRelations, toggleNotification, formatMessage]);
2114
+ React.useEffect(() => {
2115
+ const localDraftRelations = /* @__PURE__ */ new Set();
2116
+ const extractDraftRelations = (data) => {
2117
+ const relations = data.connect || [];
2118
+ relations.forEach((relation) => {
2119
+ if (relation.status === "draft") {
2120
+ localDraftRelations.add(relation.id);
2257
2121
  }
2258
- }
2259
- ),
2260
- /* @__PURE__ */ jsx(
2261
- DescriptionComponentRenderer,
2262
- {
2263
- props: {
2264
- activeTab: status,
2265
- model,
2266
- documentId: id,
2267
- document: isCloning ? void 0 : document,
2268
- meta: isCloning ? void 0 : meta,
2269
- collectionType
2270
- },
2271
- descriptions: plugins["content-manager"].apis.getDocumentActions(),
2272
- children: (actions2) => {
2273
- const headerActions = actions2.filter((action) => {
2274
- const positions = Array.isArray(action.position) ? action.position : [action.position];
2275
- return positions.includes("header");
2276
- });
2277
- return /* @__PURE__ */ jsx(
2278
- DocumentActionsMenu,
2279
- {
2280
- actions: headerActions,
2281
- label: formatMessage({
2282
- id: "content-manager.containers.edit.header.more-actions",
2283
- defaultMessage: "More actions"
2284
- }),
2285
- children: /* @__PURE__ */ jsx(Information, { activeTab: status })
2286
- }
2287
- );
2122
+ });
2123
+ };
2124
+ const traverseAndExtract = (data) => {
2125
+ Object.entries(data).forEach(([key, value]) => {
2126
+ if (key === "connect" && Array.isArray(value)) {
2127
+ extractDraftRelations({ connect: value });
2128
+ } else if (typeof value === "object" && value !== null) {
2129
+ traverseAndExtract(value);
2288
2130
  }
2131
+ });
2132
+ };
2133
+ if (!documentId || modified) {
2134
+ traverseAndExtract(formValues);
2135
+ setLocalCountOfDraftRelations(localDraftRelations.size);
2136
+ }
2137
+ }, [documentId, modified, formValues, setLocalCountOfDraftRelations]);
2138
+ React.useEffect(() => {
2139
+ if (!document || !document.documentId || isListView) {
2140
+ return;
2141
+ }
2142
+ const fetchDraftRelationsCount = async () => {
2143
+ const { data, error } = await countDraftRelations({
2144
+ collectionType,
2145
+ model,
2146
+ documentId,
2147
+ params
2148
+ });
2149
+ if (error) {
2150
+ throw error;
2289
2151
  }
2290
- )
2291
- ] });
2292
- };
2293
- const Information = ({ activeTab }) => {
2294
- const { formatMessage } = useIntl();
2295
- const { document, meta } = useDoc();
2296
- if (!document || !document.id) {
2152
+ if (data) {
2153
+ setServerCountOfDraftRelations(data.data);
2154
+ }
2155
+ };
2156
+ fetchDraftRelationsCount();
2157
+ }, [isListView, document, documentId, countDraftRelations, collectionType, model, params]);
2158
+ const isDocumentPublished = (document?.[PUBLISHED_AT_ATTRIBUTE_NAME] || meta?.availableStatus.some((doc) => doc[PUBLISHED_AT_ATTRIBUTE_NAME] !== null)) && document?.status !== "modified";
2159
+ if (!schema?.options?.draftAndPublish) {
2297
2160
  return null;
2298
2161
  }
2299
- const createAndUpdateDocument = activeTab === "draft" ? document : meta?.availableStatus.find((status) => status.publishedAt === null);
2300
- const publishDocument = activeTab === "published" ? document : meta?.availableStatus.find((status) => status.publishedAt !== null);
2301
- const creator = createAndUpdateDocument?.[CREATED_BY_ATTRIBUTE_NAME] ? getDisplayName(createAndUpdateDocument[CREATED_BY_ATTRIBUTE_NAME]) : null;
2302
- const updator = createAndUpdateDocument?.[UPDATED_BY_ATTRIBUTE_NAME] ? getDisplayName(createAndUpdateDocument[UPDATED_BY_ATTRIBUTE_NAME]) : null;
2303
- const information = [
2304
- {
2305
- isDisplayed: !!publishDocument?.[PUBLISHED_AT_ATTRIBUTE_NAME],
2306
- label: formatMessage({
2307
- id: "content-manager.containers.edit.information.last-published.label",
2308
- defaultMessage: "Last published"
2309
- }),
2310
- value: formatMessage(
2162
+ const performPublish = async () => {
2163
+ setSubmitting(true);
2164
+ try {
2165
+ const { errors } = await validate(true, {
2166
+ status: "published"
2167
+ });
2168
+ if (errors) {
2169
+ toggleNotification({
2170
+ type: "danger",
2171
+ message: formatMessage({
2172
+ id: "content-manager.validation.error",
2173
+ defaultMessage: "There are validation errors in your document. Please fix them before saving."
2174
+ })
2175
+ });
2176
+ return;
2177
+ }
2178
+ const res = await publish(
2311
2179
  {
2312
- id: "content-manager.containers.edit.information.last-published.value",
2313
- defaultMessage: `Published {time}{isAnonymous, select, true {} other { by {author}}}`
2180
+ collectionType,
2181
+ model,
2182
+ documentId,
2183
+ params
2314
2184
  },
2315
- {
2316
- time: /* @__PURE__ */ jsx(RelativeTime, { timestamp: new Date(publishDocument?.[PUBLISHED_AT_ATTRIBUTE_NAME]) }),
2317
- isAnonymous: !publishDocument?.[PUBLISHED_BY_ATTRIBUTE_NAME],
2318
- author: publishDocument?.[PUBLISHED_BY_ATTRIBUTE_NAME] ? getDisplayName(publishDocument?.[PUBLISHED_BY_ATTRIBUTE_NAME]) : null
2319
- }
2320
- )
2185
+ transformData(formValues)
2186
+ );
2187
+ if ("data" in res && collectionType !== SINGLE_TYPES) {
2188
+ navigate({
2189
+ pathname: `../${collectionType}/${model}/${res.data.documentId}`,
2190
+ search: rawQuery
2191
+ });
2192
+ } else if ("error" in res && isBaseQueryError(res.error) && res.error.name === "ValidationError") {
2193
+ setErrors(formatValidationErrors(res.error));
2194
+ }
2195
+ } finally {
2196
+ setSubmitting(false);
2197
+ }
2198
+ };
2199
+ const totalDraftRelations = localCountOfDraftRelations + serverCountOfDraftRelations;
2200
+ const enableDraftRelationsCount = false;
2201
+ const hasDraftRelations = enableDraftRelationsCount;
2202
+ return {
2203
+ /**
2204
+ * Disabled when:
2205
+ * - currently if you're cloning a document we don't support publish & clone at the same time.
2206
+ * - the form is submitting
2207
+ * - the active tab is the published tab
2208
+ * - the document is already published & not modified
2209
+ * - the document is being created & not modified
2210
+ * - the user doesn't have the permission to publish
2211
+ */
2212
+ disabled: isCloning || isSubmitting || isLoadingDraftRelations || activeTab === "published" || !modified && isDocumentPublished || !modified && !document?.documentId || !canPublish,
2213
+ label: formatMessage({
2214
+ id: "app.utils.publish",
2215
+ defaultMessage: "Publish"
2216
+ }),
2217
+ onClick: async () => {
2218
+ await performPublish();
2321
2219
  },
2322
- {
2323
- isDisplayed: !!createAndUpdateDocument?.[UPDATED_AT_ATTRIBUTE_NAME],
2324
- label: formatMessage({
2325
- id: "content-manager.containers.edit.information.last-draft.label",
2326
- defaultMessage: "Last draft"
2220
+ dialog: hasDraftRelations ? {
2221
+ type: "dialog",
2222
+ variant: "danger",
2223
+ footer: null,
2224
+ title: formatMessage({
2225
+ id: getTranslation(`popUpwarning.warning.bulk-has-draft-relations.title`),
2226
+ defaultMessage: "Confirmation"
2327
2227
  }),
2328
- value: formatMessage(
2228
+ content: formatMessage(
2329
2229
  {
2330
- id: "content-manager.containers.edit.information.last-draft.value",
2331
- defaultMessage: `Modified {time}{isAnonymous, select, true {} other { by {author}}}`
2230
+ id: getTranslation(`popUpwarning.warning.bulk-has-draft-relations.message`),
2231
+ defaultMessage: "This entry is related to {count, plural, one {# draft entry} other {# draft entries}}. Publishing it could leave broken links in your app."
2332
2232
  },
2333
2233
  {
2334
- time: /* @__PURE__ */ jsx(
2335
- RelativeTime,
2336
- {
2337
- timestamp: new Date(createAndUpdateDocument?.[UPDATED_AT_ATTRIBUTE_NAME])
2338
- }
2339
- ),
2340
- isAnonymous: !updator,
2341
- author: updator
2234
+ count: totalDraftRelations
2342
2235
  }
2343
- )
2344
- },
2345
- {
2346
- isDisplayed: !!createAndUpdateDocument?.[CREATED_AT_ATTRIBUTE_NAME],
2347
- label: formatMessage({
2348
- id: "content-manager.containers.edit.information.document.label",
2349
- defaultMessage: "Document"
2350
- }),
2351
- value: formatMessage(
2352
- {
2353
- id: "content-manager.containers.edit.information.document.value",
2354
- defaultMessage: `Created {time}{isAnonymous, select, true {} other { by {author}}}`
2355
- },
2356
- {
2357
- time: /* @__PURE__ */ jsx(
2358
- RelativeTime,
2359
- {
2360
- timestamp: new Date(createAndUpdateDocument?.[CREATED_AT_ATTRIBUTE_NAME])
2361
- }
2362
- ),
2363
- isAnonymous: !creator,
2364
- author: creator
2236
+ ),
2237
+ onConfirm: async () => {
2238
+ await performPublish();
2239
+ }
2240
+ } : void 0
2241
+ };
2242
+ };
2243
+ PublishAction$1.type = "publish";
2244
+ const UpdateAction = ({
2245
+ activeTab,
2246
+ documentId,
2247
+ model,
2248
+ collectionType
2249
+ }) => {
2250
+ const navigate = useNavigate();
2251
+ const { toggleNotification } = useNotification();
2252
+ const { _unstableFormatValidationErrors: formatValidationErrors } = useAPIErrorHandler();
2253
+ const cloneMatch = useMatch(CLONE_PATH);
2254
+ const isCloning = cloneMatch !== null;
2255
+ const { formatMessage } = useIntl();
2256
+ const { create, update, clone } = useDocumentActions();
2257
+ const [{ query, rawQuery }] = useQueryParams();
2258
+ const params = React.useMemo(() => buildValidParams(query), [query]);
2259
+ const isSubmitting = useForm("UpdateAction", ({ isSubmitting: isSubmitting2 }) => isSubmitting2);
2260
+ const modified = useForm("UpdateAction", ({ modified: modified2 }) => modified2);
2261
+ const setSubmitting = useForm("UpdateAction", ({ setSubmitting: setSubmitting2 }) => setSubmitting2);
2262
+ const document = useForm("UpdateAction", ({ values }) => values);
2263
+ const validate = useForm("UpdateAction", (state) => state.validate);
2264
+ const setErrors = useForm("UpdateAction", (state) => state.setErrors);
2265
+ const resetForm = useForm("PublishAction", ({ resetForm: resetForm2 }) => resetForm2);
2266
+ return {
2267
+ /**
2268
+ * Disabled when:
2269
+ * - the form is submitting
2270
+ * - the document is not modified & we're not cloning (you can save a clone entity straight away)
2271
+ * - the active tab is the published tab
2272
+ */
2273
+ disabled: isSubmitting || !modified && !isCloning || activeTab === "published",
2274
+ label: formatMessage({
2275
+ id: "content-manager.containers.Edit.save",
2276
+ defaultMessage: "Save"
2277
+ }),
2278
+ onClick: async () => {
2279
+ setSubmitting(true);
2280
+ try {
2281
+ const { errors } = await validate(true, {
2282
+ status: "draft"
2283
+ });
2284
+ if (errors) {
2285
+ toggleNotification({
2286
+ type: "danger",
2287
+ message: formatMessage({
2288
+ id: "content-manager.validation.error",
2289
+ defaultMessage: "There are validation errors in your document. Please fix them before saving."
2290
+ })
2291
+ });
2292
+ return;
2365
2293
  }
2366
- )
2367
- }
2368
- ].filter((info) => info.isDisplayed);
2369
- return /* @__PURE__ */ jsx(
2370
- Flex,
2371
- {
2372
- borderWidth: "1px 0 0 0",
2373
- borderStyle: "solid",
2374
- borderColor: "neutral150",
2375
- direction: "column",
2376
- marginTop: 2,
2377
- tag: "dl",
2378
- padding: 5,
2379
- gap: 3,
2380
- alignItems: "flex-start",
2381
- marginLeft: "-0.4rem",
2382
- marginRight: "-0.4rem",
2383
- width: "calc(100% + 8px)",
2384
- children: information.map((info) => /* @__PURE__ */ jsxs(Flex, { gap: 1, direction: "column", alignItems: "flex-start", children: [
2385
- /* @__PURE__ */ jsx(Typography, { tag: "dt", variant: "pi", fontWeight: "bold", children: info.label }),
2386
- /* @__PURE__ */ jsx(Typography, { tag: "dd", variant: "pi", textColor: "neutral600", children: info.value })
2387
- ] }, info.label))
2294
+ if (isCloning) {
2295
+ const res = await clone(
2296
+ {
2297
+ model,
2298
+ documentId: cloneMatch.params.origin,
2299
+ params
2300
+ },
2301
+ transformData(document)
2302
+ );
2303
+ if ("data" in res) {
2304
+ navigate(
2305
+ {
2306
+ pathname: `../${res.data.documentId}`,
2307
+ search: rawQuery
2308
+ },
2309
+ { relative: "path" }
2310
+ );
2311
+ } else if ("error" in res && isBaseQueryError(res.error) && res.error.name === "ValidationError") {
2312
+ setErrors(formatValidationErrors(res.error));
2313
+ }
2314
+ } else if (documentId || collectionType === SINGLE_TYPES) {
2315
+ const res = await update(
2316
+ {
2317
+ collectionType,
2318
+ model,
2319
+ documentId,
2320
+ params
2321
+ },
2322
+ transformData(document)
2323
+ );
2324
+ if ("error" in res && isBaseQueryError(res.error) && res.error.name === "ValidationError") {
2325
+ setErrors(formatValidationErrors(res.error));
2326
+ } else {
2327
+ resetForm();
2328
+ }
2329
+ } else {
2330
+ const res = await create(
2331
+ {
2332
+ model,
2333
+ params
2334
+ },
2335
+ transformData(document)
2336
+ );
2337
+ if ("data" in res && collectionType !== SINGLE_TYPES) {
2338
+ navigate(
2339
+ {
2340
+ pathname: `../${res.data.documentId}`,
2341
+ search: rawQuery
2342
+ },
2343
+ { replace: true, relative: "path" }
2344
+ );
2345
+ } else if ("error" in res && isBaseQueryError(res.error) && res.error.name === "ValidationError") {
2346
+ setErrors(formatValidationErrors(res.error));
2347
+ }
2348
+ }
2349
+ } finally {
2350
+ setSubmitting(false);
2351
+ }
2388
2352
  }
2389
- );
2353
+ };
2390
2354
  };
2391
- const HeaderActions = ({ actions: actions2 }) => {
2392
- return /* @__PURE__ */ jsx(Flex, { children: actions2.map((action) => {
2393
- if ("options" in action) {
2394
- return /* @__PURE__ */ jsx(
2395
- SingleSelect,
2396
- {
2397
- size: "S",
2398
- disabled: action.disabled,
2399
- "aria-label": action.label,
2400
- onChange: action.onSelect,
2401
- value: action.value,
2402
- children: action.options.map(({ label, ...option }) => /* @__PURE__ */ jsx(SingleSelectOption, { ...option, children: label }, option.value))
2403
- },
2404
- action.id
2405
- );
2406
- } else {
2407
- return null;
2408
- }
2409
- }) });
2355
+ UpdateAction.type = "update";
2356
+ const UNPUBLISH_DRAFT_OPTIONS = {
2357
+ KEEP: "keep",
2358
+ DISCARD: "discard"
2410
2359
  };
2411
- const ConfigureTheViewAction = ({ collectionType, model }) => {
2412
- const navigate = useNavigate();
2360
+ const UnpublishAction$1 = ({
2361
+ activeTab,
2362
+ documentId,
2363
+ model,
2364
+ collectionType,
2365
+ document
2366
+ }) => {
2413
2367
  const { formatMessage } = useIntl();
2414
- return {
2415
- label: formatMessage({
2416
- id: "app.links.configure-view",
2417
- defaultMessage: "Configure the view"
2418
- }),
2419
- icon: /* @__PURE__ */ jsx(ListPlus, {}),
2420
- onClick: () => {
2421
- navigate(`../${collectionType}/${model}/configurations/edit`);
2422
- },
2423
- position: "header"
2368
+ const { schema } = useDoc();
2369
+ const canPublish = useDocumentRBAC("UnpublishAction", ({ canPublish: canPublish2 }) => canPublish2);
2370
+ const { unpublish } = useDocumentActions();
2371
+ const [{ query }] = useQueryParams();
2372
+ const params = React.useMemo(() => buildValidParams(query), [query]);
2373
+ const { toggleNotification } = useNotification();
2374
+ const [shouldKeepDraft, setShouldKeepDraft] = React.useState(true);
2375
+ const isDocumentModified = document?.status === "modified";
2376
+ const handleChange = (value) => {
2377
+ setShouldKeepDraft(value === UNPUBLISH_DRAFT_OPTIONS.KEEP);
2424
2378
  };
2425
- };
2426
- ConfigureTheViewAction.type = "configure-the-view";
2427
- const EditTheModelAction = ({ model }) => {
2428
- const navigate = useNavigate();
2429
- const { formatMessage } = useIntl();
2379
+ if (!schema?.options?.draftAndPublish) {
2380
+ return null;
2381
+ }
2430
2382
  return {
2383
+ disabled: !canPublish || activeTab === "published" || document?.status !== "published" && document?.status !== "modified",
2431
2384
  label: formatMessage({
2432
- id: "content-manager.link-to-ctb",
2433
- defaultMessage: "Edit the model"
2385
+ id: "app.utils.unpublish",
2386
+ defaultMessage: "Unpublish"
2434
2387
  }),
2435
- icon: /* @__PURE__ */ jsx(Pencil, {}),
2436
- onClick: () => {
2437
- navigate(`/plugins/content-type-builder/content-types/${model}`);
2388
+ icon: /* @__PURE__ */ jsx(Cross, {}),
2389
+ onClick: async () => {
2390
+ if (!documentId && collectionType !== SINGLE_TYPES || isDocumentModified) {
2391
+ if (!documentId) {
2392
+ console.error(
2393
+ "You're trying to unpublish a document without an id, this is likely a bug with Strapi. Please open an issue."
2394
+ );
2395
+ toggleNotification({
2396
+ message: formatMessage({
2397
+ id: "content-manager.actions.unpublish.error",
2398
+ defaultMessage: "An error occurred while trying to unpublish the document."
2399
+ }),
2400
+ type: "danger"
2401
+ });
2402
+ }
2403
+ return;
2404
+ }
2405
+ await unpublish({
2406
+ collectionType,
2407
+ model,
2408
+ documentId,
2409
+ params
2410
+ });
2438
2411
  },
2439
- position: "header"
2412
+ dialog: isDocumentModified ? {
2413
+ type: "dialog",
2414
+ title: formatMessage({
2415
+ id: "app.components.ConfirmDialog.title",
2416
+ defaultMessage: "Confirmation"
2417
+ }),
2418
+ content: /* @__PURE__ */ jsxs(Flex, { alignItems: "flex-start", direction: "column", gap: 6, children: [
2419
+ /* @__PURE__ */ jsxs(Flex, { width: "100%", direction: "column", gap: 2, children: [
2420
+ /* @__PURE__ */ jsx(WarningCircle, { width: "24px", height: "24px", fill: "danger600" }),
2421
+ /* @__PURE__ */ jsx(Typography, { tag: "p", variant: "omega", textAlign: "center", children: formatMessage({
2422
+ id: "content-manager.actions.unpublish.dialog.body",
2423
+ defaultMessage: "Are you sure?"
2424
+ }) })
2425
+ ] }),
2426
+ /* @__PURE__ */ jsxs(
2427
+ Radio.Group,
2428
+ {
2429
+ defaultValue: UNPUBLISH_DRAFT_OPTIONS.KEEP,
2430
+ name: "discard-options",
2431
+ "aria-label": formatMessage({
2432
+ id: "content-manager.actions.unpublish.dialog.radio-label",
2433
+ defaultMessage: "Choose an option to unpublish the document."
2434
+ }),
2435
+ onValueChange: handleChange,
2436
+ children: [
2437
+ /* @__PURE__ */ jsx(Radio.Item, { checked: shouldKeepDraft, value: UNPUBLISH_DRAFT_OPTIONS.KEEP, children: formatMessage({
2438
+ id: "content-manager.actions.unpublish.dialog.option.keep-draft",
2439
+ defaultMessage: "Keep draft"
2440
+ }) }),
2441
+ /* @__PURE__ */ jsx(Radio.Item, { checked: !shouldKeepDraft, value: UNPUBLISH_DRAFT_OPTIONS.DISCARD, children: formatMessage({
2442
+ id: "content-manager.actions.unpublish.dialog.option.replace-draft",
2443
+ defaultMessage: "Replace draft"
2444
+ }) })
2445
+ ]
2446
+ }
2447
+ )
2448
+ ] }),
2449
+ onConfirm: async () => {
2450
+ if (!documentId && collectionType !== SINGLE_TYPES) {
2451
+ console.error(
2452
+ "You're trying to unpublish a document without an id, this is likely a bug with Strapi. Please open an issue."
2453
+ );
2454
+ toggleNotification({
2455
+ message: formatMessage({
2456
+ id: "content-manager.actions.unpublish.error",
2457
+ defaultMessage: "An error occurred while trying to unpublish the document."
2458
+ }),
2459
+ type: "danger"
2460
+ });
2461
+ }
2462
+ await unpublish(
2463
+ {
2464
+ collectionType,
2465
+ model,
2466
+ documentId,
2467
+ params
2468
+ },
2469
+ !shouldKeepDraft
2470
+ );
2471
+ }
2472
+ } : void 0,
2473
+ variant: "danger",
2474
+ position: ["panel", "table-row"]
2440
2475
  };
2441
2476
  };
2442
- EditTheModelAction.type = "edit-the-model";
2443
- const DeleteAction$1 = ({ documentId, model, collectionType, document }) => {
2444
- const navigate = useNavigate();
2477
+ UnpublishAction$1.type = "unpublish";
2478
+ const DiscardAction = ({
2479
+ activeTab,
2480
+ documentId,
2481
+ model,
2482
+ collectionType,
2483
+ document
2484
+ }) => {
2445
2485
  const { formatMessage } = useIntl();
2446
- const listViewPathMatch = useMatch(LIST_PATH);
2447
- const canDelete = useDocumentRBAC("DeleteAction", (state) => state.canDelete);
2448
- const { delete: deleteAction } = useDocumentActions();
2449
- const { toggleNotification } = useNotification();
2450
- const setSubmitting = useForm("DeleteAction", (state) => state.setSubmitting);
2486
+ const { schema } = useDoc();
2487
+ const canUpdate = useDocumentRBAC("DiscardAction", ({ canUpdate: canUpdate2 }) => canUpdate2);
2488
+ const { discard } = useDocumentActions();
2489
+ const [{ query }] = useQueryParams();
2490
+ const params = React.useMemo(() => buildValidParams(query), [query]);
2491
+ if (!schema?.options?.draftAndPublish) {
2492
+ return null;
2493
+ }
2451
2494
  return {
2452
- disabled: !canDelete || !document,
2495
+ disabled: !canUpdate || activeTab === "published" || document?.status !== "modified",
2453
2496
  label: formatMessage({
2454
- id: "content-manager.actions.delete.label",
2455
- defaultMessage: "Delete document"
2497
+ id: "content-manager.actions.discard.label",
2498
+ defaultMessage: "Discard changes"
2456
2499
  }),
2457
- icon: /* @__PURE__ */ jsx(Trash, {}),
2500
+ icon: /* @__PURE__ */ jsx(Cross, {}),
2501
+ position: ["panel", "table-row"],
2502
+ variant: "danger",
2458
2503
  dialog: {
2459
2504
  type: "dialog",
2460
2505
  title: formatMessage({
@@ -2464,92 +2509,90 @@ const DeleteAction$1 = ({ documentId, model, collectionType, document }) => {
2464
2509
  content: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 2, children: [
2465
2510
  /* @__PURE__ */ jsx(WarningCircle, { width: "24px", height: "24px", fill: "danger600" }),
2466
2511
  /* @__PURE__ */ jsx(Typography, { tag: "p", variant: "omega", textAlign: "center", children: formatMessage({
2467
- id: "content-manager.actions.delete.dialog.body",
2512
+ id: "content-manager.actions.discard.dialog.body",
2468
2513
  defaultMessage: "Are you sure?"
2469
2514
  }) })
2470
2515
  ] }),
2471
2516
  onConfirm: async () => {
2472
- if (!listViewPathMatch) {
2473
- setSubmitting(true);
2474
- }
2475
- try {
2476
- if (!documentId && collectionType !== SINGLE_TYPES) {
2477
- console.error(
2478
- "You're trying to delete a document without an id, this is likely a bug with Strapi. Please open an issue."
2479
- );
2480
- toggleNotification({
2481
- message: formatMessage({
2482
- id: "content-manager.actions.delete.error",
2483
- defaultMessage: "An error occurred while trying to delete the document."
2484
- }),
2485
- type: "danger"
2486
- });
2487
- return;
2488
- }
2489
- const res = await deleteAction({
2490
- documentId,
2491
- model,
2492
- collectionType,
2493
- params: {
2494
- locale: "*"
2495
- }
2496
- });
2497
- if (!("error" in res)) {
2498
- navigate({ pathname: `../${collectionType}/${model}` }, { replace: true });
2499
- }
2500
- } finally {
2501
- if (!listViewPathMatch) {
2502
- setSubmitting(false);
2503
- }
2504
- }
2517
+ await discard({
2518
+ collectionType,
2519
+ model,
2520
+ documentId,
2521
+ params
2522
+ });
2523
+ }
2524
+ }
2525
+ };
2526
+ };
2527
+ DiscardAction.type = "discard";
2528
+ const DEFAULT_ACTIONS = [PublishAction$1, UpdateAction, UnpublishAction$1, DiscardAction];
2529
+ const intervals = ["years", "months", "days", "hours", "minutes", "seconds"];
2530
+ const RelativeTime = React.forwardRef(
2531
+ ({ timestamp, customIntervals = [], ...restProps }, forwardedRef) => {
2532
+ const { formatRelativeTime, formatDate, formatTime } = useIntl();
2533
+ const interval = intervalToDuration({
2534
+ start: timestamp,
2535
+ end: Date.now()
2536
+ // see https://github.com/date-fns/date-fns/issues/2891 – No idea why it's all partial it returns it every time.
2537
+ });
2538
+ const unit = intervals.find((intervalUnit) => {
2539
+ return interval[intervalUnit] > 0 && Object.keys(interval).includes(intervalUnit);
2540
+ });
2541
+ const relativeTime = isPast(timestamp) ? -interval[unit] : interval[unit];
2542
+ const customInterval = customIntervals.find(
2543
+ (custom) => interval[custom.unit] < custom.threshold
2544
+ );
2545
+ const displayText = customInterval ? customInterval.text : formatRelativeTime(relativeTime, unit, { numeric: "auto" });
2546
+ return /* @__PURE__ */ jsx(
2547
+ "time",
2548
+ {
2549
+ ref: forwardedRef,
2550
+ dateTime: timestamp.toISOString(),
2551
+ role: "time",
2552
+ title: `${formatDate(timestamp)} ${formatTime(timestamp)}`,
2553
+ ...restProps,
2554
+ children: displayText
2505
2555
  }
2506
- },
2507
- variant: "danger",
2508
- position: ["header", "table-row"]
2509
- };
2556
+ );
2557
+ }
2558
+ );
2559
+ const getDisplayName = ({
2560
+ firstname,
2561
+ lastname,
2562
+ username,
2563
+ email
2564
+ } = {}) => {
2565
+ if (username) {
2566
+ return username;
2567
+ }
2568
+ if (firstname) {
2569
+ return `${firstname} ${lastname ?? ""}`.trim();
2570
+ }
2571
+ return email ?? "";
2510
2572
  };
2511
- DeleteAction$1.type = "delete";
2512
- const DEFAULT_HEADER_ACTIONS = [EditTheModelAction, ConfigureTheViewAction, DeleteAction$1];
2513
- const Panels = () => {
2514
- const isCloning = useMatch(CLONE_PATH) !== null;
2515
- const [
2516
- {
2517
- query: { status }
2518
- }
2519
- ] = useQueryParams({
2520
- status: "draft"
2521
- });
2522
- const { model, id, document, meta, collectionType } = useDoc();
2523
- const plugins = useStrapiApp("Panels", (state) => state.plugins);
2524
- const props = {
2525
- activeTab: status,
2526
- model,
2527
- documentId: id,
2528
- document: isCloning ? void 0 : document,
2529
- meta: isCloning ? void 0 : meta,
2530
- collectionType
2531
- };
2532
- return /* @__PURE__ */ jsx(Flex, { direction: "column", alignItems: "stretch", gap: 2, children: /* @__PURE__ */ jsx(
2533
- DescriptionComponentRenderer,
2534
- {
2535
- props,
2536
- descriptions: plugins["content-manager"].apis.getEditViewSidePanels(),
2537
- children: (panels) => panels.map(({ content, id: id2, ...description }) => /* @__PURE__ */ jsx(Panel, { ...description, children: content }, id2))
2538
- }
2539
- ) });
2573
+ const capitalise = (str) => str.charAt(0).toUpperCase() + str.slice(1);
2574
+ const DocumentStatus = ({ status = "draft", ...restProps }) => {
2575
+ const statusVariant = status === "draft" ? "secondary" : status === "published" ? "success" : "alternative";
2576
+ return /* @__PURE__ */ jsx(Status, { ...restProps, showBullet: false, size: "S", variant: statusVariant, children: /* @__PURE__ */ jsx(Typography, { tag: "span", variant: "omega", fontWeight: "bold", children: capitalise(status) }) });
2540
2577
  };
2541
- const ActionsPanel = () => {
2578
+ const Header = ({ isCreating, status, title: documentTitle = "Untitled" }) => {
2542
2579
  const { formatMessage } = useIntl();
2543
- return {
2544
- title: formatMessage({
2545
- id: "content-manager.containers.edit.panels.default.title",
2546
- defaultMessage: "Document"
2547
- }),
2548
- content: /* @__PURE__ */ jsx(ActionsPanelContent, {})
2549
- };
2580
+ const isCloning = useMatch(CLONE_PATH) !== null;
2581
+ const title = isCreating ? formatMessage({
2582
+ id: "content-manager.containers.edit.title.new",
2583
+ defaultMessage: "Create an entry"
2584
+ }) : documentTitle;
2585
+ return /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "flex-start", paddingTop: 6, paddingBottom: 4, gap: 2, children: [
2586
+ /* @__PURE__ */ jsx(BackButton, {}),
2587
+ /* @__PURE__ */ jsxs(Flex, { width: "100%", justifyContent: "space-between", gap: "80px", alignItems: "flex-start", children: [
2588
+ /* @__PURE__ */ jsx(Typography, { variant: "alpha", tag: "h1", children: title }),
2589
+ /* @__PURE__ */ jsx(HeaderToolbar, {})
2590
+ ] }),
2591
+ status ? /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(DocumentStatus, { status: isCloning ? "draft" : status }) }) : null
2592
+ ] });
2550
2593
  };
2551
- ActionsPanel.type = "actions";
2552
- const ActionsPanelContent = () => {
2594
+ const HeaderToolbar = () => {
2595
+ const { formatMessage } = useIntl();
2553
2596
  const isCloning = useMatch(CLONE_PATH) !== null;
2554
2597
  const [
2555
2598
  {
@@ -2557,355 +2600,432 @@ const ActionsPanelContent = () => {
2557
2600
  }
2558
2601
  ] = useQueryParams();
2559
2602
  const { model, id, document, meta, collectionType } = useDoc();
2560
- const plugins = useStrapiApp("ActionsPanel", (state) => state.plugins);
2561
- const props = {
2562
- activeTab: status,
2563
- model,
2564
- documentId: id,
2565
- document: isCloning ? void 0 : document,
2566
- meta: isCloning ? void 0 : meta,
2567
- collectionType
2568
- };
2569
- return /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 2, width: "100%", children: [
2603
+ const plugins = useStrapiApp("HeaderToolbar", (state) => state.plugins);
2604
+ return /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
2570
2605
  /* @__PURE__ */ jsx(
2571
2606
  DescriptionComponentRenderer,
2572
2607
  {
2573
- props,
2574
- descriptions: plugins["content-manager"].apis.getDocumentActions(),
2575
- children: (actions2) => /* @__PURE__ */ jsx(DocumentActions, { actions: actions2 })
2608
+ props: {
2609
+ activeTab: status,
2610
+ model,
2611
+ documentId: id,
2612
+ document: isCloning ? void 0 : document,
2613
+ meta: isCloning ? void 0 : meta,
2614
+ collectionType
2615
+ },
2616
+ descriptions: plugins["content-manager"].apis.getHeaderActions(),
2617
+ children: (actions2) => {
2618
+ if (actions2.length > 0) {
2619
+ return /* @__PURE__ */ jsx(HeaderActions, { actions: actions2 });
2620
+ } else {
2621
+ return null;
2622
+ }
2623
+ }
2576
2624
  }
2577
2625
  ),
2578
- /* @__PURE__ */ jsx(InjectionZone, { area: "editView.right-links", slug: model })
2626
+ /* @__PURE__ */ jsx(
2627
+ DescriptionComponentRenderer,
2628
+ {
2629
+ props: {
2630
+ activeTab: status,
2631
+ model,
2632
+ documentId: id,
2633
+ document: isCloning ? void 0 : document,
2634
+ meta: isCloning ? void 0 : meta,
2635
+ collectionType
2636
+ },
2637
+ descriptions: plugins["content-manager"].apis.getDocumentActions(),
2638
+ children: (actions2) => {
2639
+ const headerActions = actions2.filter((action) => {
2640
+ const positions = Array.isArray(action.position) ? action.position : [action.position];
2641
+ return positions.includes("header");
2642
+ });
2643
+ return /* @__PURE__ */ jsx(
2644
+ DocumentActionsMenu,
2645
+ {
2646
+ actions: headerActions,
2647
+ label: formatMessage({
2648
+ id: "content-manager.containers.edit.header.more-actions",
2649
+ defaultMessage: "More actions"
2650
+ }),
2651
+ children: /* @__PURE__ */ jsx(Information, { activeTab: status })
2652
+ }
2653
+ );
2654
+ }
2655
+ }
2656
+ )
2579
2657
  ] });
2580
2658
  };
2581
- const Panel = React.forwardRef(({ children, title }, ref) => {
2582
- return /* @__PURE__ */ jsxs(
2583
- Flex,
2659
+ const Information = ({ activeTab }) => {
2660
+ const { formatMessage } = useIntl();
2661
+ const { document, meta } = useDoc();
2662
+ if (!document || !document.id) {
2663
+ return null;
2664
+ }
2665
+ const createAndUpdateDocument = activeTab === "draft" ? document : meta?.availableStatus.find((status) => status.publishedAt === null);
2666
+ const publishDocument = activeTab === "published" ? document : meta?.availableStatus.find((status) => status.publishedAt !== null);
2667
+ const creator = createAndUpdateDocument?.[CREATED_BY_ATTRIBUTE_NAME] ? getDisplayName(createAndUpdateDocument[CREATED_BY_ATTRIBUTE_NAME]) : null;
2668
+ const updator = createAndUpdateDocument?.[UPDATED_BY_ATTRIBUTE_NAME] ? getDisplayName(createAndUpdateDocument[UPDATED_BY_ATTRIBUTE_NAME]) : null;
2669
+ const information = [
2584
2670
  {
2585
- ref,
2586
- tag: "aside",
2587
- "aria-labelledby": "additional-information",
2588
- background: "neutral0",
2589
- borderColor: "neutral150",
2590
- hasRadius: true,
2591
- paddingBottom: 4,
2592
- paddingLeft: 4,
2593
- paddingRight: 4,
2594
- paddingTop: 4,
2595
- shadow: "tableShadow",
2596
- gap: 3,
2597
- direction: "column",
2598
- justifyContent: "stretch",
2599
- alignItems: "flex-start",
2600
- children: [
2601
- /* @__PURE__ */ jsx(Typography, { tag: "h2", variant: "sigma", textTransform: "uppercase", children: title }),
2602
- children
2603
- ]
2604
- }
2605
- );
2606
- });
2607
- const HOOKS = {
2608
- /**
2609
- * Hook that allows to mutate the displayed headers of the list view table
2610
- * @constant
2611
- * @type {string}
2612
- */
2613
- INJECT_COLUMN_IN_TABLE: "Admin/CM/pages/ListView/inject-column-in-table",
2614
- /**
2615
- * Hook that allows to mutate the CM's collection types links pre-set filters
2616
- * @constant
2617
- * @type {string}
2618
- */
2619
- MUTATE_COLLECTION_TYPES_LINKS: "Admin/CM/pages/App/mutate-collection-types-links",
2620
- /**
2621
- * Hook that allows to mutate the CM's edit view layout
2622
- * @constant
2623
- * @type {string}
2624
- */
2625
- MUTATE_EDIT_VIEW_LAYOUT: "Admin/CM/pages/EditView/mutate-edit-view-layout",
2626
- /**
2627
- * Hook that allows to mutate the CM's single types links pre-set filters
2628
- * @constant
2629
- * @type {string}
2630
- */
2631
- MUTATE_SINGLE_TYPES_LINKS: "Admin/CM/pages/App/mutate-single-types-links"
2632
- };
2633
- const contentTypesApi = contentManagerApi.injectEndpoints({
2634
- endpoints: (builder) => ({
2635
- getContentTypeConfiguration: builder.query({
2636
- query: (uid) => ({
2637
- url: `/content-manager/content-types/${uid}/configuration`,
2638
- method: "GET"
2671
+ isDisplayed: !!publishDocument?.[PUBLISHED_AT_ATTRIBUTE_NAME],
2672
+ label: formatMessage({
2673
+ id: "content-manager.containers.edit.information.last-published.label",
2674
+ defaultMessage: "Published"
2639
2675
  }),
2640
- transformResponse: (response) => response.data,
2641
- providesTags: (_result, _error, uid) => [
2642
- { type: "ContentTypesConfiguration", id: uid },
2643
- { type: "ContentTypeSettings", id: "LIST" }
2644
- ]
2645
- }),
2646
- getAllContentTypeSettings: builder.query({
2647
- query: () => "/content-manager/content-types-settings",
2648
- transformResponse: (response) => response.data,
2649
- providesTags: [{ type: "ContentTypeSettings", id: "LIST" }]
2650
- }),
2651
- updateContentTypeConfiguration: builder.mutation({
2652
- query: ({ uid, ...body }) => ({
2653
- url: `/content-manager/content-types/${uid}/configuration`,
2654
- method: "PUT",
2655
- data: body
2676
+ value: formatMessage(
2677
+ {
2678
+ id: "content-manager.containers.edit.information.last-published.value",
2679
+ defaultMessage: `{time}{isAnonymous, select, true {} other { by {author}}}`
2680
+ },
2681
+ {
2682
+ time: /* @__PURE__ */ jsx(RelativeTime, { timestamp: new Date(publishDocument?.[PUBLISHED_AT_ATTRIBUTE_NAME]) }),
2683
+ isAnonymous: !publishDocument?.[PUBLISHED_BY_ATTRIBUTE_NAME],
2684
+ author: publishDocument?.[PUBLISHED_BY_ATTRIBUTE_NAME] ? getDisplayName(publishDocument?.[PUBLISHED_BY_ATTRIBUTE_NAME]) : null
2685
+ }
2686
+ )
2687
+ },
2688
+ {
2689
+ isDisplayed: !!createAndUpdateDocument?.[UPDATED_AT_ATTRIBUTE_NAME],
2690
+ label: formatMessage({
2691
+ id: "content-manager.containers.edit.information.last-draft.label",
2692
+ defaultMessage: "Updated"
2693
+ }),
2694
+ value: formatMessage(
2695
+ {
2696
+ id: "content-manager.containers.edit.information.last-draft.value",
2697
+ defaultMessage: `{time}{isAnonymous, select, true {} other { by {author}}}`
2698
+ },
2699
+ {
2700
+ time: /* @__PURE__ */ jsx(
2701
+ RelativeTime,
2702
+ {
2703
+ timestamp: new Date(createAndUpdateDocument?.[UPDATED_AT_ATTRIBUTE_NAME])
2704
+ }
2705
+ ),
2706
+ isAnonymous: !updator,
2707
+ author: updator
2708
+ }
2709
+ )
2710
+ },
2711
+ {
2712
+ isDisplayed: !!createAndUpdateDocument?.[CREATED_AT_ATTRIBUTE_NAME],
2713
+ label: formatMessage({
2714
+ id: "content-manager.containers.edit.information.document.label",
2715
+ defaultMessage: "Created"
2656
2716
  }),
2657
- transformResponse: (response) => response.data,
2658
- invalidatesTags: (_result, _error, { uid }) => [
2659
- { type: "ContentTypesConfiguration", id: uid },
2660
- { type: "ContentTypeSettings", id: "LIST" },
2661
- // Is this necessary?
2662
- { type: "InitialData" }
2663
- ]
2664
- })
2665
- })
2666
- });
2667
- const {
2668
- useGetContentTypeConfigurationQuery,
2669
- useGetAllContentTypeSettingsQuery,
2670
- useUpdateContentTypeConfigurationMutation
2671
- } = contentTypesApi;
2672
- const checkIfAttributeIsDisplayable = (attribute) => {
2673
- const { type } = attribute;
2674
- if (type === "relation") {
2675
- return !attribute.relation.toLowerCase().includes("morph");
2676
- }
2677
- return !["json", "dynamiczone", "richtext", "password", "blocks"].includes(type) && !!type;
2678
- };
2679
- const getMainField = (attribute, mainFieldName, { schemas, components }) => {
2680
- if (!mainFieldName) {
2681
- return void 0;
2682
- }
2683
- const mainFieldType = attribute.type === "component" ? components[attribute.component].attributes[mainFieldName].type : (
2684
- // @ts-expect-error – `targetModel` does exist on the attribute for a relation.
2685
- schemas.find((schema) => schema.uid === attribute.targetModel)?.attributes[mainFieldName].type
2717
+ value: formatMessage(
2718
+ {
2719
+ id: "content-manager.containers.edit.information.document.value",
2720
+ defaultMessage: `{time}{isAnonymous, select, true {} other { by {author}}}`
2721
+ },
2722
+ {
2723
+ time: /* @__PURE__ */ jsx(
2724
+ RelativeTime,
2725
+ {
2726
+ timestamp: new Date(createAndUpdateDocument?.[CREATED_AT_ATTRIBUTE_NAME])
2727
+ }
2728
+ ),
2729
+ isAnonymous: !creator,
2730
+ author: creator
2731
+ }
2732
+ )
2733
+ }
2734
+ ].filter((info) => info.isDisplayed);
2735
+ return /* @__PURE__ */ jsx(
2736
+ Flex,
2737
+ {
2738
+ borderWidth: "1px 0 0 0",
2739
+ borderStyle: "solid",
2740
+ borderColor: "neutral150",
2741
+ direction: "column",
2742
+ marginTop: 2,
2743
+ tag: "dl",
2744
+ padding: 5,
2745
+ gap: 3,
2746
+ alignItems: "flex-start",
2747
+ marginLeft: "-0.4rem",
2748
+ marginRight: "-0.4rem",
2749
+ width: "calc(100% + 8px)",
2750
+ children: information.map((info) => /* @__PURE__ */ jsxs(Flex, { gap: 1, direction: "column", alignItems: "flex-start", children: [
2751
+ /* @__PURE__ */ jsx(Typography, { tag: "dt", variant: "pi", fontWeight: "bold", children: info.label }),
2752
+ /* @__PURE__ */ jsx(Typography, { tag: "dd", variant: "pi", textColor: "neutral600", children: info.value })
2753
+ ] }, info.label))
2754
+ }
2686
2755
  );
2687
- return {
2688
- name: mainFieldName,
2689
- type: mainFieldType ?? "string"
2690
- };
2691
- };
2692
- const DEFAULT_SETTINGS = {
2693
- bulkable: false,
2694
- filterable: false,
2695
- searchable: false,
2696
- pagination: false,
2697
- defaultSortBy: "",
2698
- defaultSortOrder: "asc",
2699
- mainField: "id",
2700
- pageSize: 10
2701
2756
  };
2702
- const useDocumentLayout = (model) => {
2703
- const { schema, components } = useDocument({ model, collectionType: "" }, { skip: true });
2704
- const [{ query }] = useQueryParams();
2705
- const runHookWaterfall = useStrapiApp("useDocumentLayout", (state) => state.runHookWaterfall);
2706
- const { toggleNotification } = useNotification();
2707
- const { _unstableFormatAPIError: formatAPIError } = useAPIErrorHandler();
2708
- const { isLoading: isLoadingSchemas, schemas } = useContentTypeSchema();
2709
- const {
2710
- data,
2711
- isLoading: isLoadingConfigs,
2712
- error,
2713
- isFetching: isFetchingConfigs
2714
- } = useGetContentTypeConfigurationQuery(model);
2715
- const isLoading = isLoadingSchemas || isFetchingConfigs || isLoadingConfigs;
2716
- React.useEffect(() => {
2717
- if (error) {
2718
- toggleNotification({
2719
- type: "danger",
2720
- message: formatAPIError(error)
2721
- });
2757
+ const HeaderActions = ({ actions: actions2 }) => {
2758
+ const [dialogId, setDialogId] = React.useState(null);
2759
+ const handleClick = (action) => async (e) => {
2760
+ if (!("options" in action)) {
2761
+ const { onClick = () => false, dialog, id } = action;
2762
+ const muteDialog = await onClick(e);
2763
+ if (dialog && !muteDialog) {
2764
+ e.preventDefault();
2765
+ setDialogId(id);
2766
+ }
2722
2767
  }
2723
- }, [error, formatAPIError, toggleNotification]);
2724
- const editLayout = React.useMemo(
2725
- () => data && !isLoading ? formatEditLayout(data, { schemas, schema, components }) : {
2726
- layout: [],
2727
- components: {},
2728
- metadatas: {},
2729
- options: {},
2730
- settings: DEFAULT_SETTINGS
2731
- },
2732
- [data, isLoading, schemas, schema, components]
2733
- );
2734
- const listLayout = React.useMemo(() => {
2735
- return data && !isLoading ? formatListLayout(data, { schemas, schema, components }) : {
2736
- layout: [],
2737
- metadatas: {},
2738
- options: {},
2739
- settings: DEFAULT_SETTINGS
2740
- };
2741
- }, [data, isLoading, schemas, schema, components]);
2742
- const { layout: edit } = React.useMemo(
2743
- () => runHookWaterfall(HOOKS.MUTATE_EDIT_VIEW_LAYOUT, {
2744
- layout: editLayout,
2745
- query
2746
- }),
2747
- [editLayout, query, runHookWaterfall]
2748
- );
2749
- return {
2750
- error,
2751
- isLoading,
2752
- edit,
2753
- list: listLayout
2754
2768
  };
2755
- };
2756
- const useDocLayout = () => {
2757
- const { model } = useDoc();
2758
- return useDocumentLayout(model);
2759
- };
2760
- const formatEditLayout = (data, {
2761
- schemas,
2762
- schema,
2763
- components
2764
- }) => {
2765
- let currentPanelIndex = 0;
2766
- const panelledEditAttributes = convertEditLayoutToFieldLayouts(
2767
- data.contentType.layouts.edit,
2768
- schema?.attributes,
2769
- data.contentType.metadatas,
2770
- { configurations: data.components, schemas: components },
2771
- schemas
2772
- ).reduce((panels, row) => {
2773
- if (row.some((field) => field.type === "dynamiczone")) {
2774
- panels.push([row]);
2775
- currentPanelIndex += 2;
2769
+ const handleClose = () => {
2770
+ setDialogId(null);
2771
+ };
2772
+ return /* @__PURE__ */ jsx(Flex, { gap: 1, children: actions2.map((action) => {
2773
+ if (action.options) {
2774
+ return /* @__PURE__ */ jsx(
2775
+ SingleSelect,
2776
+ {
2777
+ size: "S",
2778
+ onChange: action.onSelect,
2779
+ "aria-label": action.label,
2780
+ ...action,
2781
+ children: action.options.map(({ label, ...option }) => /* @__PURE__ */ jsx(SingleSelectOption, { ...option, children: label }, option.value))
2782
+ },
2783
+ action.id
2784
+ );
2776
2785
  } else {
2777
- if (!panels[currentPanelIndex]) {
2778
- panels.push([]);
2786
+ if (action.type === "icon") {
2787
+ return /* @__PURE__ */ jsxs(React.Fragment, { children: [
2788
+ /* @__PURE__ */ jsx(
2789
+ IconButton,
2790
+ {
2791
+ disabled: action.disabled,
2792
+ label: action.label,
2793
+ size: "S",
2794
+ onClick: handleClick(action),
2795
+ children: action.icon
2796
+ }
2797
+ ),
2798
+ action.dialog ? /* @__PURE__ */ jsx(
2799
+ HeaderActionDialog,
2800
+ {
2801
+ ...action.dialog,
2802
+ isOpen: dialogId === action.id,
2803
+ onClose: handleClose
2804
+ }
2805
+ ) : null
2806
+ ] }, action.id);
2779
2807
  }
2780
- panels[currentPanelIndex].push(row);
2781
2808
  }
2782
- return panels;
2783
- }, []);
2784
- const componentEditAttributes = Object.entries(data.components).reduce(
2785
- (acc, [uid, configuration]) => {
2786
- acc[uid] = {
2787
- layout: convertEditLayoutToFieldLayouts(
2788
- configuration.layouts.edit,
2789
- components[uid].attributes,
2790
- configuration.metadatas
2791
- ),
2792
- settings: {
2793
- ...configuration.settings,
2794
- icon: components[uid].info.icon,
2795
- displayName: components[uid].info.displayName
2796
- }
2797
- };
2798
- return acc;
2799
- },
2800
- {}
2801
- );
2802
- const editMetadatas = Object.entries(data.contentType.metadatas).reduce(
2803
- (acc, [attribute, metadata]) => {
2804
- return {
2805
- ...acc,
2806
- [attribute]: metadata.edit
2807
- };
2809
+ }) });
2810
+ };
2811
+ const HeaderActionDialog = ({
2812
+ onClose,
2813
+ onCancel,
2814
+ title,
2815
+ content: Content,
2816
+ isOpen
2817
+ }) => {
2818
+ const handleClose = async () => {
2819
+ if (onCancel) {
2820
+ await onCancel();
2821
+ }
2822
+ onClose();
2823
+ };
2824
+ return /* @__PURE__ */ jsx(Dialog.Root, { open: isOpen, onOpenChange: handleClose, children: /* @__PURE__ */ jsxs(Dialog.Content, { children: [
2825
+ /* @__PURE__ */ jsx(Dialog.Header, { children: title }),
2826
+ typeof Content === "function" ? /* @__PURE__ */ jsx(Content, { onClose: handleClose }) : Content
2827
+ ] }) });
2828
+ };
2829
+ const ConfigureTheViewAction = ({ collectionType, model }) => {
2830
+ const navigate = useNavigate();
2831
+ const { formatMessage } = useIntl();
2832
+ return {
2833
+ label: formatMessage({
2834
+ id: "app.links.configure-view",
2835
+ defaultMessage: "Configure the view"
2836
+ }),
2837
+ icon: /* @__PURE__ */ jsx(ListPlus, {}),
2838
+ onClick: () => {
2839
+ navigate(`../${collectionType}/${model}/configurations/edit`);
2808
2840
  },
2809
- {}
2810
- );
2841
+ position: "header"
2842
+ };
2843
+ };
2844
+ ConfigureTheViewAction.type = "configure-the-view";
2845
+ const EditTheModelAction = ({ model }) => {
2846
+ const navigate = useNavigate();
2847
+ const { formatMessage } = useIntl();
2811
2848
  return {
2812
- layout: panelledEditAttributes,
2813
- components: componentEditAttributes,
2814
- metadatas: editMetadatas,
2815
- settings: {
2816
- ...data.contentType.settings,
2817
- displayName: schema?.info.displayName
2849
+ label: formatMessage({
2850
+ id: "content-manager.link-to-ctb",
2851
+ defaultMessage: "Edit the model"
2852
+ }),
2853
+ icon: /* @__PURE__ */ jsx(Pencil, {}),
2854
+ onClick: () => {
2855
+ navigate(`/plugins/content-type-builder/content-types/${model}`);
2818
2856
  },
2819
- options: {
2820
- ...schema?.options,
2821
- ...schema?.pluginOptions,
2822
- ...data.contentType.options
2823
- }
2857
+ position: "header"
2824
2858
  };
2825
2859
  };
2826
- const convertEditLayoutToFieldLayouts = (rows, attributes = {}, metadatas, components, schemas = []) => {
2827
- return rows.map(
2828
- (row) => row.map((field) => {
2829
- const attribute = attributes[field.name];
2830
- if (!attribute) {
2831
- return null;
2860
+ EditTheModelAction.type = "edit-the-model";
2861
+ const DeleteAction$1 = ({ documentId, model, collectionType, document }) => {
2862
+ const navigate = useNavigate();
2863
+ const { formatMessage } = useIntl();
2864
+ const listViewPathMatch = useMatch(LIST_PATH);
2865
+ const canDelete = useDocumentRBAC("DeleteAction", (state) => state.canDelete);
2866
+ const { delete: deleteAction } = useDocumentActions();
2867
+ const { toggleNotification } = useNotification();
2868
+ const setSubmitting = useForm("DeleteAction", (state) => state.setSubmitting);
2869
+ const isLocalized = document?.locale != null;
2870
+ return {
2871
+ disabled: !canDelete || !document,
2872
+ label: formatMessage(
2873
+ {
2874
+ id: "content-manager.actions.delete.label",
2875
+ defaultMessage: "Delete entry{isLocalized, select, true { (all locales)} other {}}"
2876
+ },
2877
+ { isLocalized }
2878
+ ),
2879
+ icon: /* @__PURE__ */ jsx(Trash, {}),
2880
+ dialog: {
2881
+ type: "dialog",
2882
+ title: formatMessage({
2883
+ id: "app.components.ConfirmDialog.title",
2884
+ defaultMessage: "Confirmation"
2885
+ }),
2886
+ content: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 2, children: [
2887
+ /* @__PURE__ */ jsx(WarningCircle, { width: "24px", height: "24px", fill: "danger600" }),
2888
+ /* @__PURE__ */ jsx(Typography, { tag: "p", variant: "omega", textAlign: "center", children: formatMessage({
2889
+ id: "content-manager.actions.delete.dialog.body",
2890
+ defaultMessage: "Are you sure?"
2891
+ }) })
2892
+ ] }),
2893
+ onConfirm: async () => {
2894
+ if (!listViewPathMatch) {
2895
+ setSubmitting(true);
2896
+ }
2897
+ try {
2898
+ if (!documentId && collectionType !== SINGLE_TYPES) {
2899
+ console.error(
2900
+ "You're trying to delete a document without an id, this is likely a bug with Strapi. Please open an issue."
2901
+ );
2902
+ toggleNotification({
2903
+ message: formatMessage({
2904
+ id: "content-manager.actions.delete.error",
2905
+ defaultMessage: "An error occurred while trying to delete the document."
2906
+ }),
2907
+ type: "danger"
2908
+ });
2909
+ return;
2910
+ }
2911
+ const res = await deleteAction({
2912
+ documentId,
2913
+ model,
2914
+ collectionType,
2915
+ params: {
2916
+ locale: "*"
2917
+ }
2918
+ });
2919
+ if (!("error" in res)) {
2920
+ navigate({ pathname: `../${collectionType}/${model}` }, { replace: true });
2921
+ }
2922
+ } finally {
2923
+ if (!listViewPathMatch) {
2924
+ setSubmitting(false);
2925
+ }
2926
+ }
2832
2927
  }
2833
- const { edit: metadata } = metadatas[field.name];
2834
- const settings = attribute.type === "component" && components ? components.configurations[attribute.component].settings : {};
2835
- return {
2836
- attribute,
2837
- disabled: !metadata.editable,
2838
- hint: metadata.description,
2839
- label: metadata.label ?? "",
2840
- name: field.name,
2841
- // @ts-expect-error – mainField does exist on the metadata for a relation.
2842
- mainField: getMainField(attribute, metadata.mainField || settings.mainField, {
2843
- schemas,
2844
- components: components?.schemas ?? {}
2845
- }),
2846
- placeholder: metadata.placeholder ?? "",
2847
- required: attribute.required ?? false,
2848
- size: field.size,
2849
- unique: "unique" in attribute ? attribute.unique : false,
2850
- visible: metadata.visible ?? true,
2851
- type: attribute.type
2852
- };
2853
- }).filter((field) => field !== null)
2854
- );
2855
- };
2856
- const formatListLayout = (data, {
2857
- schemas,
2858
- schema,
2859
- components
2860
- }) => {
2861
- const listMetadatas = Object.entries(data.contentType.metadatas).reduce(
2862
- (acc, [attribute, metadata]) => {
2863
- return {
2864
- ...acc,
2865
- [attribute]: metadata.list
2866
- };
2867
2928
  },
2868
- {}
2869
- );
2870
- const listAttributes = convertListLayoutToFieldLayouts(
2871
- data.contentType.layouts.list,
2872
- schema?.attributes,
2873
- listMetadatas,
2874
- { configurations: data.components, schemas: components },
2875
- schemas
2876
- );
2877
- return {
2878
- layout: listAttributes,
2879
- settings: { ...data.contentType.settings, displayName: schema?.info.displayName },
2880
- metadatas: listMetadatas,
2881
- options: {
2882
- ...schema?.options,
2883
- ...schema?.pluginOptions,
2884
- ...data.contentType.options
2929
+ variant: "danger",
2930
+ position: ["header", "table-row"]
2931
+ };
2932
+ };
2933
+ DeleteAction$1.type = "delete";
2934
+ const DEFAULT_HEADER_ACTIONS = [EditTheModelAction, ConfigureTheViewAction, DeleteAction$1];
2935
+ const Panels = () => {
2936
+ const isCloning = useMatch(CLONE_PATH) !== null;
2937
+ const [
2938
+ {
2939
+ query: { status }
2940
+ }
2941
+ ] = useQueryParams({
2942
+ status: "draft"
2943
+ });
2944
+ const { model, id, document, meta, collectionType } = useDoc();
2945
+ const plugins = useStrapiApp("Panels", (state) => state.plugins);
2946
+ const props = {
2947
+ activeTab: status,
2948
+ model,
2949
+ documentId: id,
2950
+ document: isCloning ? void 0 : document,
2951
+ meta: isCloning ? void 0 : meta,
2952
+ collectionType
2953
+ };
2954
+ return /* @__PURE__ */ jsx(Flex, { direction: "column", alignItems: "stretch", gap: 2, children: /* @__PURE__ */ jsx(
2955
+ DescriptionComponentRenderer,
2956
+ {
2957
+ props,
2958
+ descriptions: plugins["content-manager"].apis.getEditViewSidePanels(),
2959
+ children: (panels) => panels.map(({ content, id: id2, ...description }) => /* @__PURE__ */ jsx(Panel, { ...description, children: content }, id2))
2885
2960
  }
2961
+ ) });
2962
+ };
2963
+ const ActionsPanel = () => {
2964
+ const { formatMessage } = useIntl();
2965
+ return {
2966
+ title: formatMessage({
2967
+ id: "content-manager.containers.edit.panels.default.title",
2968
+ defaultMessage: "Entry"
2969
+ }),
2970
+ content: /* @__PURE__ */ jsx(ActionsPanelContent, {})
2886
2971
  };
2887
2972
  };
2888
- const convertListLayoutToFieldLayouts = (columns, attributes = {}, metadatas, components, schemas = []) => {
2889
- return columns.map((name) => {
2890
- const attribute = attributes[name];
2891
- if (!attribute) {
2892
- return null;
2973
+ ActionsPanel.type = "actions";
2974
+ const ActionsPanelContent = () => {
2975
+ const isCloning = useMatch(CLONE_PATH) !== null;
2976
+ const [
2977
+ {
2978
+ query: { status = "draft" }
2893
2979
  }
2894
- const metadata = metadatas[name];
2895
- const settings = attribute.type === "component" && components ? components.configurations[attribute.component].settings : {};
2896
- return {
2897
- attribute,
2898
- label: metadata.label ?? "",
2899
- mainField: getMainField(attribute, metadata.mainField || settings.mainField, {
2900
- schemas,
2901
- components: components?.schemas ?? {}
2902
- }),
2903
- name,
2904
- searchable: metadata.searchable ?? true,
2905
- sortable: metadata.sortable ?? true
2906
- };
2907
- }).filter((field) => field !== null);
2980
+ ] = useQueryParams();
2981
+ const { model, id, document, meta, collectionType } = useDoc();
2982
+ const plugins = useStrapiApp("ActionsPanel", (state) => state.plugins);
2983
+ const props = {
2984
+ activeTab: status,
2985
+ model,
2986
+ documentId: id,
2987
+ document: isCloning ? void 0 : document,
2988
+ meta: isCloning ? void 0 : meta,
2989
+ collectionType
2990
+ };
2991
+ return /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 2, width: "100%", children: [
2992
+ /* @__PURE__ */ jsx(
2993
+ DescriptionComponentRenderer,
2994
+ {
2995
+ props,
2996
+ descriptions: plugins["content-manager"].apis.getDocumentActions(),
2997
+ children: (actions2) => /* @__PURE__ */ jsx(DocumentActions, { actions: actions2 })
2998
+ }
2999
+ ),
3000
+ /* @__PURE__ */ jsx(InjectionZone, { area: "editView.right-links", slug: model })
3001
+ ] });
2908
3002
  };
3003
+ const Panel = React.forwardRef(({ children, title }, ref) => {
3004
+ return /* @__PURE__ */ jsxs(
3005
+ Flex,
3006
+ {
3007
+ ref,
3008
+ tag: "aside",
3009
+ "aria-labelledby": "additional-information",
3010
+ background: "neutral0",
3011
+ borderColor: "neutral150",
3012
+ hasRadius: true,
3013
+ paddingBottom: 4,
3014
+ paddingLeft: 4,
3015
+ paddingRight: 4,
3016
+ paddingTop: 4,
3017
+ shadow: "tableShadow",
3018
+ gap: 3,
3019
+ direction: "column",
3020
+ justifyContent: "stretch",
3021
+ alignItems: "flex-start",
3022
+ children: [
3023
+ /* @__PURE__ */ jsx(Typography, { tag: "h2", variant: "sigma", textTransform: "uppercase", children: title }),
3024
+ children
3025
+ ]
3026
+ }
3027
+ );
3028
+ });
2909
3029
  const ConfirmBulkActionDialog = ({
2910
3030
  onToggleDialog,
2911
3031
  isOpen = false,
@@ -2944,6 +3064,7 @@ const ConfirmDialogPublishAll = ({
2944
3064
  const { _unstableFormatAPIError: formatAPIError } = useAPIErrorHandler(getTranslation);
2945
3065
  const { model, schema } = useDoc();
2946
3066
  const [{ query }] = useQueryParams();
3067
+ const enableDraftRelationsCount = false;
2947
3068
  const {
2948
3069
  data: countDraftRelations = 0,
2949
3070
  isLoading,
@@ -2955,7 +3076,7 @@ const ConfirmDialogPublishAll = ({
2955
3076
  locale: query?.plugins?.i18n?.locale
2956
3077
  },
2957
3078
  {
2958
- skip: selectedEntries.length === 0
3079
+ skip: !enableDraftRelationsCount
2959
3080
  }
2960
3081
  );
2961
3082
  React.useEffect(() => {
@@ -3140,7 +3261,7 @@ const SelectedEntriesTableContent = ({
3140
3261
  status: row.status
3141
3262
  }
3142
3263
  ) }),
3143
- /* @__PURE__ */ jsx(Table.Cell, { children: /* @__PURE__ */ jsx(
3264
+ /* @__PURE__ */ jsx(Table.Cell, { children: /* @__PURE__ */ jsx(Flex, { children: /* @__PURE__ */ jsx(
3144
3265
  IconButton,
3145
3266
  {
3146
3267
  tag: Link,
@@ -3163,9 +3284,10 @@ const SelectedEntriesTableContent = ({
3163
3284
  ),
3164
3285
  target: "_blank",
3165
3286
  marginLeft: "auto",
3166
- children: /* @__PURE__ */ jsx(Pencil, {})
3287
+ variant: "ghost",
3288
+ children: /* @__PURE__ */ jsx(Pencil, { width: "1.6rem", height: "1.6rem" })
3167
3289
  }
3168
- ) })
3290
+ ) }) })
3169
3291
  ] }, row.id)) })
3170
3292
  ] });
3171
3293
  };
@@ -3900,7 +4022,7 @@ const index = {
3900
4022
  app.router.addRoute({
3901
4023
  path: "content-manager/*",
3902
4024
  lazy: async () => {
3903
- const { Layout } = await import("./layout-ls3gxfpH.mjs");
4025
+ const { Layout } = await import("./layout-C5uSVTqi.mjs");
3904
4026
  return {
3905
4027
  Component: Layout
3906
4028
  };
@@ -3917,7 +4039,7 @@ const index = {
3917
4039
  async registerTrads({ locales }) {
3918
4040
  const importedTrads = await Promise.all(
3919
4041
  locales.map((locale) => {
3920
- return __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "./translations/ar.json": () => import("./ar-CCEVvqGG.mjs"), "./translations/ca.json": () => import("./ca-5U32ON2v.mjs"), "./translations/cs.json": () => import("./cs-CM2aBUar.mjs"), "./translations/de.json": () => import("./de-C72KDNOl.mjs"), "./translations/en.json": () => import("./en-BrCTWlZv.mjs"), "./translations/es.json": () => import("./es-CeXiYflN.mjs"), "./translations/eu.json": () => import("./eu-CdALomew.mjs"), "./translations/fr.json": () => import("./fr-CD9VFbPM.mjs"), "./translations/gu.json": () => import("./gu-CNpaMDpH.mjs"), "./translations/hi.json": () => import("./hi-Dwvd04m3.mjs"), "./translations/hu.json": () => import("./hu-CeYvaaO0.mjs"), "./translations/id.json": () => import("./id-BtwA9WJT.mjs"), "./translations/it.json": () => import("./it-BrVPqaf1.mjs"), "./translations/ja.json": () => import("./ja-CtsUxOvk.mjs"), "./translations/ko.json": () => import("./ko-HVQRlfUI.mjs"), "./translations/ml.json": () => import("./ml-BihZwQit.mjs"), "./translations/ms.json": () => import("./ms-m_WjyWx7.mjs"), "./translations/nl.json": () => import("./nl-D4R9gHx5.mjs"), "./translations/pl.json": () => import("./pl-sbx9mSt_.mjs"), "./translations/pt-BR.json": () => import("./pt-BR-C71iDxnh.mjs"), "./translations/pt.json": () => import("./pt-BsaFvS8-.mjs"), "./translations/ru.json": () => import("./ru-BE6A4Exp.mjs"), "./translations/sa.json": () => import("./sa-Dag0k-Z8.mjs"), "./translations/sk.json": () => import("./sk-BFg-R8qJ.mjs"), "./translations/sv.json": () => import("./sv-CUnfWGsh.mjs"), "./translations/th.json": () => import("./th-BqbI8lIT.mjs"), "./translations/tr.json": () => import("./tr-CgeK3wJM.mjs"), "./translations/uk.json": () => import("./uk-CR-zDhAY.mjs"), "./translations/vi.json": () => import("./vi-DUXIk_fw.mjs"), "./translations/zh-Hans.json": () => import("./zh-Hans-BPQcRIyH.mjs"), "./translations/zh.json": () => import("./zh-BWZspA60.mjs") }), `./translations/${locale}.json`).then(({ default: data }) => {
4042
+ return __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "./translations/ar.json": () => import("./ar-CCEVvqGG.mjs"), "./translations/ca.json": () => import("./ca-5U32ON2v.mjs"), "./translations/cs.json": () => import("./cs-CM2aBUar.mjs"), "./translations/de.json": () => import("./de-C72KDNOl.mjs"), "./translations/en.json": () => import("./en-DKV44jRb.mjs"), "./translations/es.json": () => import("./es-CeXiYflN.mjs"), "./translations/eu.json": () => import("./eu-CdALomew.mjs"), "./translations/fr.json": () => import("./fr-CD9VFbPM.mjs"), "./translations/gu.json": () => import("./gu-CNpaMDpH.mjs"), "./translations/hi.json": () => import("./hi-Dwvd04m3.mjs"), "./translations/hu.json": () => import("./hu-CeYvaaO0.mjs"), "./translations/id.json": () => import("./id-BtwA9WJT.mjs"), "./translations/it.json": () => import("./it-BrVPqaf1.mjs"), "./translations/ja.json": () => import("./ja-CtsUxOvk.mjs"), "./translations/ko.json": () => import("./ko-HVQRlfUI.mjs"), "./translations/ml.json": () => import("./ml-BihZwQit.mjs"), "./translations/ms.json": () => import("./ms-m_WjyWx7.mjs"), "./translations/nl.json": () => import("./nl-D4R9gHx5.mjs"), "./translations/pl.json": () => import("./pl-sbx9mSt_.mjs"), "./translations/pt-BR.json": () => import("./pt-BR-C71iDxnh.mjs"), "./translations/pt.json": () => import("./pt-BsaFvS8-.mjs"), "./translations/ru.json": () => import("./ru-BE6A4Exp.mjs"), "./translations/sa.json": () => import("./sa-Dag0k-Z8.mjs"), "./translations/sk.json": () => import("./sk-BFg-R8qJ.mjs"), "./translations/sv.json": () => import("./sv-CUnfWGsh.mjs"), "./translations/th.json": () => import("./th-BqbI8lIT.mjs"), "./translations/tr.json": () => import("./tr-CgeK3wJM.mjs"), "./translations/uk.json": () => import("./uk-CR-zDhAY.mjs"), "./translations/vi.json": () => import("./vi-DUXIk_fw.mjs"), "./translations/zh-Hans.json": () => import("./zh-Hans-BPQcRIyH.mjs"), "./translations/zh.json": () => import("./zh-BWZspA60.mjs") }), `./translations/${locale}.json`).then(({ default: data }) => {
3921
4043
  return {
3922
4044
  data: prefixPluginTranslations(data, PLUGIN_ID),
3923
4045
  locale
@@ -3945,7 +4067,8 @@ export {
3945
4067
  InjectionZone as I,
3946
4068
  useDocument as J,
3947
4069
  index as K,
3948
- useDocumentActions as L,
4070
+ useContentManagerContext as L,
4071
+ useDocumentActions as M,
3949
4072
  Panels as P,
3950
4073
  RelativeTime as R,
3951
4074
  SINGLE_TYPES as S,
@@ -3977,4 +4100,4 @@ export {
3977
4100
  capitalise as y,
3978
4101
  useUpdateContentTypeConfigurationMutation as z
3979
4102
  };
3980
- //# sourceMappingURL=index-DiMrfcfy.mjs.map
4103
+ //# sourceMappingURL=index-CsfwpRfc.mjs.map