diff --git a/packages/core/admin/admin/src/pages/SettingsPage/pages/Webhooks/EditView/components/Events/index.js b/packages/core/admin/admin/src/pages/SettingsPage/pages/Webhooks/EditView/components/Events/index.js index 21c3d41c17..2f9c4d2322 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/pages/Webhooks/EditView/components/Events/index.js +++ b/packages/core/admin/admin/src/pages/SettingsPage/pages/Webhooks/EditView/components/Events/index.js @@ -4,7 +4,14 @@ import PropTypes from 'prop-types'; import { useFormikContext } from 'formik'; import { useIntl } from 'react-intl'; import styled from 'styled-components'; -import { FieldLabel, Flex, Typography, BaseCheckbox, Checkbox } from '@strapi/design-system'; +import { + FieldLabel, + Flex, + Typography, + BaseCheckbox, + Checkbox, + Loader, +} from '@strapi/design-system'; import { useModels } from '../../../../../../../hooks'; @@ -38,40 +45,34 @@ const StyledTable = styled.table` `; const getCEHeaders = (isDraftAndPublish) => { - if (isDraftAndPublish) { - return [ - { id: 'Settings.webhooks.events.create', defaultMessage: 'Create' }, - { id: 'Settings.webhooks.events.update', defaultMessage: 'Update' }, - { id: 'app.utils.delete', defaultMessage: 'Delete' }, - { id: 'app.utils.publish', defaultMessage: 'Publish' }, - { id: 'app.utils.unpublish', defaultMessage: 'Unpublish' }, - ]; - } - - return [ + const headers = [ { id: 'Settings.webhooks.events.create', defaultMessage: 'Create' }, { id: 'Settings.webhooks.events.update', defaultMessage: 'Update' }, { id: 'app.utils.delete', defaultMessage: 'Delete' }, ]; + if (isDraftAndPublish) { + headers.push({ id: 'app.utils.publish', defaultMessage: 'Publish' }); + headers.push({ id: 'app.utils.unpublish', defaultMessage: 'Unpublish' }); + } + + return headers; }; const getCEEvents = (isDraftAndPublish) => { + const entryEvents = ['entry.create', 'entry.update', 'entry.delete']; if (isDraftAndPublish) { - return { - entry: ['entry.create', 'entry.update', 'entry.delete', 'entry.publish', 'entry.unpublish'], - media: ['media.create', 'media.update', 'media.delete'], - }; + entryEvents.push('entry.publish', 'entry.unpublish'); } return { - entry: ['entry.create', 'entry.update', 'entry.delete'], + entry: entryEvents, media: ['media.create', 'media.update', 'media.delete'], }; }; const Root = ({ children }) => { const { formatMessage } = useIntl(); - const { collectionTypes } = useModels(); + const { collectionTypes, isLoading } = useModels(); const isDraftAndPublish = React.useMemo( () => collectionTypes.some((ct) => ct.options.draftAndPublish === true), @@ -94,6 +95,14 @@ const Root = ({ children }) => { defaultMessage: 'Events', })} + {isLoading && ( + + {formatMessage({ + id: 'Settings.webhooks.events.isLoading', + defaultMessage: 'Events loading', + })} + + )} {childrenWithProps} ); @@ -230,6 +239,7 @@ const removeHyphensAndTitleCase = (str) => .join(' '); const EventRow = ({ disabledEvents, name, events, inputValue, handleChange, handleChangeAll }) => { + const { formatMessage } = useIntl(); const enabledCheckboxes = events.filter((event) => !disabledEvents.includes(event)); const hasSomeCheckboxSelected = inputValue.length > 0; @@ -250,7 +260,10 @@ const EventRow = ({ disabledEvents, name, events, inputValue, handleChange, hand { name="headers" render={({ push, remove }) => ( - {values.headers?.map((header, index) => ( + {values.headers.map((header, index) => ( { error={ errors.headers?.[index]?.key && formatMessage({ - id: errors.headers[index]?.key, - defaultMessage: errors.headers[index]?.key, + id: errors.headers[index].key, + defaultMessage: errors.headers[index].key, }) } /> @@ -66,8 +66,8 @@ const HeadersInput = () => { error={ errors.headers?.[index]?.value && formatMessage({ - id: errors.headers[index]?.value, - defaultMessage: errors.headers[index]?.value, + id: errors.headers[index].value, + defaultMessage: errors.headers[index].value, }) } /> diff --git a/packages/core/admin/admin/src/pages/SettingsPage/pages/Webhooks/EditView/components/WebhookForm/index.js b/packages/core/admin/admin/src/pages/SettingsPage/pages/Webhooks/EditView/components/WebhookForm/index.js index c03c84a3a4..b7892bc3b8 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/pages/Webhooks/EditView/components/WebhookForm/index.js +++ b/packages/core/admin/admin/src/pages/SettingsPage/pages/Webhooks/EditView/components/WebhookForm/index.js @@ -104,13 +104,11 @@ const WebhookForm = ({ - setShowTriggerResponse(false)} - /> - + setShowTriggerResponse(false)} + /> ) } > diff --git a/packages/core/admin/admin/src/pages/SettingsPage/pages/Webhooks/EditView/index.js b/packages/core/admin/admin/src/pages/SettingsPage/pages/Webhooks/EditView/index.js index a684fd129b..74ecc62cdf 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/pages/Webhooks/EditView/index.js +++ b/packages/core/admin/admin/src/pages/SettingsPage/pages/Webhooks/EditView/index.js @@ -15,16 +15,10 @@ import WebhookForm from './components/WebhookForm'; const cleanData = (data) => ({ ...data, - headers: data.headers.reduce((acc, current) => { - const { key, value } = current; - + headers: data.headers.reduce((acc, { key, value }) => { if (key !== '') { - return { - ...acc, - [key]: value, - }; + acc[key] = value; } - return acc; }, {}), }); diff --git a/packages/core/admin/admin/src/translations/en.json b/packages/core/admin/admin/src/translations/en.json index 67c6e24c60..df9b81811a 100644 --- a/packages/core/admin/admin/src/translations/en.json +++ b/packages/core/admin/admin/src/translations/en.json @@ -285,6 +285,7 @@ "Settings.webhooks.create.header": "Create new header", "Settings.webhooks.created": "Webhook created", "Settings.webhooks.event.publish-tooltip": "This event only exists for contents with Draft/Publish system enabled", + "Settings.webhooks.events.isLoading": "Events loading", "Settings.webhooks.events.create": "Create", "Settings.webhooks.events.update": "Update", "Settings.webhooks.form.events": "Events",