Editor: Use hooks instead of HoCs in 'PostSwitchToDraftButton' (WordP…

…ress#54695)
foosantos · Sep 21, 2023 · a4efbba · a4efbba
1 parent 8ab2a97
commit a4efbba
Showing 1 changed file with 15 additions and 30 deletions.
diff --git a/packages/editor/src/components/post-switch-to-draft-button/index.js b/packages/editor/src/components/post-switch-to-draft-button/index.js
@@ -6,23 +6,28 @@ import {
 	__experimentalConfirmDialog as ConfirmDialog,
 } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
-import { withSelect, withDispatch } from '@wordpress/data';
-import { compose } from '@wordpress/compose';
+import { useDispatch, useSelect } from '@wordpress/data';
 import { useState } from '@wordpress/element';
 
 /**
  * Internal dependencies
  */
 import { store as editorStore } from '../../store';
 
-function PostSwitchToDraftButton( {
-	isSaving,
-	isPublished,
-	isScheduled,
-	onClick,
-} ) {
+export default function PostSwitchToDraftButton() {
 	const [ showConfirmDialog, setShowConfirmDialog ] = useState( false );
 
+	const { editPost, savePost } = useDispatch( editorStore );
+	const { isSaving, isPublished, isScheduled } = useSelect( ( select ) => {
+		const { isSavingPost, isCurrentPostPublished, isCurrentPostScheduled } =
+			select( editorStore );
+		return {
+			isSaving: isSavingPost(),
+			isPublished: isCurrentPostPublished(),
+			isScheduled: isCurrentPostScheduled(),
+		};
+	}, [] );
+
 	if ( ! isPublished && ! isScheduled ) {
 		return null;
 	}
@@ -36,7 +41,8 @@ function PostSwitchToDraftButton( {
 
 	const handleConfirm = () => {
 		setShowConfirmDialog( false );
-		onClick();
+		editPost( { status: 'draft' } );
+		savePost();
 	};
 
 	return (
@@ -62,24 +68,3 @@ function PostSwitchToDraftButton( {
 		</>
 	);
 }
-
-export default compose( [
-	withSelect( ( select ) => {
-		const { isSavingPost, isCurrentPostPublished, isCurrentPostScheduled } =
-			select( editorStore );
-		return {
-			isSaving: isSavingPost(),
-			isPublished: isCurrentPostPublished(),
-			isScheduled: isCurrentPostScheduled(),
-		};
-	} ),
-	withDispatch( ( dispatch ) => {
-		const { editPost, savePost } = dispatch( editorStore );
-		return {
-			onClick: () => {
-				editPost( { status: 'draft' } );
-				savePost();
-			},
-		};
-	} ),
-] )( PostSwitchToDraftButton );