delete via entity delete

WordPress · May 22, 2020 · dcb6b9e · dcb6b9e
1 parent bcd4a59
commit dcb6b9e
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 30 deletions.
diff --git a/packages/edit-navigation/src/components/delete-menu-button/index.js b/packages/edit-navigation/src/components/delete-menu-button/index.js
@@ -1,29 +1,18 @@
 /**
  * WordPress dependencies
  */
-import apiFetch from '@wordpress/api-fetch';
 import { Button } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 
-export default function DeleteMenuButton( { menuId, onDelete } ) {
-	const deleteMenu = async ( recordId ) => {
-		const path = `/__experimental/menus/${ recordId }?force=true`;
-		const deletedRecord = await apiFetch( {
-			path,
-			method: 'DELETE',
-		} );
-		return deletedRecord.previous;
-	};
-
+export default function DeleteMenuButton( { onDelete } ) {
 	const askToDelete = async () => {
 		if (
 			// eslint-disable-next-line no-alert
 			window.confirm(
 				__( 'Are you sure you want to delete this navigation?' )
 			)
 		) {
-			const deletedMenu = await deleteMenu( menuId );
-			onDelete( deletedMenu.id );
+			onDelete();
 		}
 	};
 

diff --git a/packages/edit-navigation/src/components/menus-editor/index.js b/packages/edit-navigation/src/components/menus-editor/index.js
@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-import { useSelect } from '@wordpress/data';
+import { useSelect, useDispatch } from '@wordpress/data';
 import { useState, useEffect } from '@wordpress/element';
 import {
 	Button,
@@ -31,20 +31,19 @@ export default function MenusEditor( { blockEditorSettings } ) {
 		false
 	);
 
+	const { deleteMenu } = useDispatch( 'core' );
+
 	useEffect( () => {
 		if ( ! hasCompletedFirstLoad && hasLoadedMenus ) {
 			setHasCompletedFirstLoad( true );
 		}
 	}, [ hasLoadedMenus ] );
 
 	const [ menuId, setMenuId ] = useState();
-	const [ stateMenus, setStateMenus ] = useState();
 	const [ showCreateMenuPanel, setShowCreateMenuPanel ] = useState( false );
 
 	useEffect( () => {
 		if ( menus?.length ) {
-			setStateMenus( menus );
-
 			// Only set menuId if it's currently unset.
 			if ( ! menuId ) {
 				setMenuId( menus[ 0 ].id );
@@ -56,7 +55,7 @@ export default function MenusEditor( { blockEditorSettings } ) {
 		return <Spinner />;
 	}
 
-	const hasMenus = !! stateMenus?.length;
+	const hasMenus = !! menus?.length;
 	const isCreateMenuPanelVisible =
 		hasCompletedFirstLoad && ( ! hasMenus || showCreateMenuPanel );
 
@@ -74,7 +73,7 @@ export default function MenusEditor( { blockEditorSettings } ) {
 							<SelectControl
 								className="edit-navigation-menus-editor__menu-select-control"
 								label={ __( 'Select navigation to edit:' ) }
-								options={ stateMenus?.map( ( menu ) => ( {
+								options={ menus?.map( ( menu ) => ( {
 									value: menu.id,
 									label: menu.name,
 								} ) ) }
@@ -95,7 +94,7 @@ export default function MenusEditor( { blockEditorSettings } ) {
 			</Card>
 			{ isCreateMenuPanelVisible && (
 				<CreateMenuPanel
-					menus={ stateMenus }
+					menus={ menus }
 					onCancel={
 						// User can only cancel out of menu creation if there
 						// are other menus to fall back to showing.
@@ -113,16 +112,8 @@ export default function MenusEditor( { blockEditorSettings } ) {
 				<MenuEditor
 					menuId={ menuId }
 					blockEditorSettings={ blockEditorSettings }
-					onDeleteMenu={ ( deletedMenu ) => {
-						const newStateMenus = stateMenus.filter( ( menu ) => {
-							return menu.id !== deletedMenu;
-						} );
-						setStateMenus( newStateMenus );
-						if ( newStateMenus.length ) {
-							setMenuId( newStateMenus[ 0 ].id );
-						} else {
-							setMenuId();
-						}
+					onDeleteMenu={ async () => {
+						await deleteMenu( menuId, '' );
 					} }
 				/>
 			) }