From 43ba18b0f0da0678c8e13ad07d328f7d64dab98e Mon Sep 17 00:00:00 2001 From: Andrea Fercia Date: Fri, 3 Nov 2023 09:48:36 +0100 Subject: [PATCH 1/4] Don't render Preview button tooltip when show text labels is enabled. --- .../src/components/preview-options/index.js | 2 ++ .../src/components/device-preview/index.js | 36 +++++++++++-------- 2 files changed, 23 insertions(+), 15 deletions(-) diff --git a/packages/block-editor/src/components/preview-options/index.js b/packages/block-editor/src/components/preview-options/index.js index 8dc5a70a91397d..8ffdd4327de27c 100644 --- a/packages/block-editor/src/components/preview-options/index.js +++ b/packages/block-editor/src/components/preview-options/index.js @@ -19,6 +19,7 @@ export default function PreviewOptions( { deviceType, setDeviceType, label, + showIconLabels, } ) { const isMobile = useViewportMatch( 'small', '<' ); if ( isMobile ) return null; @@ -35,6 +36,7 @@ export default function PreviewOptions( { disabled: ! isEnabled, __experimentalIsFocusable: ! isEnabled, children: viewLabel, + showTooltip: ! showIconLabels, }; const menuProps = { 'aria-label': __( 'View options' ), diff --git a/packages/edit-post/src/components/device-preview/index.js b/packages/edit-post/src/components/device-preview/index.js index ab38523969ace1..a10688d1850237 100644 --- a/packages/edit-post/src/components/device-preview/index.js +++ b/packages/edit-post/src/components/device-preview/index.js @@ -15,22 +15,27 @@ import { store as coreStore } from '@wordpress/core-data'; import { store as editPostStore } from '../../store'; export default function DevicePreview() { - const { hasActiveMetaboxes, isPostSaveable, isViewable, deviceType } = - useSelect( ( select ) => { - const { getEditedPostAttribute } = select( editorStore ); - const { getPostType } = select( coreStore ); - const postType = getPostType( getEditedPostAttribute( 'type' ) ); + const { + hasActiveMetaboxes, + isPostSaveable, + isViewable, + deviceType, + showIconLabels, + } = useSelect( ( select ) => { + const { getEditedPostAttribute } = select( editorStore ); + const { getPostType } = select( coreStore ); + const postType = getPostType( getEditedPostAttribute( 'type' ) ); - return { - hasActiveMetaboxes: select( editPostStore ).hasMetaBoxes(), - isPostSaveable: select( editorStore ).isEditedPostSaveable(), - isViewable: postType?.viewable ?? false, - deviceType: - select( - editPostStore - ).__experimentalGetPreviewDeviceType(), - }; - }, [] ); + return { + hasActiveMetaboxes: select( editPostStore ).hasMetaBoxes(), + isPostSaveable: select( editorStore ).isEditedPostSaveable(), + isViewable: postType?.viewable ?? false, + deviceType: + select( editPostStore ).__experimentalGetPreviewDeviceType(), + showIconLabels: + select( editPostStore ).isFeatureActive( 'showIconLabels' ), + }; + }, [] ); const { __experimentalSetPreviewDeviceType: setPreviewDeviceType } = useDispatch( editPostStore ); @@ -41,6 +46,7 @@ export default function DevicePreview() { deviceType={ deviceType } setDeviceType={ setPreviewDeviceType } label={ __( 'Preview' ) } + showIconLabels={ showIconLabels } > { ( { onClose } ) => isViewable && ( From 6f9675daf6bcf842453dc6fe15a24993d130987e Mon Sep 17 00:00:00 2001 From: Andrea Fercia Date: Fri, 3 Nov 2023 09:53:05 +0100 Subject: [PATCH 2/4] Don't render View button tooltip when show text labels is enabled. --- packages/edit-site/src/components/header-edit-mode/index.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/edit-site/src/components/header-edit-mode/index.js b/packages/edit-site/src/components/header-edit-mode/index.js index a7daf5570a204b..ecb501f669ee97 100644 --- a/packages/edit-site/src/components/header-edit-mode/index.js +++ b/packages/edit-site/src/components/header-edit-mode/index.js @@ -229,6 +229,7 @@ export default function HeaderEditMode( { setListViewToggleElement } ) { isEnabled={ ! isFocusMode && hasDefaultEditorCanvasView } + showIconLabels={ showIconLabels } > { ( { onClose } ) => ( From bd8f1520023430c4f4667cc24311aeb712b626b1 Mon Sep 17 00:00:00 2001 From: Andrea Fercia Date: Fri, 3 Nov 2023 11:51:11 +0100 Subject: [PATCH 3/4] Fix comment block. --- packages/edit-site/src/components/save-button/index.js | 2 +- packages/editor/src/components/post-saved-state/index.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/edit-site/src/components/save-button/index.js b/packages/edit-site/src/components/save-button/index.js index 7be87e8956e7db..c2a213cc3e364b 100644 --- a/packages/edit-site/src/components/save-button/index.js +++ b/packages/edit-site/src/components/save-button/index.js @@ -98,7 +98,7 @@ export default function SaveButton( { * Displaying the keyboard shortcut conditionally makes the tooltip * itself show conditionally. This would trigger a full-rerendering * of the button that we want to avoid. By setting `showTooltip`, - & the tooltip is always rendered even when there's no keyboard shortcut. + * the tooltip is always rendered even when there's no keyboard shortcut. */ showTooltip={ showTooltip } icon={ icon } diff --git a/packages/editor/src/components/post-saved-state/index.js b/packages/editor/src/components/post-saved-state/index.js index 9d6cb49d91e8e8..57c46ab3013385 100644 --- a/packages/editor/src/components/post-saved-state/index.js +++ b/packages/editor/src/components/post-saved-state/index.js @@ -156,7 +156,7 @@ export default function PostSavedState( { * Displaying the keyboard shortcut conditionally makes the tooltip * itself show conditionally. This would trigger a full-rerendering * of the button that we want to avoid. By setting `showTooltip`, - & the tooltip is always rendered even when there's no keyboard shortcut. + * the tooltip is always rendered even when there's no keyboard shortcut. */ showTooltip variant="tertiary" From 3ebb723c81991156bcd224dc299d73139ab9f3f8 Mon Sep 17 00:00:00 2001 From: Andrea Fercia Date: Wed, 22 Nov 2023 09:06:56 +0100 Subject: [PATCH 4/4] Don't render View Post button tooltip when show text labels is enabled. --- .../src/components/view-link/index.js | 31 +++++++++++++------ 1 file changed, 21 insertions(+), 10 deletions(-) diff --git a/packages/edit-post/src/components/view-link/index.js b/packages/edit-post/src/components/view-link/index.js index 10b10d8af1ee3d..3ebf78b851e1f7 100644 --- a/packages/edit-post/src/components/view-link/index.js +++ b/packages/edit-post/src/components/view-link/index.js @@ -8,18 +8,28 @@ import { store as editorStore } from '@wordpress/editor'; import { store as coreStore } from '@wordpress/core-data'; import { useSelect } from '@wordpress/data'; +/** + * Internal dependencies + */ +import { store as editPostStore } from '../../store'; + export default function ViewLink() { - const { permalink, isPublished, label } = useSelect( ( select ) => { - // Grab post type to retrieve the view_item label. - const postTypeSlug = select( editorStore ).getCurrentPostType(); - const postType = select( coreStore ).getPostType( postTypeSlug ); + const { permalink, isPublished, label, showIconLabels } = useSelect( + ( select ) => { + // Grab post type to retrieve the view_item label. + const postTypeSlug = select( editorStore ).getCurrentPostType(); + const postType = select( coreStore ).getPostType( postTypeSlug ); - return { - permalink: select( editorStore ).getPermalink(), - isPublished: select( editorStore ).isCurrentPostPublished(), - label: postType?.labels.view_item, - }; - }, [] ); + return { + permalink: select( editorStore ).getPermalink(), + isPublished: select( editorStore ).isCurrentPostPublished(), + label: postType?.labels.view_item, + showIconLabels: + select( editPostStore ).isFeatureActive( 'showIconLabels' ), + }; + }, + [] + ); // Only render the view button if the post is published and has a permalink. if ( ! isPublished || ! permalink ) { @@ -32,6 +42,7 @@ export default function ViewLink() { label={ label || __( 'View post' ) } href={ permalink } target="_blank" + showTooltip={ ! showIconLabels } /> ); }