From 73a03fbfc87df72fe631b15c13c7d583ae4c3669 Mon Sep 17 00:00:00 2001 From: ronronscelestes Date: Fri, 13 Aug 2021 12:38:21 +0200 Subject: [PATCH 01/14] integrated DS + deleteOne, updateOne --- .../src/pages/Webhooks/ListView/index.js | 243 ++++++++++++++---- 1 file changed, 187 insertions(+), 56 deletions(-) diff --git a/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js b/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js index f52fc13a5ed..f5f288a15a6 100644 --- a/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js +++ b/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js @@ -6,30 +6,43 @@ import React, { useEffect, useReducer, useRef, useState } from 'react'; import { useHistory, useLocation } from 'react-router-dom'; -import { Header, List } from '@buffetjs/custom'; -import { Button } from '@buffetjs/core'; import { Plus } from '@buffetjs/icons'; -import { omit } from 'lodash'; import { useIntl } from 'react-intl'; import { request, - ListButton, PopUpWarning, useRBAC, LoadingIndicatorPage, EmptyState, useNotification, } from '@strapi/helper-plugin'; -import adminPermissions from '../../../permissions'; -import PageTitle from '../../../components/SettingsPageTitle'; -import { ListRow } from '../../../components/Webhooks'; -import Wrapper from './Wrapper'; + +import { HeaderLayout, Layout, ContentLayout } from '@strapi/parts/Layout'; +import { Row } from '@strapi/parts/Row'; +import { Box } from '@strapi/parts/Box'; +import { IconButton } from '@strapi/parts/IconButton'; +import { BaseCheckbox } from '@strapi/parts/BaseCheckbox'; +import { Table, Thead, Tr, Th, Tbody, Td, TFooter } from '@strapi/parts/Table'; +import { Text, TableLabel } from '@strapi/parts/Text'; +import { Button } from '@strapi/parts/Button'; +import { VisuallyHidden } from '@strapi/parts/VisuallyHidden'; +import { Switch } from '@strapi/parts/Switch'; +import AddIcon from '@strapi/icons/AddIcon'; +import EditIcon from '@strapi/icons/EditIcon'; +import DeleteIcon from '@strapi/icons/DeleteIcon'; import reducer, { initialState } from './reducer'; +import PageTitle from '../../../components/SettingsPageTitle'; +import adminPermissions from '../../../permissions'; function ListView() { const { isLoading, - allowedActions: { canCreate, canRead, canUpdate, canDelete }, + allowedActions: { + canCreate, + canRead, + // canUpdate, + // canDelete, + }, } = useRBAC(adminPermissions.settings.webhooks); const toggleNotification = useNotification(); const isMounted = useRef(true); @@ -101,30 +114,30 @@ function ListView() { // List props const rowsCount = webhooks.length; - const titleLabel = `${ - rowsCount > 1 - ? formatMessage({ id: 'Settings.webhooks.title' }) - : formatMessage({ id: 'Settings.webhooks.singular' }) - }`; - const title = `${rowsCount} ${titleLabel}`; + // const titleLabel = `${ + // rowsCount > 1 + // ? formatMessage({ id: 'Settings.webhooks.title' }) + // : formatMessage({ id: 'Settings.webhooks.singular' }) + // }`; + // const title = `${rowsCount} ${titleLabel}`; /* eslint-disable indent */ - const deleteButtonProps = canDelete - ? { - color: 'delete', - disabled: !(webhooksToDelete.length > 0), - label: formatMessage({ id: 'app.utils.delete' }), - onClick: () => setShowModal(true), - type: 'button', - } - : null; + // const deleteButtonProps = canDelete + // ? { + // color: 'delete', + // disabled: !(webhooksToDelete.length > 0), + // label: formatMessage({ id: 'app.utils.delete' }), + // onClick: () => setShowModal(true), + // type: 'button', + // } + // : null; /* eslint-enable indent */ - const listProps = { - title, - button: deleteButtonProps, - items: webhooks, - }; + // const listProps = { + // title, + // button: deleteButtonProps, + // items: webhooks, + // }; const fetchData = async () => { try { @@ -151,6 +164,7 @@ function ListView() { }; const handleChange = (value, id) => { + // console.log(value, id); dispatch({ type: 'SET_WEBHOOKS_TO_DELETE', value, @@ -224,10 +238,10 @@ function ListView() { id, }); }; - + console.log(webhooks); const handleEnabledChange = async (value, id) => { + // console.log(!value) const webhookIndex = getWebhookIndex(id); - const initialWebhookProps = webhooks[webhookIndex]; const keys = [webhookIndex, 'isEnabled']; @@ -276,29 +290,106 @@ function ListView() { } return ( - + -
- {canRead && ( -
+ (canCreate ? handleGoTo('create') : {})} startIcon={}> + {headerProps.actions[0].label} + + )} + /> + + + <> {rowsCount > 0 ? ( - { - return ( - - ); - }} - /> + (canCreate ? handleGoTo('create') : {})} icon={}> + Add another field to this collection type + + )} + > + + + + + + + + + + + {webhooks.map(webhook => ( + + + + + + + + ))} + +
+ + + name + + url + + status + + actions +
+ handleChange(value, webhook.id)} + id={`Select ${webhook.id}`} + name={`Select ${webhook.name}`} + /> + + + {webhook.name} + + + {webhook.url} + + + handleEnabledChange(webhook.isEnabled, webhook.id)} + visibleLabels + /> + + + + { + handleGoTo(webhook.id); + }} + label="Edit" + icon={} + noBorder + /> + + { + handleDeleteClick(webhook.id); + }} + label="Delete" + icon={} + noBorder + /> + + +
) : ( )} - {canCreate &&
- )} + + setShowModal(!showModal)} popUpWarningType="danger" onConfirm={handleConfirmDelete} /> - + ); } export default ListView; + +// TO KEEP AS EXEMPLE UNTIL WE KNOW HOW TO DEAL WITH EVENTS AND FUNCTIONS DEFINED IN THIS COMPONENT + +// {canRead && ( +// <> +// {rowsCount > 0 ? +// ( +// { +// return ( +// +// ); +// }} +// /> +// ) : ( +// +// )} +// {canCreate && )} /> @@ -317,7 +274,14 @@ function ListView() { - + 0 && webhooksToDelete.length < webhooks.length + } + value={webhooksToDelete.length === webhooks.length} + onValueChange={value => handleCheckboxChange('main', value)} + /> name @@ -325,7 +289,7 @@ function ListView() { url - + status @@ -339,7 +303,9 @@ function ListView() { handleChange(value, webhook.id)} + value={webhooksToDelete?.includes(webhook.id)} + onValueChange={value => + handleCheckboxChange('secondary', value, webhook.id)} id={`Select ${webhook.id}`} name={`Select ${webhook.name}`} /> @@ -359,31 +325,33 @@ function ListView() { offLabel="Not enabled" label={`${webhook.name} status`} selected={webhook.isEnabled} - onChange={() => handleEnabledChange(webhook.isEnabled, webhook.id)} + onChange={() => handleEnabledChange(!webhook.isEnabled, webhook.id)} visibleLabels /> - { - handleGoTo(webhook.id); - }} - label="Edit" - icon={} - noBorder - /> - + {canUpdate && ( { - handleDeleteClick(webhook.id); + handleGoTo(webhook.id); }} - label="Delete" - icon={} + label="Edit" + icon={} noBorder /> - + )} + {canDelete && ( + + handleDeleteClick(webhook.id)} + label="Delete" + icon={} + noBorder + /> + + )} @@ -391,11 +359,18 @@ function ListView() { ) : ( - } + content={formatMessage({ id: 'Settings.webhooks.list.empty.description' })} + action={( + + )} /> )} diff --git a/packages/core/admin/admin/src/translations/en.json b/packages/core/admin/admin/src/translations/en.json index 42ba98db5bf..05803971d11 100644 --- a/packages/core/admin/admin/src/translations/en.json +++ b/packages/core/admin/admin/src/translations/en.json @@ -161,7 +161,7 @@ "Settings.webhooks.key": "Key", "Settings.webhooks.list.button.add": "Add new webhook", "Settings.webhooks.list.description": "Get POST changes notifications.", - "Settings.webhooks.list.empty.description": "Add your first one to this list.", + "Settings.webhooks.list.empty.description": "Add your first webhook", "Settings.webhooks.list.empty.link": "See our documentation", "Settings.webhooks.list.empty.title": "There are no webhooks yet", "Settings.webhooks.singular": "webhook", diff --git a/packages/core/admin/package.json b/packages/core/admin/package.json index c560c8c6a9c..7e246dee02e 100644 --- a/packages/core/admin/package.json +++ b/packages/core/admin/package.json @@ -41,8 +41,8 @@ "@strapi/babel-plugin-switch-ee-ce": "1.0.0", "@strapi/helper-plugin": "3.6.6", "@strapi/utils": "3.6.6", - "@strapi/icons": "0.0.1-alpha.6", - "@strapi/parts": "0.0.1-alpha.6", + "@strapi/icons": "0.0.1-alpha.10", + "@strapi/parts": "0.0.1-alpha.10", "axios": "^0.21.1", "babel-loader": "8.2.2", "babel-plugin-styled-components": "1.12.0", diff --git a/yarn.lock b/yarn.lock index 222b1c3e210..80062c52b41 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1726,6 +1726,13 @@ gud "^1.0.0" warning "^4.0.3" +"@internationalized/number@^3.0.2": + version "3.0.2" + resolved "https://registry.yarnpkg.com/@internationalized/number/-/number-3.0.2.tgz#432574e868713d01acbdd206d358fd59da01bad1" + integrity sha512-HKgKYBl5cF85iqFG0Gei+YPivWlFhdhPbMhAcVMsP+X2LCmIG9BvGJZ9oN11SUWknnVAXuLSiIx2SDvwQcdhpg== + dependencies: + "@babel/runtime" "^7.6.2" + "@istanbuljs/load-nyc-config@^1.0.0": version "1.1.0" resolved "https://registry.yarnpkg.com/@istanbuljs/load-nyc-config/-/load-nyc-config-1.1.0.tgz#fd3db1d59ecf7cf121e80650bb86712f9b55eced" @@ -3490,16 +3497,17 @@ tslib "^2.0.0" upath "2.0.1" -"@strapi/icons@0.0.1-alpha.6": - version "0.0.1-alpha.6" - resolved "https://registry.yarnpkg.com/@strapi/icons/-/icons-0.0.1-alpha.6.tgz#d714c4f0f44d5a53b813989f0c890af62278ce1b" - integrity sha512-QB5ghVyTh+vWlFAbDMmZGS//0+mZLWnB0ejxZfHjvT/d3ByVDycxsugLpk+jwALmD7pPdcqK66+3vR9o97Pl1g== +"@strapi/icons@0.0.1-alpha.10": + version "0.0.1-alpha.10" + resolved "https://registry.yarnpkg.com/@strapi/icons/-/icons-0.0.1-alpha.10.tgz#ec7424718abeb2d6680c91c7ba666ffbaa7f43e8" + integrity sha512-VbMDJuYl6xwG6COOF6BheXy1JIboWpyO8QqqfhJoJBLcAGVrouUeUMp+YGOsyi9nnGtPZSs8TNdtMkHkstRHqA== -"@strapi/parts@0.0.1-alpha.6": - version "0.0.1-alpha.6" - resolved "https://registry.yarnpkg.com/@strapi/parts/-/parts-0.0.1-alpha.6.tgz#7259e26edb7b4195352713a73f23d54dfefc79c8" - integrity sha512-4RhcguoPf41tJ6TbrHrUffOMEmWIJGgT9dxgqy5aFLZFHXnO1x1463Sw5hVSqdT+D05SiJLcBCO3zY+NhpEsDQ== +"@strapi/parts@0.0.1-alpha.10": + version "0.0.1-alpha.10" + resolved "https://registry.yarnpkg.com/@strapi/parts/-/parts-0.0.1-alpha.10.tgz#dfed27fc2fb73423af896109b2e3280c5473260a" + integrity sha512-WosaWkioUDucF5R1LC5qP76hAs2abKuL3HaiCUgvIudomItMrPRxman2LPYjGzFfFXPKu6aJwNy5CXMx6owRpw== dependencies: + "@internationalized/number" "^3.0.2" compute-scroll-into-view "^1.0.17" prop-types "^15.7.2" From bb902a32cbe37c6adde9d6b3c3d4fba635a974d0 Mon Sep 17 00:00:00 2001 From: ronronscelestes Date: Mon, 16 Aug 2021 12:00:05 +0200 Subject: [PATCH 03/14] PR review fixes --- .../src/pages/Webhooks/ListView/index.js | 358 ++++++++---------- .../core/admin/admin/src/translations/en.json | 10 +- 2 files changed, 174 insertions(+), 194 deletions(-) diff --git a/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js b/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js index 8d99f67acfc..cd6fdb64269 100644 --- a/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js +++ b/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js @@ -18,7 +18,7 @@ import { import { HeaderLayout, Layout, ContentLayout } from '@strapi/parts/Layout'; import { EmptyStateLayout } from '@strapi/parts/EmptyStateLayout'; import { Row } from '@strapi/parts/Row'; -import { Box } from '@strapi/parts/Box'; +import { Stack } from '@strapi/parts/Stack'; import { IconButton } from '@strapi/parts/IconButton'; import { BaseCheckbox } from '@strapi/parts/BaseCheckbox'; import { Table, Thead, Tr, Th, Tbody, Td, TFooter } from '@strapi/parts/Table'; @@ -26,6 +26,8 @@ import { Text, TableLabel } from '@strapi/parts/Text'; import { Button } from '@strapi/parts/Button'; import { VisuallyHidden } from '@strapi/parts/VisuallyHidden'; import { Switch } from '@strapi/parts/Switch'; +import { Main } from '@strapi/parts/Main'; +// import { Link } from '@strapi/parts/Link'; import AddIcon from '@strapi/icons/AddIcon'; import EditIcon from '@strapi/icons/EditIcon'; import DeleteIcon from '@strapi/icons/DeleteIcon'; @@ -67,15 +69,6 @@ function ListView() { // eslint-disable-next-line react-hooks/exhaustive-deps }, [canRead]); - const headerProps = { - title: { - label: formatMessage({ id: 'Settings.webhooks.title' }), - }, - content: formatMessage({ id: 'Settings.webhooks.list.description' }), - addBtnLabel: formatMessage({ id: 'Settings.webhooks.list.button.add' }), - deleteBtmLabel: formatMessage({ id: 'app.utils.delete' }), - }; - const fetchData = async () => { try { const { data } = await request('/admin/webhooks', { @@ -208,36 +201,36 @@ function ListView() { } }; - const handleCheckboxChange = (checkbox, value, id) => { - if (checkbox === 'secondary') { - dispatch({ - type: 'SET_WEBHOOKS_TO_DELETE', - value, - id, + const handleSelectAllCheckbox = () => { + const webhooksIds = webhooks.map(webhook => webhook.id); + + if (webhooksToDelete.length === 0) { + webhooksIds.forEach(webhookId => { + dispatch({ + type: 'SET_WEBHOOKS_TO_DELETE', + value: true, + id: webhookId, + }); }); } else { - const webhooksIds = webhooks.map(webhook => webhook.id); - - if (webhooksToDelete.length === 0) { - for (let i = 0; i < webhooksIds.length; i++) { - dispatch({ - type: 'SET_WEBHOOKS_TO_DELETE', - value: true, - id: webhooksIds[i], - }); - } - } else { - for (let i = 0; i < webhooksIds.length; i++) { - dispatch({ - type: 'SET_WEBHOOKS_TO_DELETE', - value: false, - id: webhooksIds[i], - }); - } - } + webhooksIds.forEach(webhookId => { + dispatch({ + type: 'SET_WEBHOOKS_TO_DELETE', + value: false, + id: webhookId, + }); + }); } }; + const handleSelectOneCheckbox = (value, id) => { + dispatch({ + type: 'SET_WEBHOOKS_TO_DELETE', + value, + id, + }); + }; + const handleGoTo = to => { push(`${pathname}/${to}`); }; @@ -249,132 +242,152 @@ function ListView() { return ( - (canCreate ? handleGoTo('create') : {})} startIcon={}> - {headerProps.addBtnLabel} - - )} - /> - - - <> - {rowsCount > 0 ? ( - (canCreate ? handleGoTo('create') : {})} icon={}> - Add another field to this collection type - - )} - > - - - - - - - - - - - {webhooks.map(webhook => ( - - + + ))} + +
- 0 && webhooksToDelete.length < webhooks.length - } - value={webhooksToDelete.length === webhooks.length} - onValueChange={value => handleCheckboxChange('main', value)} - /> - - name - - url - - status - - actions -
+
+ (canCreate ? handleGoTo('create') : {})} startIcon={}> + {formatMessage({ id: 'Settings.webhooks.list.button.add' })} + + )} + /> + + + <> + {rowsCount > 0 ? ( + (canCreate ? handleGoTo('create') : {})} + icon={} + > + {formatMessage({ id: 'Settings.webhooks.list.field.add' })} + + )} + > + + + - - + + + + + + + {webhooks.map(webhook => ( + + - + + + + - - ))} - -
- handleCheckboxChange('secondary', value, webhook.id)} - id={`Select ${webhook.id}`} - name={`Select ${webhook.name}`} + aria-label={formatMessage({ + id: 'Settings.webhooks.list.all-entries.select', + })} + indeterminate={ + webhooksToDelete.length > 0 && webhooksToDelete.length < webhooks.length + } + value={webhooksToDelete.length === webhooks.length} + onValueChange={handleSelectAllCheckbox} /> - - - - {webhook.name} - - - {webhook.url} - - - handleEnabledChange(!webhook.isEnabled, webhook.id)} - visibleLabels + + + + {formatMessage({ id: 'Settings.webhooks.form.name' })} + + + {formatMessage({ id: 'Settings.webhooks.form.url' })} + + + {formatMessage({ id: 'Settings.webhooks.list.th.status' })} + + + + {formatMessage({ id: 'Settings.webhooks.list.th.actions' })} + +
+ handleSelectOneCheckbox(value, webhook.id)} + id={`${formatMessage({ id: 'Settings.webhooks.list.select' })} ${ + webhook.id + }`} + name={`${formatMessage({ id: 'Settings.webhooks.list.select' })} ${ + webhook.name + }`} /> - - - - {canUpdate && ( - { - handleGoTo(webhook.id); - }} - label="Edit" - icon={} - noBorder + + + {webhook.name} + + + {webhook.url} + + + handleEnabledChange(!webhook.isEnabled, webhook.id)} + visibleLabels /> - )} - {canDelete && ( - + + + + {canUpdate && ( + { + handleGoTo(webhook.id); + }} + label={formatMessage({ id: 'Settings.webhooks.events.update' })} + icon={} + noBorder + /> + )} + {canDelete && ( handleDeleteClick(webhook.id)} - label="Delete" + label={formatMessage({ id: 'Settings.webhooks.events.delete' })} icon={} noBorder /> - - )} - -
- ) : ( - } - content={formatMessage({ id: 'Settings.webhooks.list.empty.description' })} - action={( - - )} - /> - )} - - + )} + +
+ ) : ( + } + content={formatMessage({ id: 'Settings.webhooks.list.empty.description' })} + action={( + + )} + /> + )} + + + setShowModal(!showModal)} @@ -386,44 +399,3 @@ function ListView() { } export default ListView; - -// TO KEEP AS EXEMPLE UNTIL WE KNOW HOW TO DEAL WITH EVENTS AND FUNCTIONS DEFINED IN THIS COMPONENT - -// {canRead && ( -// <> -// {rowsCount > 0 ? -// ( -// { -// return ( -// -// ); -// }} -// /> -// ) : ( -// -// )} -// {canCreate && + } + /> )} - /> - )} + + - + )} Date: Tue, 17 Aug 2021 14:58:05 +0200 Subject: [PATCH 10/14] added 1 to rowsCount in Table to able focus on last row --- .../core/admin/admin/src/pages/Webhooks/ListView/index.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js b/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js index 897c440a715..b5988eb0fe4 100644 --- a/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js +++ b/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js @@ -13,7 +13,7 @@ import { useRBAC, LoadingIndicatorPage, useNotification, - useFocusWhenNavigate + useFocusWhenNavigate, } from '@strapi/helper-plugin'; import { HeaderLayout, Layout, ContentLayout } from '@strapi/parts/Layout'; @@ -36,7 +36,6 @@ import reducer, { initialState } from './reducer'; import PageTitle from '../../../components/SettingsPageTitle'; import adminPermissions from '../../../permissions'; - function ListView() { const { isLoading, @@ -249,7 +248,7 @@ function ListView() { {rowsCount > 0 ? ( (canCreate ? handleGoTo('create') : {})} From 6a609ccc0bcf05e3742e43cbab57098b45267da7 Mon Sep 17 00:00:00 2001 From: ronronscelestes Date: Wed, 18 Aug 2021 11:49:29 +0200 Subject: [PATCH 11/14] changed enabled - disabled format message --- .../core/admin/admin/src/pages/Webhooks/ListView/index.js | 4 ++-- packages/core/admin/admin/src/translations/en.json | 2 -- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js b/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js index b5988eb0fe4..2291606feff 100644 --- a/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js +++ b/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js @@ -319,9 +319,9 @@ function ListView() {
Date: Wed, 18 Aug 2021 14:28:06 +0200 Subject: [PATCH 12/14] loading state updated --- .../src/pages/Webhooks/ListView/index.js | 55 ++++++++++--------- .../src/pages/Webhooks/ListView/reducer.js | 7 +++ 2 files changed, 36 insertions(+), 26 deletions(-) diff --git a/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js b/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js index 2291606feff..a6381b114ec 100644 --- a/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js +++ b/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js @@ -45,11 +45,12 @@ function ListView() { const isMounted = useRef(true); const { formatMessage } = useIntl(); const [showModal, setShowModal] = useState(false); - const [{ webhooks, webhooksToDelete, webhookToDelete }, dispatch] = useReducer( + const [{ webhooks, webhooksToDelete, webhookToDelete, loadingWebhooks }, dispatch] = useReducer( reducer, initialState ); - useFocusWhenNavigate('main', [isLoading]); + + useFocusWhenNavigate(); const { push } = useHistory(); const { pathname } = useLocation(); const rowsCount = webhooks.length; @@ -65,12 +66,12 @@ function ListView() { useEffect(() => { if (canRead) { - fetchData(); + fetchWebHooks(); } // eslint-disable-next-line react-hooks/exhaustive-deps }, [canRead]); - const fetchData = async () => { + const fetchWebHooks = async () => { try { const { data } = await request('/admin/webhooks', { method: 'GET', @@ -90,6 +91,9 @@ function ListView() { message: { id: 'notification.error' }, }); } + dispatch({ + type: 'TOGGLE_LOADING', + }); } } }; @@ -223,26 +227,25 @@ function ListView() { return ( -
- {isLoading ? ( - - ) : ( - <> - (canCreate ? handleGoTo('create') : {})} - startIcon={} - > - {formatMessage({ id: 'Settings.webhooks.list.button.add' })} - - } - /> - +
+ <> + (canCreate ? handleGoTo('create') : {})} + startIcon={} + > + {formatMessage({ id: 'Settings.webhooks.list.button.add' })} + + } + /> + {isLoading || loadingWebhooks ? ( + + ) : ( <> {rowsCount > 0 ? ( @@ -375,8 +378,8 @@ function ListView() { )} - - )} + )} +
@@ -13,6 +14,12 @@ const reducer = (state, action) => switch (action.type) { case 'GET_DATA_SUCCEEDED': { draftState.webhooks = action.data; + draftState.loadingWebhooks = false; + break; + } + + case 'TOGGLE_LOADING': { + draftState.loadingWebhooks = !state.loadingWebhooks; break; } From 52422440f0b5049eca444b477d58c764bb143f73 Mon Sep 17 00:00:00 2001 From: ronronscelestes Date: Thu, 19 Aug 2021 12:00:53 +0200 Subject: [PATCH 13/14] updated to parts alpha 15 + LinkButton --- .../admin/src/pages/Webhooks/ListView/index.js | 9 ++++++--- packages/core/admin/package.json | 4 ++-- yarn.lock | 18 +++++++++--------- 3 files changed, 17 insertions(+), 14 deletions(-) diff --git a/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js b/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js index a6381b114ec..7080ebf2990 100644 --- a/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js +++ b/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js @@ -28,6 +28,7 @@ import { Button } from '@strapi/parts/Button'; import { VisuallyHidden } from '@strapi/parts/VisuallyHidden'; import { Switch } from '@strapi/parts/Switch'; import { Main } from '@strapi/parts/Main'; +import { LinkButton } from '@strapi/parts/LinkButton'; import AddIcon from '@strapi/icons/AddIcon'; import EditIcon from '@strapi/icons/EditIcon'; import DeleteIcon from '@strapi/icons/DeleteIcon'; @@ -235,12 +236,14 @@ function ListView() { title={formatMessage({ id: 'Settings.webhooks.title' })} subtitle={formatMessage({ id: 'Settings.webhooks.list.description' })} primaryAction={ - + } /> {isLoading || loadingWebhooks ? ( diff --git a/packages/core/admin/package.json b/packages/core/admin/package.json index 279a7fe71ec..e44c7b59f87 100644 --- a/packages/core/admin/package.json +++ b/packages/core/admin/package.json @@ -41,8 +41,8 @@ "@strapi/babel-plugin-switch-ee-ce": "1.0.0", "@strapi/helper-plugin": "3.6.6", "@strapi/utils": "3.6.6", - "@strapi/icons": "0.0.1-alpha.11", - "@strapi/parts": "0.0.1-alpha.11", + "@strapi/icons": "0.0.1-alpha.15", + "@strapi/parts": "0.0.1-alpha.15", "axios": "^0.21.1", "babel-loader": "8.2.2", "babel-plugin-styled-components": "1.12.0", diff --git a/yarn.lock b/yarn.lock index 57d824f8d11..3dd0ed0a247 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3497,15 +3497,15 @@ tslib "^2.0.0" upath "2.0.1" -"@strapi/icons@0.0.1-alpha.11": - version "0.0.1-alpha.11" - resolved "https://registry.yarnpkg.com/@strapi/icons/-/icons-0.0.1-alpha.11.tgz#a92b27f8f3fd6081249c07c6acc6e4aefe38bd68" - integrity sha512-BTl/2bGzCaVqhwj/vcmicL4Ya19J6NZ4A3O8MDDogoRwaDfHceLT1RpzKsID4x4kfXasopbNST1GzrJ2pvz9mw== - -"@strapi/parts@0.0.1-alpha.11": - version "0.0.1-alpha.11" - resolved "https://registry.yarnpkg.com/@strapi/parts/-/parts-0.0.1-alpha.11.tgz#ad42d40d979cabe73df4815faf2c65629a9b497d" - integrity sha512-tyPPZm0QIPh/hSMvtei0hum2S2XM3WmFALOXNGI8rSOyGLYnRzWf+phlyUNOYYuyxwEeNIR3vU+w3n7xpRpXiQ== +"@strapi/icons@0.0.1-alpha.15": + version "0.0.1-alpha.15" + resolved "https://registry.yarnpkg.com/@strapi/icons/-/icons-0.0.1-alpha.15.tgz#32fc824b732b4a21d5282f84696d6207ac5cbea1" + integrity sha512-FIczXDSEBPXTfptgqR6Hjh65Fpf4XF+kEm3o53PQX8G0GZ0Udpcbspqf2Kieeocg8TePgRkTI/oU6KS1aJbXrg== + +"@strapi/parts@0.0.1-alpha.15": + version "0.0.1-alpha.15" + resolved "https://registry.yarnpkg.com/@strapi/parts/-/parts-0.0.1-alpha.15.tgz#250cc29be0fa4cc2b91c8c0be49e1c2070a25450" + integrity sha512-VF4gp6xrowpnHBe3qJf0BHljZEXT8Y+oMk7XbW9HJ6w7Fxrm6SmmBfGb3LGFLxkzMj+5Log7FXD+ANER298r+A== dependencies: "@internationalized/number" "^3.0.2" compute-scroll-into-view "^1.0.17" From 9e5ff42af2fc9c4e4acc001e4d38a2a485910404 Mon Sep 17 00:00:00 2001 From: ronronscelestes Date: Thu, 19 Aug 2021 15:04:01 +0200 Subject: [PATCH 14/14] add webhook link button if canCreate + notifyStatus --- .../admin/src/pages/Webhooks/ListView/index.js | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js b/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js index 7080ebf2990..b5d06590bc2 100644 --- a/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js +++ b/packages/core/admin/admin/src/pages/Webhooks/ListView/index.js @@ -29,6 +29,7 @@ import { VisuallyHidden } from '@strapi/parts/VisuallyHidden'; import { Switch } from '@strapi/parts/Switch'; import { Main } from '@strapi/parts/Main'; import { LinkButton } from '@strapi/parts/LinkButton'; +import { notifyStatus } from '@strapi/parts/LiveRegions'; import AddIcon from '@strapi/icons/AddIcon'; import EditIcon from '@strapi/icons/EditIcon'; import DeleteIcon from '@strapi/icons/DeleteIcon'; @@ -83,6 +84,7 @@ function ListView() { type: 'GET_DATA_SUCCEEDED', data, }); + notifyStatus('webhooks have been loaded'); } } catch (err) { if (isMounted.current) { @@ -236,14 +238,12 @@ function ListView() { title={formatMessage({ id: 'Settings.webhooks.title' })} subtitle={formatMessage({ id: 'Settings.webhooks.list.description' })} primaryAction={ - } - variant="default" - to={`${pathname }/create`} - > - {formatMessage({ id: 'Settings.webhooks.list.button.add' })} - + canCreate && + !loadingWebhooks && ( + } variant="default" to={`${pathname}/create`}> + {formatMessage({ id: 'Settings.webhooks.list.button.add' })} + + ) } /> {isLoading || loadingWebhooks ? (