diff --git a/packages/edit-post/src/components/editor-initialization/listener-hooks.js b/packages/edit-post/src/components/editor-initialization/listener-hooks.js
index 57f5f67721ba7..73872b4d7110e 100644
--- a/packages/edit-post/src/components/editor-initialization/listener-hooks.js
+++ b/packages/edit-post/src/components/editor-initialization/listener-hooks.js
@@ -5,6 +5,7 @@ import { useSelect, useDispatch } from '@wordpress/data';
import { useEffect, useRef } from '@wordpress/element';
import { store as blockEditorStore } from '@wordpress/block-editor';
import { store as editorStore } from '@wordpress/editor';
+import { store as preferencesStore } from '@wordpress/preferences';
/**
* Internal dependencies
@@ -22,19 +23,25 @@ import {
* @param {number} postId The current post id.
*/
export const useBlockSelectionListener = ( postId ) => {
- const { hasBlockSelection, isEditorSidebarOpened } = useSelect(
- ( select ) => ( {
- hasBlockSelection:
- !! select( blockEditorStore ).getBlockSelectionStart(),
- isEditorSidebarOpened: select( STORE_NAME ).isEditorSidebarOpened(),
- } ),
- [ postId ]
- );
+ const { hasBlockSelection, isEditorSidebarOpened, isDistractionFree } =
+ useSelect(
+ ( select ) => {
+ const { get } = select( preferencesStore );
+ return {
+ hasBlockSelection:
+ !! select( blockEditorStore ).getBlockSelectionStart(),
+ isEditorSidebarOpened:
+ select( STORE_NAME ).isEditorSidebarOpened(),
+ isDistractionFree: get( 'core', 'distractionFree' ),
+ };
+ },
+ [ postId ]
+ );
const { openGeneralSidebar } = useDispatch( STORE_NAME );
useEffect( () => {
- if ( ! isEditorSidebarOpened ) {
+ if ( ! isEditorSidebarOpened || isDistractionFree ) {
return;
}
if ( hasBlockSelection ) {
diff --git a/packages/edit-post/src/components/editor-initialization/test/listener-hooks.js b/packages/edit-post/src/components/editor-initialization/test/listener-hooks.js
index c263d99398297..5087d303fafe1 100644
--- a/packages/edit-post/src/components/editor-initialization/test/listener-hooks.js
+++ b/packages/edit-post/src/components/editor-initialization/test/listener-hooks.js
@@ -44,6 +44,12 @@ describe( 'listener hook tests', () => {
isViewportMatch: jest.fn(),
},
},
+ 'core/preferences': {
+ ...storeConfig,
+ selectors: {
+ get: jest.fn(),
+ },
+ },
[ STORE_NAME ]: {
...storeConfig,
actions: {
@@ -112,6 +118,7 @@ describe( 'listener hook tests', () => {
'getBlockSelectionStart',
true
);
+ setMockReturnValue( 'core/preferences', 'get', false );
render( );
@@ -120,12 +127,14 @@ describe( 'listener hook tests', () => {
).toHaveBeenCalledWith( 'edit-post/block' );
} );
it( 'opens document sidebar if block is not selected', () => {
+ setMockReturnValue( STORE_NAME, 'isEditorSidebarOpened', true );
setMockReturnValue( STORE_NAME, 'isEditorSidebarOpened', true );
setMockReturnValue(
'core/block-editor',
'getBlockSelectionStart',
false
);
+ setMockReturnValue( 'core/preferences', 'get', false );
render( );
@@ -133,6 +142,37 @@ describe( 'listener hook tests', () => {
getSpyedAction( STORE_NAME, 'openGeneralSidebar' )
).toHaveBeenCalledWith( 'edit-post/document' );
} );
+ it( 'does not open block sidebar if block is selected and distraction free mode is on', () => {
+ setMockReturnValue( STORE_NAME, 'isEditorSidebarOpened', true );
+ setMockReturnValue(
+ 'core/block-editor',
+ 'getBlockSelectionStart',
+ true
+ );
+ setMockReturnValue( 'core/preferences', 'get', true );
+
+ render( );
+
+ expect(
+ getSpyedAction( STORE_NAME, 'openGeneralSidebar' )
+ ).toHaveBeenCalledTimes( 0 );
+ } );
+ it( 'does not open document sidebar if block is not selected and distraction free is on', () => {
+ setMockReturnValue( STORE_NAME, 'isEditorSidebarOpened', true );
+ setMockReturnValue( STORE_NAME, 'isEditorSidebarOpened', true );
+ setMockReturnValue(
+ 'core/block-editor',
+ 'getBlockSelectionStart',
+ false
+ );
+ setMockReturnValue( 'core/preferences', 'get', true );
+
+ render( );
+
+ expect(
+ getSpyedAction( STORE_NAME, 'openGeneralSidebar' )
+ ).toHaveBeenCalledTimes( 0 );
+ } );
} );
describe( 'useUpdatePostLinkListener', () => {
diff --git a/packages/edit-post/src/components/layout/index.js b/packages/edit-post/src/components/layout/index.js
index 9dd7314357e04..eb2b696fa3970 100644
--- a/packages/edit-post/src/components/layout/index.js
+++ b/packages/edit-post/src/components/layout/index.js
@@ -385,7 +385,7 @@ function Layout( { initialPost } ) {
-
+ { ! isDistractionFree && }
>
);
}
diff --git a/packages/edit-site/src/components/editor/index.js b/packages/edit-site/src/components/editor/index.js
index 9c95755db2803..6563374858a37 100644
--- a/packages/edit-site/src/components/editor/index.js
+++ b/packages/edit-site/src/components/editor/index.js
@@ -263,6 +263,7 @@ export default function Editor( { isLoading } ) {
( shouldShowListView && ) )
}
sidebar={
+ ! isDistractionFree &&
isEditMode &&
isRightSidebarOpen && (
<>
diff --git a/packages/editor/src/components/document-tools/index.js b/packages/editor/src/components/document-tools/index.js
index 05907654fa9b8..26adcb1bb725a 100644
--- a/packages/editor/src/components/document-tools/index.js
+++ b/packages/editor/src/components/document-tools/index.js
@@ -46,6 +46,7 @@ function DocumentTools( {
const { setIsInserterOpened, setIsListViewOpened } =
useDispatch( editorStore );
const {
+ isDistractionFree,
isInserterOpened,
isListViewOpen,
listViewShortcut,
@@ -69,6 +70,7 @@ function DocumentTools( {
listViewToggleRef: getListViewToggleRef(),
hasFixedToolbar: getSettings().hasFixedToolbar,
showIconLabels: get( 'core', 'showIconLabels' ),
+ isDistractionFree: get( 'core', 'distractionFree' ),
};
}, [] );
@@ -158,22 +160,26 @@ function DocumentTools( {
variant={ showIconLabels ? 'tertiary' : undefined }
size="compact"
/>
-
+ { ! isDistractionFree && (
+
+ ) }
>
) }
{ children }