Update Move to Trash button component on Automation statistics page

MAILPOET-5700
This commit is contained in:
Oluwaseun Olorunsola
2023-12-04 11:31:08 +01:00
committed by Aschepikov
parent 18810d2916
commit aebc17939c
2 changed files with 14 additions and 5 deletions

View File

@@ -7,8 +7,11 @@ import { useDispatch, useSelect } from '@wordpress/data';
import { __, sprintf } from '@wordpress/i18n'; import { __, sprintf } from '@wordpress/i18n';
import { storeName } from '../../store'; import { storeName } from '../../store';
export function TrashButton(): JSX.Element { export function TrashButton({
performActionAfterDelete = () => {},
}): JSX.Element {
const [showConfirmDialog, setShowConfirmDialog] = useState(false); const [showConfirmDialog, setShowConfirmDialog] = useState(false);
const [isBusy, setIsBusy] = useState(false);
const { automation } = useSelect( const { automation } = useSelect(
(select) => ({ (select) => ({
automation: select(storeName).getAutomationData(), automation: select(storeName).getAutomationData(),
@@ -24,8 +27,11 @@ export function TrashButton(): JSX.Element {
title={__('Delete automation', 'mailpoet')} title={__('Delete automation', 'mailpoet')}
confirmButtonText={__('Yes, delete', 'mailpoet')} confirmButtonText={__('Yes, delete', 'mailpoet')}
onConfirm={async () => { onConfirm={async () => {
setIsBusy(true);
trash(() => { trash(() => {
setShowConfirmDialog(false); setShowConfirmDialog(false);
setIsBusy(false);
performActionAfterDelete();
}); });
}} }}
onCancel={() => setShowConfirmDialog(false)} onCancel={() => setShowConfirmDialog(false)}
@@ -40,6 +46,7 @@ export function TrashButton(): JSX.Element {
</ConfirmDialog> </ConfirmDialog>
<Button <Button
isBusy={isBusy}
variant="secondary" variant="secondary"
isDestructive isDestructive
onClick={() => setShowConfirmDialog(true)} onClick={() => setShowConfirmDialog(true)}

View File

@@ -3,7 +3,6 @@ import {
ButtonGroup, ButtonGroup,
Dropdown, Dropdown,
MenuGroup, MenuGroup,
MenuItem,
} from '@wordpress/components'; } from '@wordpress/components';
import { __ } from '@wordpress/i18n'; import { __ } from '@wordpress/i18n';
import { addQueryArgs } from '@wordpress/url'; import { addQueryArgs } from '@wordpress/url';
@@ -18,6 +17,7 @@ import {
DeactivateButton, DeactivateButton,
DeactivateNowButton, DeactivateNowButton,
} from '../../../../../editor/components/header'; } from '../../../../../editor/components/header';
import { TrashButton } from '../../../../../editor/components/actions/trash-button';
export function Header(): JSX.Element { export function Header(): JSX.Element {
const { automation } = useSelect((s) => ({ const { automation } = useSelect((s) => ({
@@ -57,9 +57,11 @@ export function Header(): JSX.Element {
<ActivateButton label={__('Update & Activate', 'mailpoet')} /> <ActivateButton label={__('Update & Activate', 'mailpoet')} />
</> </>
)} )}
<MenuItem isDestructive onClick={() => {}}> <TrashButton
{__('Move to Trash', 'mailpoet')} performActionAfterDelete={() => {
</MenuItem> window.location.href = MailPoet.urls.automationListing;
}}
/>
</MenuGroup> </MenuGroup>
)} )}
/> />