From 9c048483d2fcfbd011f50d40d570cd343a05cea1 Mon Sep 17 00:00:00 2001 From: NidhiDhandhukiya74 Date: Fri, 13 Dec 2024 16:20:06 +0530 Subject: [PATCH 1/5] refactor site logo media panel --- packages/block-library/src/site-logo/edit.js | 34 +++++++++++++++++--- 1 file changed, 30 insertions(+), 4 deletions(-) diff --git a/packages/block-library/src/site-logo/edit.js b/packages/block-library/src/site-logo/edit.js index 36c217c1bf0c79..813a71cc30ab5e 100644 --- a/packages/block-library/src/site-logo/edit.js +++ b/packages/block-library/src/site-logo/edit.js @@ -24,6 +24,8 @@ import { Button, DropZone, FlexItem, + __experimentalToolsPanel as ToolsPanel, + __experimentalToolsPanelItem as ToolsPanelItem, __experimentalItemGroup as ItemGroup, __experimentalHStack as HStack, __experimentalTruncate as Truncate, @@ -597,8 +599,20 @@ export default function LogoEdit( { const mediaInspectorPanel = ( canUserEdit || logoUrl ) && ( - -
+ { + setAttributes( { + logoUrl: null, + mediaItemData: null, + } ); + } } + > + !! logoUrl && ! canUserEdit } + label={ __( 'Preview Logo (Read-only)' ) } + resetAll={ () => setAttributes( { logoUrl: null } ) } + > { ! canUserEdit && !! logoUrl && ( ) } + + !! logoUrl && canUserEdit } + label={ __( 'Replace Logo' ) } + resetAll={ () => setAttributes( { logoUrl: null } ) } + > { canUserEdit && !! logoUrl && ( ) } + + ! logoUrl && canUserEdit } + label={ __( 'Upload Logo' ) } + resetAll={ () => setAttributes( { logoUrl: null } ) } + > { canUserEdit && ! logoUrl && ( ) } -
- + + ); From 2db9acadc435a9ca53842ffca6de34c6ed9d5e2d Mon Sep 17 00:00:00 2001 From: NidhiDhandhukiya74 Date: Fri, 20 Dec 2024 15:27:46 +0530 Subject: [PATCH 2/5] refractor site settings of site logo --- packages/block-library/src/site-logo/edit.js | 83 ++++++++++++++------ 1 file changed, 57 insertions(+), 26 deletions(-) diff --git a/packages/block-library/src/site-logo/edit.js b/packages/block-library/src/site-logo/edit.js index 813a71cc30ab5e..074235b5f5d64b 100644 --- a/packages/block-library/src/site-logo/edit.js +++ b/packages/block-library/src/site-logo/edit.js @@ -14,7 +14,6 @@ import { } from '@wordpress/element'; import { __, isRTL } from '@wordpress/i18n'; import { - PanelBody, RangeControl, ResizableBox, Spinner, @@ -280,31 +279,55 @@ const SiteLogo = ( { return ( <> - - + !! width } label={ __( 'Image width' ) } - onChange={ ( newWidth ) => - setAttributes( { width: newWidth } ) + onDeselect={ () => + setAttributes( { width: undefined } ) } - min={ minWidth } - max={ maxWidthBuffer } - initialPosition={ Math.min( - defaultWidth, - maxWidthBuffer - ) } - value={ width || '' } - disabled={ ! isResizable } - /> - + + setAttributes( { width: newWidth } ) + } + min={ minWidth } + max={ maxWidthBuffer } + initialPosition={ Math.min( + defaultWidth, + maxWidthBuffer + ) } + value={ width || '' } + disabled={ ! isResizable } + /> + + + !! isLink } label={ __( 'Link image to home' ) } - onChange={ () => setAttributes( { isLink: ! isLink } ) } - checked={ isLink } - /> + onDeselect={ () => setAttributes( { isLink: false } ) } + > + + setAttributes( { isLink: ! isLink } ) + } + checked={ isLink } + /> + + { isLink && ( - <> + linkTarget === '_blank' } + label={ __( 'Open in new tab' ) } + onDeselect={ () => + setAttributes( { linkTarget: '_self' } ) + } + > - + ) } + { canUserEdit && ( - <> + !! shouldSyncIcon } + label={ __( 'Use as Site Icon' ) } + onDeselect={ () => { + setAttributes( { shouldSyncIcon: false } ); + setIcon( undefined ); + } } + > - + ) } - + { canEditImage && ! isEditingImage && ( From 23fc7ff0409953f13cb25e2bda3f96f17f24a871 Mon Sep 17 00:00:00 2001 From: NidhiDhandhukiya74 Date: Sat, 8 Feb 2025 00:16:30 +0530 Subject: [PATCH 3/5] added shown by default to toolspanelitem and added dropdownMenuProps --- packages/block-library/src/site-logo/edit.js | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/packages/block-library/src/site-logo/edit.js b/packages/block-library/src/site-logo/edit.js index ed099b12500dab..317998a21ca5c0 100644 --- a/packages/block-library/src/site-logo/edit.js +++ b/packages/block-library/src/site-logo/edit.js @@ -23,6 +23,7 @@ import { Button, DropZone, FlexItem, + PanelBody, __experimentalToolsPanel as ToolsPanel, __experimentalToolsPanelItem as ToolsPanelItem, __experimentalItemGroup as ItemGroup, @@ -48,6 +49,7 @@ import { store as noticesStore } from '@wordpress/notices'; * Internal dependencies */ import { MIN_SIZE } from '../image/constants'; +import { useToolsPanelDropdownMenuProps } from '../utils/hooks'; const ALLOWED_MEDIA_TYPES = [ 'image' ]; const ACCEPT_MEDIA_STRING = 'image/*'; @@ -71,6 +73,7 @@ const SiteLogo = ( { const [ { naturalWidth, naturalHeight }, setNaturalSize ] = useState( {} ); const [ isEditingImage, setIsEditingImage ] = useState( false ); const { toggleSelection } = useDispatch( blockEditorStore ); + const dropdownMenuProps = useToolsPanelDropdownMenuProps(); const { imageEditing, maxWidth, title } = useSelect( ( select ) => { const settings = select( blockEditorStore ).getSettings(); const siteEntities = select( coreStore ).getEntityRecord( @@ -279,11 +282,13 @@ const SiteLogo = ( { !! width } label={ __( 'Image width' ) } onDeselect={ () => setAttributes( { width: undefined } ) } + dropdownMenuProps={ dropdownMenuProps } > !! isLink } label={ __( 'Link image to home' ) } onDeselect={ () => setAttributes( { isLink: false } ) } @@ -320,6 +326,7 @@ const SiteLogo = ( { { isLink && ( linkTarget === '_blank' } label={ __( 'Open in new tab' ) } onDeselect={ () => @@ -341,6 +348,7 @@ const SiteLogo = ( { { canUserEdit && ( !! shouldSyncIcon } label={ __( 'Use as Site Icon' ) } onDeselect={ () => { @@ -664,7 +672,7 @@ export default function LogoEdit( { ) } - + ); From 57c7e1da6a8c84aa5ac39bd1de807642b84f3290 Mon Sep 17 00:00:00 2001 From: Nidhi Dhandhukiya <84835782+NidhiDhandhukiya74@users.noreply.github.com> Date: Mon, 10 Feb 2025 10:34:06 +0530 Subject: [PATCH 4/5] Update packages/block-library/src/site-logo/edit.js Treat false as a valid value for isLink instead of defaulting to true. Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com> --- packages/block-library/src/site-logo/edit.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-library/src/site-logo/edit.js b/packages/block-library/src/site-logo/edit.js index 317998a21ca5c0..1c368361c5aa3d 100644 --- a/packages/block-library/src/site-logo/edit.js +++ b/packages/block-library/src/site-logo/edit.js @@ -310,7 +310,7 @@ const SiteLogo = ( { !! isLink } + hasValue={ () => ! isLink } label={ __( 'Link image to home' ) } onDeselect={ () => setAttributes( { isLink: false } ) } > From 3ccd762b80c361ee42745507d0cb0a4ae18c49bb Mon Sep 17 00:00:00 2001 From: Nidhi Dhandhukiya <84835782+NidhiDhandhukiya74@users.noreply.github.com> Date: Mon, 10 Feb 2025 11:03:53 +0530 Subject: [PATCH 5/5] Update packages/block-library/src/site-logo/edit.js Reset value by updating isLink to its default true. Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com> --- packages/block-library/src/site-logo/edit.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-library/src/site-logo/edit.js b/packages/block-library/src/site-logo/edit.js index 1c368361c5aa3d..6fefbe3bbc0140 100644 --- a/packages/block-library/src/site-logo/edit.js +++ b/packages/block-library/src/site-logo/edit.js @@ -312,7 +312,7 @@ const SiteLogo = ( { isShownByDefault hasValue={ () => ! isLink } label={ __( 'Link image to home' ) } - onDeselect={ () => setAttributes( { isLink: false } ) } + onDeselect={ () => setAttributes( { isLink: true } ) } >