Fix: Moving a page to the trash on the site editor does not goes back…

… to the pages list (#65119)

co-authored-by: jorgefilipecosta <jorgefilipecosta@git.wordpress.org>
Co-authored-by: youknowriad <youknowriad@git.wordpress.org>
Co-authored-by: Mamaduka <mamaduka@git.wordpress.org>

packages/edit-post/src/components/browser-url/index.js

@@ -17,22 +17,6 @@ export function getPostEditURL( postId ) {
 	return addQueryArgs( 'post.php', { post: postId, action: 'edit' } );
 }
 
-/**
- * Returns the Post's Trashed URL.
- *
- * @param {number} postId   Post ID.
- * @param {string} postType Post Type.
- *
- * @return {string} Post trashed URL.
- */
-export function getPostTrashedURL( postId, postType ) {
-	return addQueryArgs( 'edit.php', {
-		trashed: 1,
-		post_type: postType,
-		ids: postId,
-	} );
-}
-
 export class BrowserURL extends Component {
 	constructor() {
 		super( ...arguments );
@@ -43,17 +27,9 @@ export class BrowserURL extends Component {
 	}
 
 	componentDidUpdate( prevProps ) {
-		const { postId, postStatus, postType, isSavingPost, hasHistory } =
-			this.props;
+		const { postId, postStatus, hasHistory } = this.props;
 		const { historyId } = this.state;
 
-		// Posts are still dirty while saving so wait for saving to finish
-		// to avoid the unsaved changes warning when trashing posts.
-		if ( postStatus === 'trash' && ! isSavingPost ) {
-			this.setTrashURL( postId, postType );
-			return;
-		}
-
 		if (
 			( postId !== prevProps.postId || postId !== historyId ) &&
 			postStatus !== 'auto-draft' &&
@@ -64,16 +40,6 @@ export class BrowserURL extends Component {
 		}
 	}
 
-	/**
-	 * Navigates the browser to the post trashed URL to show a notice about the trashed post.
-	 *
-	 * @param {number} postId   Post ID.
-	 * @param {string} postType Post Type.
-	 */
-	setTrashURL( postId, postType ) {
-		window.location.href = getPostTrashedURL( postId, postType );
-	}
-
 	/**
 	 * Replaces the browser URL with a post editor link for the given post ID.
 	 *
@@ -101,7 +67,7 @@ export class BrowserURL extends Component {
 }
 
 export default withSelect( ( select ) => {
-	const { getCurrentPost, isSavingPost } = select( editorStore );
+	const { getCurrentPost } = select( editorStore );
 	const post = getCurrentPost();
 	let { id, status, type } = post;
 	const isTemplate = [ 'wp_template', 'wp_template_part' ].includes( type );
@@ -112,7 +78,5 @@ export default withSelect( ( select ) => {
 	return {
 		postId: id,
 		postStatus: status,
-		postType: type,
-		isSavingPost: isSavingPost(),
 	};
 } )( BrowserURL );

packages/edit-post/src/components/browser-url/test/index.js

@@ -6,7 +6,7 @@ import { render } from '@testing-library/react';
 /**
  * Internal dependencies
  */
-import { getPostEditURL, getPostTrashedURL, BrowserURL } from '../';
+import { getPostEditURL, BrowserURL } from '../';
 
 describe( 'getPostEditURL', () => {
 	it( 'should generate relative path with post and action arguments', () => {
@@ -16,14 +16,6 @@ describe( 'getPostEditURL', () => {
 	} );
 } );
 
-describe( 'getPostTrashedURL', () => {
-	it( 'should generate relative path with post and action arguments', () => {
-		const url = getPostTrashedURL( 1, 'page' );
-
-		expect( url ).toBe( 'edit.php?trashed=1&post_type=page&ids=1' );
-	} );
-} );
-
 describe( 'BrowserURL', () => {
 	let replaceStateSpy;
 

packages/editor/README.md

@@ -1471,6 +1471,10 @@ Undocumented declaration.
 
 Displays the Post Trash Button and Confirm Dialog in the Editor.
 
+_Parameters_
+
+-   _An_ `?{onActionPerformed: Object}`: object containing the onActionPerformed function.
+
 _Returns_
 
 -   `JSX.Element|null`: The rendered PostTrash component.

packages/editor/src/components/post-trash/index.js

@@ -6,7 +6,7 @@ import {
 	Button,
 	__experimentalConfirmDialog as ConfirmDialog,
 } from '@wordpress/components';
-import { useSelect, useDispatch } from '@wordpress/data';
+import { useSelect, useDispatch, useRegistry } from '@wordpress/data';
 import { useState } from '@wordpress/element';
 
 /**
@@ -18,9 +18,11 @@ import PostTrashCheck from './check';
 /**
  * Displays the Post Trash Button and Confirm Dialog in the Editor.
  *
+ * @param {?{onActionPerformed: Object}} An object containing the onActionPerformed function.
  * @return {JSX.Element|null} The rendered PostTrash component.
  */
-export default function PostTrash() {
+export default function PostTrash( { onActionPerformed } ) {
+	const registry = useRegistry();
 	const { isNew, isDeleting, postId, title } = useSelect( ( select ) => {
 		const store = select( editorStore );
 		return {
@@ -37,11 +39,16 @@ export default function PostTrash() {
 		return null;
 	}
 
-	const handleConfirm = () => {
+	const handleConfirm = async () => {
 		setShowConfirmDialog( false );
-		trashPost();
+		await trashPost();
+		const item = await registry
+			.resolveSelect( editorStore )
+			.getCurrentPost();
+		// After the post is trashed, we want to trigger the onActionPerformed callback, so the user is redirect
+		// to the post view depending on if the user is on post editor or site editor.
+		onActionPerformed?.( 'move-to-trash', [ item ] );
 	};
-
 	return (
 		<PostTrashCheck>
 			<Button

packages/editor/src/components/sidebar/post-summary.js

@@ -88,7 +88,9 @@ export default function PostSummary( { onActionPerformed } ) {
 										<SiteDiscussion />
 										<PostFormatPanel />
 									</VStack>
-									<PostTrash />
+									<PostTrash
+										onActionPerformed={ onActionPerformed }
+									/>
 									{ fills }
 								</VStack>
 							) }