From 04bbd2215e60b5c14c459add66391813cd75165c Mon Sep 17 00:00:00 2001 From: Ben Irvin Date: Wed, 26 Apr 2023 11:35:55 +0200 Subject: [PATCH 01/11] add error when content type wasn't loaded --- packages/core/strapi/lib/core/loaders/apis.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/core/strapi/lib/core/loaders/apis.js b/packages/core/strapi/lib/core/loaders/apis.js index 83459f22e5..6290e57be9 100644 --- a/packages/core/strapi/lib/core/loaders/apis.js +++ b/packages/core/strapi/lib/core/loaders/apis.js @@ -5,6 +5,7 @@ const { existsSync } = require('fs-extra'); const _ = require('lodash'); const fse = require('fs-extra'); const { isKebabCase, importDefault } = require('@strapi/utils'); +const { isEmpty } = require('lodash/fp'); const DEFAULT_CONTENT_TYPE = { schema: {}, @@ -115,6 +116,10 @@ const loadContentTypes = async (dir) => { const contentTypeName = normalizeName(fd.name); const contentType = await loadDir(join(dir, fd.name)); + if (isEmpty(contentType.schema)) { + strapi?.log?.error(`Could not load content type found at ${dir}`); + } + contentTypes[normalizeName(contentTypeName)] = _.defaults(contentType, DEFAULT_CONTENT_TYPE); } From 53a4abeb7714fe20dd1e6d5882f5ec85e7fa97c2 Mon Sep 17 00:00:00 2001 From: Ben Irvin Date: Wed, 26 Apr 2023 11:41:03 +0200 Subject: [PATCH 02/11] throw error instead of logging --- packages/core/strapi/lib/core/loaders/apis.js | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/packages/core/strapi/lib/core/loaders/apis.js b/packages/core/strapi/lib/core/loaders/apis.js index 6290e57be9..2fbafcc415 100644 --- a/packages/core/strapi/lib/core/loaders/apis.js +++ b/packages/core/strapi/lib/core/loaders/apis.js @@ -116,8 +116,13 @@ const loadContentTypes = async (dir) => { const contentTypeName = normalizeName(fd.name); const contentType = await loadDir(join(dir, fd.name)); - if (isEmpty(contentType.schema)) { - strapi?.log?.error(`Could not load content type found at ${dir}`); + if ( + isEmpty(contentType) || + (isEmpty(contentType.schema) && + isEmpty(contentType.actions) && + isEmpty(contentType.lifecycles)) + ) { + throw new Error(`Could not load content type found at ${dir}`); } contentTypes[normalizeName(contentTypeName)] = _.defaults(contentType, DEFAULT_CONTENT_TYPE); From ea752585556dc87181357a9b4334fc4e6fa75b75 Mon Sep 17 00:00:00 2001 From: Ben Irvin Date: Wed, 26 Apr 2023 11:56:40 +0200 Subject: [PATCH 03/11] only check if schema exists --- packages/core/strapi/lib/core/loaders/apis.js | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/packages/core/strapi/lib/core/loaders/apis.js b/packages/core/strapi/lib/core/loaders/apis.js index 2fbafcc415..bceabd2396 100644 --- a/packages/core/strapi/lib/core/loaders/apis.js +++ b/packages/core/strapi/lib/core/loaders/apis.js @@ -116,12 +116,7 @@ const loadContentTypes = async (dir) => { const contentTypeName = normalizeName(fd.name); const contentType = await loadDir(join(dir, fd.name)); - if ( - isEmpty(contentType) || - (isEmpty(contentType.schema) && - isEmpty(contentType.actions) && - isEmpty(contentType.lifecycles)) - ) { + if (isEmpty(contentType) || isEmpty(contentType.schema)) { throw new Error(`Could not load content type found at ${dir}`); } From 5c2422bf8d3871ff2566c18cc7f96b4fa14f04fe Mon Sep 17 00:00:00 2001 From: nathan-pichon Date: Wed, 26 Apr 2023 12:12:31 +0200 Subject: [PATCH 04/11] docs(contrib): add review workflows tech design --- docs/docs/core/admin/ee/intro.md | 17 +++ docs/docs/core/admin/ee/review-workflows.md | 140 ++++++++++++++++++++ docs/docs/core/admin/intro.md | 17 +++ docs/sidebars.js | 30 +++-- 4 files changed, 193 insertions(+), 11 deletions(-) create mode 100644 docs/docs/core/admin/ee/intro.md create mode 100644 docs/docs/core/admin/ee/review-workflows.md create mode 100644 docs/docs/core/admin/intro.md diff --git a/docs/docs/core/admin/ee/intro.md b/docs/docs/core/admin/ee/intro.md new file mode 100644 index 0000000000..12a3ff99bb --- /dev/null +++ b/docs/docs/core/admin/ee/intro.md @@ -0,0 +1,17 @@ +--- +title: Introduction +slug: /admin/ee +tags: + - enterprise-edition +--- + +# Admin Enterprise Edition + +This section is an overview of all the features related to the Enterprise Edition in Admin: + +```mdx-code-block +import DocCardList from '@theme/DocCardList'; +import { useCurrentSidebarCategory } from '@docusaurus/theme-common'; + + +``` diff --git a/docs/docs/core/admin/ee/review-workflows.md b/docs/docs/core/admin/ee/review-workflows.md new file mode 100644 index 0000000000..fdd7fdd91f --- /dev/null +++ b/docs/docs/core/admin/ee/review-workflows.md @@ -0,0 +1,140 @@ +--- +title: Review Workflows +slug: /admin/ee/review-workflows +description: Review workflow technical design +tags: + - review-workflows + - implementation + - tech design +--- + +# Review Workflows + +## Summary + +The review workflow feature is only available in the Enterprise Edition. +That is why, in part, it is completely decoupled from the code of the Community Edition. + +The purpose of this feature is to allow users to assign a tag to the various entities of their Strapi project. This tag is called a 'stage' and is available within what we will call a workflow. + +## Detailed backend design + +The Review Workflow feature have been built with one main consideration, to be decoupled from the Community Edition. As so, the implementation can relate a lot to how a plugin would be built. + +All the backend code related to Review Workflow can be found in `packages/core/admin/ee`. +This code is separated into several elements: + +- Two content-types + - _strapi_workflows_: `packages/core/admin/ee/server/content-types/workflow/index.js` + - _strapi_workflows_stages_: `packages/core/admin/ee/server/content-types/workflow-stage/index.js` +- Two controllers + - _workflows_: `packages/core/admin/ee/server/controllers/workflows/index.js` + - _stages_: `packages/core/admin/ee/server/controllers/workflows/stages/index.js` +- One middleware + - _contentTypeMiddleware_: `packages/core/admin/ee/server/middlewares/review-workflows.js` +- Routes + - `packages/core/admin/ee/server/routes/index.js` +- Four services + - _review-workflows_: `packages/core/admin/ee/server/services/review-workflows/review-workflows.js` + - _workflows_: `packages/core/admin/ee/server/services/review-workflows/workflows.js` + - _stages_: `packages/core/admin/ee/server/services/review-workflows/stages.js` + - _metrics_: `packages/core/admin/ee/server/services/review-workflows/metrics.js` +- One decorator + - _EntityService_ decorator: `packages/core/admin/ee/server/services/review-workflows/entity-service-decorator.js` +- One utils file + - _Review workflows utils_: `packages/core/admin/ee/server/utils/review-workflows.js` +- A bootstrap and a register part + - `packages/core/admin/ee/server/bootstrap.js` + - `packages/core/admin/ee/server/register.js` + +### Content types + +#### strapi_workflows + +This content type stores the workflow information and is responsible for holding all the information about stages and their order. In MVP, only one workflow is stored inside the Strapi database. + +#### strapi_workflows_stages + +This content type store the stage information such as its name. + +### Controllers + +#### workflows + +Used to interact with the `strapi_workflows` content-type. + +#### stages + +Used to interact with the `strapi_workflows_stages` content-type. + +### Middlewares + +#### contentTypeMiddleware + +In order to properly manage the options for content-type in the root level of the object, it is necessary to relocate the `reviewWorkflows` option within the `options` object located inside the content-type data. By doing so, we can ensure that all options are consistently organized and easily accessible within their respective data structures. This will also make it simpler to maintain and update the options as needed, providing a more streamlined and efficient workflow for developers working with the system. Therefore, it is recommended to move the reviewWorkflows option to its appropriate location within the options object inside the content-type data before sending it to the admin API. + +### Routes + +The Admin API of the Enterprise Edition includes several routes related to the Review Workflow feature. Here is a list of those routes: + +#### GET `/review-workflows/workflows` + +This route returns a list of all workflows. + +#### GET `/review-workflows/workflows/:id` + +This route returns the details of a specific workflow identified by the id parameter. + +#### GET `/review-workflows/workflows/:workflow_id/stages` + +This route returns a list of all stages associated with a specific workflow identified by the workflow_id parameter. + +#### GET `/review-workflows/workflows/:workflow_id/stages/:id` + +This route returns the details of a specific stage identified by the id parameter and associated with the workflow identified by the workflow_id parameter. + +#### PUT `/review-workflows/workflows/:workflow_id/stages` + +This route updates the stages associated with a specific workflow identified by the workflow_id parameter. The updated stages are passed in the request body. + +#### PUT `/content-manager/(collection|single)-types/:model_uid/:id/stage` + +This route updates the stage of a specific entity identified by the id parameter and belonging to a specific collection identified by the model_uid parameter. The new stage value is passed in the request body. + +### Services + +The Review Workflow feature of the Enterprise Edition includes several services to manipulate workflows and stages. Here is a list of those services: + +#### review-workflows + +This service is used during the bootstrap and register phases of Strapi. Its primary responsibility is to migrate data on entities as needed and add the stage field to the entity schemas. + +#### workflows + +This service is used to manipulate the workflows entities. It provides functionalities to create, retrieve, and update workflows. + +#### stages + +This service is used to manipulate the stages entities and to update stages on other entities. It provides functionalities to create, retrieve, update, and delete stages. + +#### metrics + +This is the telemetry service used to gather information on the usage of this feature. It provides information on the number of workflows and stages created, as well as the frequency of stage updates on entities. + +### Decorators + +#### Entity Service + +The entity service is decorated so that entities can be linked to a default stage upon creation. This allows the entities to be automatically associated with a specific workflow stage when they are created. + +## Alternatives + +The Review Workflow feature is currently included as a core feature within the Strapi repository. However, there has been discussion about potentially moving it to a plugin in the future. While no decision has been made on this subject yet, it is possible that it may happen at some point in the future. + +## Resources + +- https://docs.strapi.io/user-docs/settings/review-workflows +- https://docs.strapi.io/user-docs/content-type-builder/creating-new-content-type#creating-a-new-content-type +- https://docs.strapi.io/user-docs/users-roles-permissions/configuring-administrator-roles#plugins-and-settings +- [Content manager](/content-manager/review-workflows) +- [Content type builder](/content-type-builder/review-workflows) diff --git a/docs/docs/core/admin/intro.md b/docs/docs/core/admin/intro.md new file mode 100644 index 0000000000..123c42af8d --- /dev/null +++ b/docs/docs/core/admin/intro.md @@ -0,0 +1,17 @@ +--- +title: Introduction +slug: /admin +tags: + - admin +--- + +# Admin + +This section is an overview of all the features related to admin: + +```mdx-code-block +import DocCardList from '@theme/DocCardList'; +import { useCurrentSidebarCategory } from '@docusaurus/theme-common'; + + +``` diff --git a/docs/sidebars.js b/docs/sidebars.js index 0c85976892..8a7c391a5f 100644 --- a/docs/sidebars.js +++ b/docs/sidebars.js @@ -16,17 +16,6 @@ const sidebars = { // By default, Docusaurus generates a sidebar from the docs folder structure docs: [ 'index', - { - type: 'category', - label: 'Admin', - items: [ - { - type: 'doc', - label: 'Link Strapi Design System', - id: 'core/admin/link-strapi-design-system', - }, - ], - }, { type: 'category', label: 'Core', @@ -38,7 +27,26 @@ const sidebars = { { type: 'category', label: 'Admin', + link: { + type: 'doc', + id: 'core/admin/intro', + }, items: [ + { + type: 'category', + label: 'Enterprise Edition', + link: { + type: 'doc', + id: 'core/admin/ee/intro', + }, + items: [ + { + type: 'doc', + label: 'Review Workflows', + id: 'core/admin/ee/review-workflows', + }, + ], + }, { type: 'doc', label: 'Link Strapi Design System', From 63e35a6550491ac14587ec8b4800f0664282c671 Mon Sep 17 00:00:00 2001 From: Ben Irvin Date: Wed, 26 Apr 2023 15:19:01 +0200 Subject: [PATCH 05/11] allow builder to set collection name --- .../server/services/schema-builder/content-type-builder.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/core/content-type-builder/server/services/schema-builder/content-type-builder.js b/packages/core/content-type-builder/server/services/schema-builder/content-type-builder.js index c65d162396..3aeea6345b 100644 --- a/packages/core/content-type-builder/server/services/schema-builder/content-type-builder.js +++ b/packages/core/content-type-builder/server/services/schema-builder/content-type-builder.js @@ -101,7 +101,7 @@ module.exports = function createComponentBuilder() { contentType .setUID(uid) .set('kind', infos.kind || typeKinds.COLLECTION_TYPE) - .set('collectionName', nameToCollectionName(infos.pluralName)) + .set('collectionName', infos.collectionName || nameToCollectionName(infos.pluralName)) .set('info', { singularName: infos.singularName, pluralName: infos.pluralName, From 4dd2d2b5f2fc3efcaa1e4a1be4389b992b44684f Mon Sep 17 00:00:00 2001 From: Marc-Roig Date: Wed, 26 Apr 2023 15:49:47 +0200 Subject: [PATCH 06/11] chore: run dependabot sunday night --- .github/dependabot.yml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.github/dependabot.yml b/.github/dependabot.yml index 6bee948be8..06ee6c99bc 100644 --- a/.github/dependabot.yml +++ b/.github/dependabot.yml @@ -24,6 +24,8 @@ updates: directory: / schedule: interval: weekly + day: sunday + time: '22:00' labels: - 'source: dependencies' - 'pr: chore' From 9f0c0531584c2cbb036d8a8c901b90516862a37e Mon Sep 17 00:00:00 2001 From: Marc-Roig Date: Wed, 26 Apr 2023 20:10:21 +0200 Subject: [PATCH 07/11] chore: add interval to npm dependabot action --- .github/dependabot.yml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.github/dependabot.yml b/.github/dependabot.yml index 06ee6c99bc..82cb946a0e 100644 --- a/.github/dependabot.yml +++ b/.github/dependabot.yml @@ -4,6 +4,8 @@ updates: directory: / schedule: interval: weekly + day: sunday + time: '22:00' versioning-strategy: increase ignore: # Only allow patch as minor babel versions need to be upgraded all together From 7216f753f8323531a228f237ca8a57743be5ff02 Mon Sep 17 00:00:00 2001 From: Convly Date: Thu, 27 Apr 2023 09:38:16 +0200 Subject: [PATCH 08/11] Fix generator tests (upgrade to ts V5) --- .../typescript/lib/__tests__/generators/schemas/utils.test.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/packages/utils/typescript/lib/__tests__/generators/schemas/utils.test.js b/packages/utils/typescript/lib/__tests__/generators/schemas/utils.test.js index 4bb9b20371..5a448bc81a 100644 --- a/packages/utils/typescript/lib/__tests__/generators/schemas/utils.test.js +++ b/packages/utils/typescript/lib/__tests__/generators/schemas/utils.test.js @@ -68,7 +68,6 @@ describe('Utils', () => { describe('Get Definition Attributes Count', () => { const createMainNode = (members = []) => { return factory.createInterfaceDeclaration( - undefined, undefined, factory.createIdentifier('Foo'), undefined, @@ -79,7 +78,6 @@ describe('Utils', () => { const createPropertyDeclaration = (name, type) => { return factory.createPropertyDeclaration( - undefined, undefined, factory.createIdentifier(name), undefined, From 27ee844d0893b50ecf79f12d94e705cb514fcb9c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?R=C3=A9mi=20de=20Juvigny?= Date: Thu, 27 Apr 2023 09:54:56 +0200 Subject: [PATCH 09/11] Remove log from tests --- .../server/services/__tests__/field-sizes.test.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/core/content-manager/server/services/__tests__/field-sizes.test.js b/packages/core/content-manager/server/services/__tests__/field-sizes.test.js index 0b4e5d3780..3947634f68 100644 --- a/packages/core/content-manager/server/services/__tests__/field-sizes.test.js +++ b/packages/core/content-manager/server/services/__tests__/field-sizes.test.js @@ -71,7 +71,6 @@ describe('field sizes service', () => { const { setCustomFieldInputSizes, getAllFieldSizes } = createFieldSizesService({ strapi }); setCustomFieldInputSizes(); const fieldSizes = getAllFieldSizes(); - console.log(fieldSizes); expect(fieldSizes).not.toHaveProperty('plugin::mycustomfields.color'); expect(fieldSizes['plugin::mycustomfields.smallColor'].default).toBe(4); From e5756043ef0443bb3beeab6c4aedec4f625ab97d Mon Sep 17 00:00:00 2001 From: Gustav Hansen Date: Wed, 26 Apr 2023 17:53:10 +0200 Subject: [PATCH 10/11] Chore: Split DragLayer out of the CM and make it available across the app --- .../src/components/DragLayer/DragLayer.js | 53 ++++++++++++ .../admin/src/components/DragLayer/index.js | 1 + .../DragLayer/ComponentDragPreview.js | 83 ------------------ .../components/DragLayer/index.js | 85 ------------------- .../src/content-manager/contexts/LayoutDnd.js | 5 -- .../src/content-manager/contexts/index.js | 1 - .../admin/src/content-manager/hooks/index.js | 1 - .../src/content-manager/hooks/useLayoutDnd.js | 6 -- .../components/CardDragPreview.js} | 56 ++++++------ .../App/components/ComponentDragPreview.js | 75 ++++++++++++++++ .../App/components}/RelationDragPreview.js | 11 ++- .../src/content-manager/pages/App/index.js | 41 ++++++++- .../components/ComponentFieldList.js | 2 +- .../components/DisplayedFieldButton.js | 2 +- .../components/DynamicZoneList.js | 2 +- .../EditSettingsView/components/FormModal.js | 2 +- .../components/LayoutDndProvider/index.js | 7 +- .../EditSettingsView/components/LinkToCTB.js | 2 +- .../EditSettingsView/components/ModalForm.js | 2 +- .../components/RowItemsLayout.js | 2 +- .../EditSettingsView/hooks/useLayoutDnd.js | 6 ++ .../pages/EditSettingsView/index.js | 2 +- .../components/DraggableCard.js | 12 +-- .../tests/ellipsisCardTitle.test.js | 19 ----- .../utils/ellipsisCardTitle.js | 7 -- 25 files changed, 226 insertions(+), 259 deletions(-) create mode 100644 packages/core/admin/admin/src/components/DragLayer/DragLayer.js create mode 100644 packages/core/admin/admin/src/components/DragLayer/index.js delete mode 100644 packages/core/admin/admin/src/content-manager/components/DragLayer/ComponentDragPreview.js delete mode 100644 packages/core/admin/admin/src/content-manager/components/DragLayer/index.js delete mode 100644 packages/core/admin/admin/src/content-manager/contexts/LayoutDnd.js delete mode 100644 packages/core/admin/admin/src/content-manager/hooks/useLayoutDnd.js rename packages/core/admin/admin/src/content-manager/pages/{ListSettingsView/components/CardPreview.js => App/components/CardDragPreview.js} (57%) create mode 100644 packages/core/admin/admin/src/content-manager/pages/App/components/ComponentDragPreview.js rename packages/core/admin/admin/src/content-manager/{components/DragLayer => pages/App/components}/RelationDragPreview.js (87%) rename packages/core/admin/admin/src/content-manager/{ => pages/EditSettingsView}/components/LayoutDndProvider/index.js (91%) create mode 100644 packages/core/admin/admin/src/content-manager/pages/EditSettingsView/hooks/useLayoutDnd.js delete mode 100644 packages/core/admin/admin/src/content-manager/pages/ListSettingsView/tests/ellipsisCardTitle.test.js delete mode 100644 packages/core/admin/admin/src/content-manager/pages/ListSettingsView/utils/ellipsisCardTitle.js diff --git a/packages/core/admin/admin/src/components/DragLayer/DragLayer.js b/packages/core/admin/admin/src/components/DragLayer/DragLayer.js new file mode 100644 index 0000000000..6a4e1ea60e --- /dev/null +++ b/packages/core/admin/admin/src/components/DragLayer/DragLayer.js @@ -0,0 +1,53 @@ +import * as React from 'react'; +import PropTypes from 'prop-types'; +import { useDragLayer } from 'react-dnd'; +import { Box } from '@strapi/design-system'; + +function getStyle(initialOffset, currentOffset, mouseOffset) { + if (!initialOffset || !currentOffset) { + return { display: 'none' }; + } + + const { x, y } = mouseOffset; + + return { + transform: `translate(${x}px, ${y}px)`, + }; +} + +export function DragLayer({ renderItem }) { + const { itemType, isDragging, item, initialOffset, currentOffset, mouseOffset } = useDragLayer( + (monitor) => ({ + item: monitor.getItem(), + itemType: monitor.getItemType(), + initialOffset: monitor.getInitialSourceClientOffset(), + currentOffset: monitor.getSourceClientOffset(), + isDragging: monitor.isDragging(), + mouseOffset: monitor.getClientOffset(), + }) + ); + + if (!isDragging) { + return null; + } + + return ( + + + {renderItem({ type: itemType, item })} + + + ); +} + +DragLayer.propTypes = { + renderItem: PropTypes.func.isRequired, +}; diff --git a/packages/core/admin/admin/src/components/DragLayer/index.js b/packages/core/admin/admin/src/components/DragLayer/index.js new file mode 100644 index 0000000000..c3e27fec39 --- /dev/null +++ b/packages/core/admin/admin/src/components/DragLayer/index.js @@ -0,0 +1 @@ +export * from './DragLayer'; diff --git a/packages/core/admin/admin/src/content-manager/components/DragLayer/ComponentDragPreview.js b/packages/core/admin/admin/src/content-manager/components/DragLayer/ComponentDragPreview.js deleted file mode 100644 index 05610a6f3c..0000000000 --- a/packages/core/admin/admin/src/content-manager/components/DragLayer/ComponentDragPreview.js +++ /dev/null @@ -1,83 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import styled from 'styled-components'; -import { pxToRem } from '@strapi/helper-plugin'; -import { Box, Flex, Typography, IconButton } from '@strapi/design-system'; -import { Trash, Drag, CarretDown } from '@strapi/icons'; - -const DragPreviewBox = styled(Box)` - border: 1px solid ${({ theme }) => theme.colors.neutral200}; -`; - -const DropdownIconWrapper = styled(Box)` - height: ${32 / 16}rem; - width: ${32 / 16}rem; - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - - svg { - height: ${6 / 16}rem; - width: ${11 / 16}rem; - > path { - fill: ${({ theme }) => theme.colors.neutral600}; - } - } -`; - -const ToggleButton = styled.button` - border: none; - background: transparent; - display: block; - width: 100%; - text-align: unset; - padding: 0; -`; - -const DragPreview = ({ displayedValue }) => { - return ( - - - - - - - - - - {displayedValue} - - - - - - - - - - - - - - - - - - - ); -}; - -DragPreview.propTypes = { - displayedValue: PropTypes.string.isRequired, -}; - -export default DragPreview; diff --git a/packages/core/admin/admin/src/content-manager/components/DragLayer/index.js b/packages/core/admin/admin/src/content-manager/components/DragLayer/index.js deleted file mode 100644 index 68433948b5..0000000000 --- a/packages/core/admin/admin/src/content-manager/components/DragLayer/index.js +++ /dev/null @@ -1,85 +0,0 @@ -import React from 'react'; -import { useDragLayer } from 'react-dnd'; -import LayoutDndProvider from '../LayoutDndProvider'; - -import ItemTypes from '../../utils/ItemTypes'; -import CardPreview from '../../pages/ListSettingsView/components/CardPreview'; - -import ComponentPreview from './ComponentDragPreview'; -import { RelationDragPreview } from './RelationDragPreview'; - -const layerStyles = { - position: 'fixed', - pointerEvents: 'none', - zIndex: 100, - left: 0, - top: 0, - width: '100%', - height: '100%', -}; - -function getItemStyles(initialOffset, currentOffset, mouseOffset) { - if (!initialOffset || !currentOffset) { - return { display: 'none' }; - } - - const { x, y } = mouseOffset; - // TODO adjust - const transform = `translate(${x}px, ${y}px)`; - - return { - transform, - WebkitTransform: transform, - }; -} - -const CustomDragLayer = () => { - const { itemType, isDragging, item, initialOffset, currentOffset, mouseOffset } = useDragLayer( - (monitor) => ({ - item: monitor.getItem(), - itemType: monitor.getItemType(), - initialOffset: monitor.getInitialSourceClientOffset(), - currentOffset: monitor.getSourceClientOffset(), - isDragging: monitor.isDragging(), - mouseOffset: monitor.getClientOffset(), - }) - ); - - if (!isDragging) { - return null; - } - - /** - * Because a user may have multiple relations / dynamic zones / repeable fields in the same content type, - * we append the fieldName for the item type to make them unique, however, we then want to extract that - * first type to apply the correct preview. - */ - const [actualType] = itemType.split('_'); - - return ( - -
-
- {[ItemTypes.EDIT_FIELD, ItemTypes.FIELD].includes(itemType) && ( - - )} - {actualType === ItemTypes.COMPONENT && ( - - )} - {actualType === ItemTypes.DYNAMIC_ZONE && ( - - )} - {actualType === ItemTypes.RELATION && ( - - )} -
-
-
- ); -}; - -export default CustomDragLayer; diff --git a/packages/core/admin/admin/src/content-manager/contexts/LayoutDnd.js b/packages/core/admin/admin/src/content-manager/contexts/LayoutDnd.js deleted file mode 100644 index ce3aabb2e1..0000000000 --- a/packages/core/admin/admin/src/content-manager/contexts/LayoutDnd.js +++ /dev/null @@ -1,5 +0,0 @@ -import { createContext } from 'react'; - -const LayoutDndContext = createContext(); - -export default LayoutDndContext; diff --git a/packages/core/admin/admin/src/content-manager/contexts/index.js b/packages/core/admin/admin/src/content-manager/contexts/index.js index 57f80ff490..5963d09669 100644 --- a/packages/core/admin/admin/src/content-manager/contexts/index.js +++ b/packages/core/admin/admin/src/content-manager/contexts/index.js @@ -1,3 +1,2 @@ export { default as ContentTypeLayoutContext } from './ContentTypeLayout'; -export { default as LayoutDndContext } from './LayoutDnd'; export { default as WysiwygContext } from './Wysiwyg'; diff --git a/packages/core/admin/admin/src/content-manager/hooks/index.js b/packages/core/admin/admin/src/content-manager/hooks/index.js index e8c78799e6..ff6e0bf5e9 100644 --- a/packages/core/admin/admin/src/content-manager/hooks/index.js +++ b/packages/core/admin/admin/src/content-manager/hooks/index.js @@ -1,7 +1,6 @@ export { default as useContentTypeLayout } from './useContentTypeLayout'; export { default as useFetchContentTypeLayout } from './useFetchContentTypeLayout'; export { default as useFindRedirectionLink } from './useFindRedirectionLink'; -export { default as useLayoutDnd } from './useLayoutDnd'; export { default as usePluginsQueryParams } from './usePluginsQueryParams'; export { default as useSyncRbac } from './useSyncRbac'; export { default as useWysiwyg } from './useWysiwyg'; diff --git a/packages/core/admin/admin/src/content-manager/hooks/useLayoutDnd.js b/packages/core/admin/admin/src/content-manager/hooks/useLayoutDnd.js deleted file mode 100644 index 07f05de8e6..0000000000 --- a/packages/core/admin/admin/src/content-manager/hooks/useLayoutDnd.js +++ /dev/null @@ -1,6 +0,0 @@ -import { useContext } from 'react'; -import LayoutDndContext from '../contexts/LayoutDnd'; - -const useLayoutDnd = () => useContext(LayoutDndContext); - -export default useLayoutDnd; diff --git a/packages/core/admin/admin/src/content-manager/pages/ListSettingsView/components/CardPreview.js b/packages/core/admin/admin/src/content-manager/pages/App/components/CardDragPreview.js similarity index 57% rename from packages/core/admin/admin/src/content-manager/pages/ListSettingsView/components/CardPreview.js rename to packages/core/admin/admin/src/content-manager/pages/App/components/CardDragPreview.js index 5cc8a5506d..326cc50910 100644 --- a/packages/core/admin/admin/src/content-manager/pages/ListSettingsView/components/CardPreview.js +++ b/packages/core/admin/admin/src/content-manager/pages/App/components/CardDragPreview.js @@ -3,7 +3,7 @@ import PropTypes from 'prop-types'; import styled from 'styled-components'; import { Flex, Typography } from '@strapi/design-system'; import { Pencil, Cross, Drag } from '@strapi/icons'; -import ellipsisCardTitle from '../utils/ellipsisCardTitle'; +import { pxToRem } from '@strapi/helper-plugin'; const ActionBox = styled(Flex)` height: ${({ theme }) => theme.spaces[7]}; @@ -14,9 +14,8 @@ const ActionBox = styled(Flex)` `; const DragButton = styled(ActionBox)` - padding: 0 ${({ theme }) => theme.spaces[3]}; - border-right: 1px solid ${({ theme }) => theme.colors.neutral150}; - cursor: all-scroll; + border-right: 1px solid + ${({ theme, isSibling }) => (isSibling ? theme.colors.neutral150 : theme.colors.primary200)}; svg { width: ${12 / 16}rem; @@ -25,11 +24,6 @@ const DragButton = styled(ActionBox)` `; const FieldContainer = styled(Flex)` - display: inline-flex; - max-height: ${32 / 16}rem; - opacity: ${({ transparent }) => (transparent ? 0 : 1)}; - background-color: ${({ theme, isSibling }) => - isSibling ? theme.colors.neutral100 : theme.colors.primary100}; border: 1px solid ${({ theme, isSibling }) => (isSibling ? theme.colors.neutral150 : theme.colors.primary200)}; @@ -41,54 +35,60 @@ const FieldContainer = styled(Flex)` fill: ${({ theme, isSibling }) => (isSibling ? undefined : theme.colors.primary600)}; } } - - ${Typography} { - color: ${({ theme, isSibling }) => (isSibling ? undefined : theme.colors.primary600)}; - } - - ${DragButton} { - border-right: 1px solid - ${({ theme, isSibling }) => (isSibling ? theme.colors.neutral150 : theme.colors.primary200)}; - } `; -const CardPreview = ({ labelField, transparent, isSibling }) => { - const cardEllipsisTitle = ellipsisCardTitle(labelField); +const TypographyMaxWidth = styled(Typography)` + max-width: ${72 / 16}rem; +`; +export function CardDragPreview({ labelField, transparent, isSibling }) { return ( - + - {cardEllipsisTitle} + + + {labelField} + - + + + ); -}; +} -CardPreview.defaultProps = { +CardDragPreview.defaultProps = { isSibling: false, transparent: false, }; -CardPreview.propTypes = { +CardDragPreview.propTypes = { isSibling: PropTypes.bool, labelField: PropTypes.string.isRequired, transparent: PropTypes.bool, }; - -export default CardPreview; diff --git a/packages/core/admin/admin/src/content-manager/pages/App/components/ComponentDragPreview.js b/packages/core/admin/admin/src/content-manager/pages/App/components/ComponentDragPreview.js new file mode 100644 index 0000000000..11ad22671c --- /dev/null +++ b/packages/core/admin/admin/src/content-manager/pages/App/components/ComponentDragPreview.js @@ -0,0 +1,75 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import styled from 'styled-components'; +import { pxToRem } from '@strapi/helper-plugin'; +import { Flex, Typography, IconButton } from '@strapi/design-system'; +import { Trash, Drag, CarretDown } from '@strapi/icons'; + +const DropdownIconWrapper = styled(Flex)` + border-radius: 50%; + + svg { + height: ${6 / 16}rem; + width: ${11 / 16}rem; + > path { + fill: ${({ theme }) => theme.colors.neutral600}; + } + } +`; + +// TODO: we shouldn't have to reset a whole button +const ToggleButton = styled.button` + border: none; + background: transparent; + display: block; + width: 100%; + text-align: unset; + padding: 0; +`; + +export function ComponentDragPreview({ displayedValue }) { + return ( + + + + + + + + + + {displayedValue} + + + + + + + + + + + + + + + + ); +} + +ComponentDragPreview.propTypes = { + displayedValue: PropTypes.string.isRequired, +}; diff --git a/packages/core/admin/admin/src/content-manager/components/DragLayer/RelationDragPreview.js b/packages/core/admin/admin/src/content-manager/pages/App/components/RelationDragPreview.js similarity index 87% rename from packages/core/admin/admin/src/content-manager/components/DragLayer/RelationDragPreview.js rename to packages/core/admin/admin/src/content-manager/pages/App/components/RelationDragPreview.js index f9c7037cfe..44ca070944 100644 --- a/packages/core/admin/admin/src/content-manager/components/DragLayer/RelationDragPreview.js +++ b/packages/core/admin/admin/src/content-manager/pages/App/components/RelationDragPreview.js @@ -4,10 +4,13 @@ import PropTypes from 'prop-types'; import { Box, Flex, IconButton, Typography, Status, Icon } from '@strapi/design-system'; import { Drag, Cross } from '@strapi/icons'; -import { getTrad } from '../../utils'; -import { PUBLICATION_STATES } from '../RelationInputDataManager/constants'; -import { ChildrenWrapper, FlexWrapper } from '../RelationInput/components/RelationItem'; -import { LinkEllipsis, DisconnectButton } from '../RelationInput'; +import { getTrad } from '../../../utils'; +import { PUBLICATION_STATES } from '../../../components/RelationInputDataManager/constants'; +import { + ChildrenWrapper, + FlexWrapper, +} from '../../../components/RelationInput/components/RelationItem'; +import { LinkEllipsis, DisconnectButton } from '../../../components/RelationInput'; export const RelationDragPreview = ({ status, displayedValue, width }) => { const { formatMessage } = useIntl(); diff --git a/packages/core/admin/admin/src/content-manager/pages/App/index.js b/packages/core/admin/admin/src/content-manager/pages/App/index.js index 4f8a64d5a6..4d13a8f6b0 100644 --- a/packages/core/admin/admin/src/content-manager/pages/App/index.js +++ b/packages/core/admin/admin/src/content-manager/pages/App/index.js @@ -12,7 +12,7 @@ import { useIntl } from 'react-intl'; import sortBy from 'lodash/sortBy'; import permissions from '../../../permissions'; import getTrad from '../../utils/getTrad'; -import DragLayer from '../../components/DragLayer'; +import { DragLayer } from '../../../components/DragLayer'; import ModelsContext from '../../contexts/ModelsContext'; import CollectionTypeRecursivePath from '../CollectionTypeRecursivePath'; import ComponentSettingsView from '../ComponentSetttingsView'; @@ -22,8 +22,45 @@ import SingleTypeRecursivePath from '../SingleTypeRecursivePath'; import LeftMenu from './LeftMenu'; import useContentManagerInitData from './useContentManagerInitData'; +import ItemTypes from '../../utils/ItemTypes'; + +import { CardDragPreview } from './components/CardDragPreview'; +import { ComponentDragPreview } from './components/ComponentDragPreview'; +import { RelationDragPreview } from './components/RelationDragPreview'; + const cmPermissions = permissions.contentManager; +function renderDraglayerItem({ type, item }) { + if ([ItemTypes.EDIT_FIELD, ItemTypes.FIELD].includes(type)) { + return ; + } + + /** + * Because a user may have multiple relations / dynamic zones / repeable fields in the same content type, + * we append the fieldName for the item type to make them unique, however, we then want to extract that + * first type to apply the correct preview. + */ + const [actualType] = type.split('_'); + + switch (actualType) { + case ItemTypes.COMPONENT: + case ItemTypes.DYNAMIC_ZONE: + return ; + + case ItemTypes.RELATION: + return ( + + ); + + default: + return null; + } +} + const App = () => { const contentTypeMatch = useRouteMatch(`/content-manager/:kind/:uid`); const { status, collectionTypeLinks, singleTypeLinks, models, refetchData } = @@ -85,7 +122,7 @@ const App = () => { return ( }> - + diff --git a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/ComponentFieldList.js b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/ComponentFieldList.js index 20147a4411..94be7071bf 100644 --- a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/ComponentFieldList.js +++ b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/ComponentFieldList.js @@ -5,7 +5,7 @@ import { Box, Flex, Typography, Grid, GridItem } from '@strapi/design-system'; import { Cog } from '@strapi/icons'; import { useIntl } from 'react-intl'; import get from 'lodash/get'; -import useLayoutDnd from '../../../hooks/useLayoutDnd'; +import { useLayoutDnd } from '../hooks/useLayoutDnd'; import getTrad from '../../../utils/getTrad'; const ComponentFieldList = ({ componentUid }) => { diff --git a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/DisplayedFieldButton.js b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/DisplayedFieldButton.js index d627ca2fb2..96fe848610 100644 --- a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/DisplayedFieldButton.js +++ b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/DisplayedFieldButton.js @@ -7,7 +7,7 @@ import { Flex, Box, GridItem } from '@strapi/design-system'; import { Drag } from '@strapi/icons'; import { ItemTypes } from '../../../utils'; import FieldButtonContent from './FieldButtonContent'; -import { useLayoutDnd } from '../../../hooks'; +import { useLayoutDnd } from '../hooks/useLayoutDnd'; const Wrapper = styled(Flex)` position: relative; diff --git a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/DynamicZoneList.js b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/DynamicZoneList.js index a70d97dd0c..380c6bcc9f 100644 --- a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/DynamicZoneList.js +++ b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/DynamicZoneList.js @@ -5,7 +5,7 @@ import PropTypes from 'prop-types'; import { Box, Flex, Typography } from '@strapi/design-system'; import { ComponentIcon } from '../../../components/ComponentIcon'; -import useLayoutDnd from '../../../hooks/useLayoutDnd'; +import { useLayoutDnd } from '../hooks/useLayoutDnd'; const CustomLink = styled(Flex)` text-decoration: none; diff --git a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/FormModal.js b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/FormModal.js index 06ab863966..fcc2dae6ad 100644 --- a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/FormModal.js +++ b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/FormModal.js @@ -14,7 +14,7 @@ import { } from '@strapi/design-system'; import styled from 'styled-components'; import { getTrad } from '../../../utils'; -import { useLayoutDnd } from '../../../hooks'; +import { useLayoutDnd } from '../hooks/useLayoutDnd'; import FieldTypeIcon from '../../../components/FieldTypeIcon'; import ModalForm from './ModalForm'; diff --git a/packages/core/admin/admin/src/content-manager/components/LayoutDndProvider/index.js b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/LayoutDndProvider/index.js similarity index 91% rename from packages/core/admin/admin/src/content-manager/components/LayoutDndProvider/index.js rename to packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/LayoutDndProvider/index.js index bb50f2b79f..3835cb9fa9 100644 --- a/packages/core/admin/admin/src/content-manager/components/LayoutDndProvider/index.js +++ b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/LayoutDndProvider/index.js @@ -1,8 +1,9 @@ import React from 'react'; import PropTypes from 'prop-types'; -import LayoutDndContext from '../../contexts/LayoutDnd'; -function LayoutDndProvider({ +export const LayoutDndContext = React.createContext(); + +export function LayoutDndProvider({ attributes, buttonData, children, @@ -71,5 +72,3 @@ LayoutDndProvider.propTypes = { selectedItemName: PropTypes.string, setEditFieldToSelect: PropTypes.func, }; - -export default LayoutDndProvider; diff --git a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/LinkToCTB.js b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/LinkToCTB.js index 7297c5bce3..c0e776137f 100644 --- a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/LinkToCTB.js +++ b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/LinkToCTB.js @@ -10,7 +10,7 @@ import { useIntl } from 'react-intl'; import get from 'lodash/get'; import { Pencil } from '@strapi/icons'; import getTrad from '../../../utils/getTrad'; -import useLayoutDnd from '../../../hooks/useLayoutDnd'; +import { useLayoutDnd } from '../hooks/useLayoutDnd'; const permissions = [{ action: 'plugin::content-type-builder.read', subject: null }]; diff --git a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/ModalForm.js b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/ModalForm.js index 157a11827a..d00553f433 100644 --- a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/ModalForm.js +++ b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/ModalForm.js @@ -4,7 +4,7 @@ import get from 'lodash/get'; import { GridItem, Select, Option } from '@strapi/design-system'; import { useSelector, shallowEqual } from 'react-redux'; import { useIntl } from 'react-intl'; -import { useLayoutDnd } from '../../../hooks'; +import { useLayoutDnd } from '../hooks/useLayoutDnd'; import { createPossibleMainFieldsForModelsAndComponents, getInputProps } from '../utils'; import { makeSelectModelAndComponentSchemas, selectFieldSizes } from '../../App/selectors'; import getTrad from '../../../utils/getTrad'; diff --git a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/RowItemsLayout.js b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/RowItemsLayout.js index e7ebcde88b..349beef53b 100644 --- a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/RowItemsLayout.js +++ b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/components/RowItemsLayout.js @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import get from 'lodash/get'; -import { useLayoutDnd } from '../../../hooks'; +import { useLayoutDnd } from '../hooks/useLayoutDnd'; import DisplayedFieldButton from './DisplayedFieldButton'; const RowItemsLayout = ({ rowItem, onRemoveField, rowId, rowIndex, index, lastIndex }) => { diff --git a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/hooks/useLayoutDnd.js b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/hooks/useLayoutDnd.js new file mode 100644 index 0000000000..95072fd39d --- /dev/null +++ b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/hooks/useLayoutDnd.js @@ -0,0 +1,6 @@ +import * as React from 'react'; +import { LayoutDndContext } from '../components/LayoutDndProvider'; + +export function useLayoutDnd() { + return React.useContext(LayoutDndContext); +} diff --git a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/index.js b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/index.js index 77c3af9a47..4df66dd71f 100644 --- a/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/index.js +++ b/packages/core/admin/admin/src/content-manager/pages/EditSettingsView/index.js @@ -32,7 +32,7 @@ import reducer, { initialState } from './reducer'; import init from './init'; import DisplayedFields from './components/DisplayedFields'; import ModalForm from './components/FormModal'; -import LayoutDndProvider from '../../components/LayoutDndProvider'; +import { LayoutDndProvider } from './components/LayoutDndProvider'; import { unformatLayout } from './utils/layout'; import putCMSettingsEV from './utils/api'; import { selectFieldSizes } from '../App/selectors'; diff --git a/packages/core/admin/admin/src/content-manager/pages/ListSettingsView/components/DraggableCard.js b/packages/core/admin/admin/src/content-manager/pages/ListSettingsView/components/DraggableCard.js index a4b5e22a28..da97957363 100644 --- a/packages/core/admin/admin/src/content-manager/pages/ListSettingsView/components/DraggableCard.js +++ b/packages/core/admin/admin/src/content-manager/pages/ListSettingsView/components/DraggableCard.js @@ -6,8 +6,8 @@ import { getEmptyImage } from 'react-dnd-html5-backend'; import { useIntl } from 'react-intl'; import { Flex, Box, Typography } from '@strapi/design-system'; import { Pencil, Cross, Drag } from '@strapi/icons'; -import CardPreview from './CardPreview'; -import ellipsisCardTitle from '../utils/ellipsisCardTitle'; + +import { CardDragPreview } from '../../App/components/CardDragPreview'; import { getTrad, ItemTypes } from '../../../utils'; const ActionButton = styled.button` @@ -85,7 +85,6 @@ const DraggableCard = ({ const dropRef = useRef(null); const [, forceRerenderAfterDnd] = useState(false); const editButtonRef = useRef(); - const cardEllipsisTitle = ellipsisCardTitle(labelField); const handleClickEditRow = () => { if (editButtonRef.current) { @@ -93,6 +92,7 @@ const DraggableCard = ({ } }; + // TODO: this can be simplified a lot by using the useDragAndDrop() hook const [, drop] = useDrop({ accept: ItemTypes.FIELD, hover(item, monitor) { @@ -176,8 +176,8 @@ const DraggableCard = ({ return ( - {isDragging && } - {!isDragging && isDraggingSibling && } + {isDragging && } + {!isDragging && isDraggingSibling && } {!isDragging && !isDraggingSibling && ( - {cardEllipsisTitle} + {labelField} { - it('should return the title without an ellipsis if the title length < 20', () => { - const title = 'michka'; - const result = ellipsisCardTitle(title); - const expected = 'michka'; - - expect(result).toEqual(expected); - }); - - it('should return the title with an ellipsis if the title length > 20', () => { - const title = 'michka_des_ronrons_celestes'; - const result = ellipsisCardTitle(title); - const expected = `${title.substring(0, 20)}...`; - - expect(result).toEqual(expected); - }); -}); diff --git a/packages/core/admin/admin/src/content-manager/pages/ListSettingsView/utils/ellipsisCardTitle.js b/packages/core/admin/admin/src/content-manager/pages/ListSettingsView/utils/ellipsisCardTitle.js deleted file mode 100644 index 66bd666cf9..0000000000 --- a/packages/core/admin/admin/src/content-manager/pages/ListSettingsView/utils/ellipsisCardTitle.js +++ /dev/null @@ -1,7 +0,0 @@ -const ellipsisCardTitle = (title) => { - const formatedTitle = title.length > 20 ? `${title.substring(0, 20)}...` : title; - - return formatedTitle; -}; - -export default ellipsisCardTitle; From c62bca7913992c38ac68ee959ec07f3b3eb5d3ae Mon Sep 17 00:00:00 2001 From: Josh <37798644+joshuaellis@users.noreply.github.com> Date: Thu, 27 Apr 2023 10:30:10 +0100 Subject: [PATCH 11/11] fix: AutoReload context value had incorrect names for object properties --- .../src/features/AutoReloadOverlayBlocker.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/core/helper-plugin/src/features/AutoReloadOverlayBlocker.js b/packages/core/helper-plugin/src/features/AutoReloadOverlayBlocker.js index f440cb3ee4..249744dcf8 100644 --- a/packages/core/helper-plugin/src/features/AutoReloadOverlayBlocker.js +++ b/packages/core/helper-plugin/src/features/AutoReloadOverlayBlocker.js @@ -34,8 +34,8 @@ import pxToRem from '../utils/pxToRem'; /** * @preserve * @typedef {Object} AutoReloadOverlayBlockerContextValue - * @property {(config: AutoReloadOverlayBlockerConfig) => void} lockApp - * @property {() => void} unlockApp + * @property {(config: AutoReloadOverlayBlockerConfig) => void} lockAppWithAutoreload + * @property {() => void} unlockAppWithAutoreload */ /** @@ -111,8 +111,8 @@ const AutoReloadOverlayBlockerProvider = ({ children }) => { const autoReloadValue = React.useMemo( () => ({ - lockApp: lockAppWithAutoreload, - unlockApp: unlockAppWithAutoreload, + lockAppWithAutoreload, + unlockAppWithAutoreload, }), [lockAppWithAutoreload, unlockAppWithAutoreload] );