Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Close prepublish panel before creating new product (#45397) 

* Close prepublish panel before create new

* Add changelog

* Remove close fn from blockeditor

* Close panel after clicking outside

* Refactor useEffect

* Remove empty lines

* Replace mousedown with click event

* Replace click with mouseup
This commit is contained in:
Fernando Marichal 2024-03-11 09:10:36 -04:00 committed by GitHub
parent cb7e1c2eb5
commit fce3aeb90f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 26 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/js/product-editor/changelog/fix-45388_close_prepublish_panel_before_create_new Normal file
View File

@ -0,0 +1,4 @@
Significance: minor
Type: fix
Close prepublish panel before creating new product #45397

23
packages/js/product-editor/src/components/prepublish-panel/prepublish-panel.tsx
View File

@ -2,7 +2,7 @@
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { createElement, Fragment } from '@wordpress/element';
import { createElement, Fragment, useRef, useEffect } from '@wordpress/element';
import { Button } from '@wordpress/components';
import { useDispatch } from '@wordpress/data';
import { recordEvent } from '@woocommerce/tracks';
@ -55,6 +55,26 @@ export function PrepublishPanel( {
'woocommerce'
);
}
const panelRef = useRef< HTMLDivElement >( null );
function handleClickOutside( event: MouseEvent ) {
if (
panelRef.current &&
! panelRef.current.contains( event.target as Node )
) {
closePrepublishPanel();
}
}
useEffect( () => {
if ( ! isPublishedOrScheduled ) {
return;
}
document.addEventListener( 'mouseup', handleClickOutside );
return () => {
document.removeEventListener( 'mouseup', handleClickOutside );
};
}, [ isPublishedOrScheduled ] );
function getHeaderActions() {
if ( isPublishedOrScheduled ) {
@ -118,6 +138,7 @@ export function PrepublishPanel( {
return (
<div
ref={ panelRef }
className={ classnames( 'woocommerce-product-publish-panel', {
'is-published': isPublishedOrScheduled,
} ) }