diff --git a/packages/strapi-admin/admin/src/containers/Webhooks/EditView/Wrapper.js b/packages/strapi-admin/admin/src/containers/Webhooks/EditView/Wrapper.js new file mode 100644 index 0000000000..20342fd131 --- /dev/null +++ b/packages/strapi-admin/admin/src/containers/Webhooks/EditView/Wrapper.js @@ -0,0 +1,11 @@ +/** + * + * Wrapper + * + */ + +import styled from 'styled-components'; + +const Wrapper = styled.div``; + +export default Wrapper; diff --git a/packages/strapi-admin/admin/src/containers/Webhooks/EditView/index.js b/packages/strapi-admin/admin/src/containers/Webhooks/EditView/index.js index 0ff5f377e0..05fcb0d8fc 100644 --- a/packages/strapi-admin/admin/src/containers/Webhooks/EditView/index.js +++ b/packages/strapi-admin/admin/src/containers/Webhooks/EditView/index.js @@ -4,13 +4,114 @@ * */ -import React from 'react'; +import React, { useEffect, useReducer } from 'react'; +import { useLocation } from 'react-router-dom'; +import { isEmpty, difference } from 'lodash'; +import { Header } from '@buffetjs/custom'; +import { request, useGlobalContext } from 'strapi-helper-plugin'; + +import Wrapper from './Wrapper'; + +import reducer, { initialState } from './reducer'; function EditView() { + const { formatMessage } = useGlobalContext(); + const [reducerState, dispatch] = useReducer(reducer, initialState); + const location = useLocation(); + + const { modifiedWebhook, initialWebhook } = reducerState.toJS(); + + const { name } = modifiedWebhook; + + const id = location.pathname.split('/')[3]; + const isCreatingWebhook = id === 'create'; + + useEffect(() => { + if (!isCreatingWebhook) { + fetchData(); + } + }, [fetchData, isCreatingWebhook]); + + const fetchData = async () => { + try { + const { data } = await request(`/admin/webhooks/${id}`, { + method: 'GET', + }); + + dispatch({ + type: 'GET_DATA_SUCCEEDED', + data, + }); + } catch (err) { + if (err.code !== 20) { + strapi.notification.error('notification.error'); + } + } + }; + + // Header props + const headerTitle = isCreatingWebhook + ? formatMessage({ + id: `Settings.webhooks.create`, + }) + : name; + + const actionsAreDisabled = isEmpty( + difference(initialWebhook, modifiedWebhook) + ); + + const actions = [ + { + onClick: () => {}, + color: 'primary', + disabled: actionsAreDisabled, + type: 'button', + title: formatMessage({ + id: `Settings.webhooks.trigger`, + }), + style: { + paddingRight: 15, + paddingLeft: 15, + }, + }, + { + onClick: () => {}, + color: 'cancel', + disabled: actionsAreDisabled, + type: 'button', + title: formatMessage({ + id: `app.components.Button.reset`, + }), + style: { + paddingRight: 20, + paddingLeft: 20, + }, + }, + { + onClick: () => {}, + color: 'success', + disabled: actionsAreDisabled, + type: 'submit', + title: formatMessage({ + id: `app.components.Button.save`, + }), + style: { + minWidth: 140, + }, + }, + ]; + const headerProps = { + title: { + label: headerTitle, + }, + actions: actions, + }; + return ( -
Edit
-