diff --git a/packages/edit-site/src/components/add-new-template/new-template-part.js b/packages/edit-site/src/components/add-new-template/new-template-part.js index 35c50d7f431554..5b05afea4476e6 100644 --- a/packages/edit-site/src/components/add-new-template/new-template-part.js +++ b/packages/edit-site/src/components/add-new-template/new-template-part.js @@ -20,6 +20,7 @@ import { getUniqueTemplatePartTitle, getCleanTemplatePartSlug, } from '../../utils/template-part-create'; +import { unlock } from '../../experiments'; export default function NewTemplatePart( { postType, @@ -30,7 +31,7 @@ export default function NewTemplatePart( { const [ isModalOpen, setIsModalOpen ] = useState( false ); const { createErrorNotice } = useDispatch( noticesStore ); const { saveEntityRecord } = useDispatch( coreStore ); - const { __unstableSetCanvasMode } = useDispatch( editSiteStore ); + const { setCanvasMode } = unlock( useDispatch( editSiteStore ) ); const existingTemplateParts = useExistingTemplateParts(); async function createTemplatePart( { title, area } ) { @@ -63,7 +64,7 @@ export default function NewTemplatePart( { setIsModalOpen( false ); // Switch to edit mode. - __unstableSetCanvasMode( 'edit' ); + setCanvasMode( 'edit' ); // Navigate to the created template part editor. history.push( { diff --git a/packages/edit-site/src/components/add-new-template/new-template.js b/packages/edit-site/src/components/add-new-template/new-template.js index ccd5448e4d81db..4b825de340e00e 100644 --- a/packages/edit-site/src/components/add-new-template/new-template.js +++ b/packages/edit-site/src/components/add-new-template/new-template.js @@ -48,6 +48,7 @@ import AddCustomGenericTemplateModal from './add-custom-generic-template-modal'; import TemplateActionsLoadingScreen from './template-actions-loading-screen'; import { useHistory } from '../routes'; import { store as editSiteStore } from '../../store'; +import { unlock } from '../../experiments'; const DEFAULT_TEMPLATE_SLUGS = [ 'front-page', @@ -98,8 +99,9 @@ export default function NewTemplate( { const { saveEntityRecord } = useDispatch( coreStore ); const { createErrorNotice, createSuccessNotice } = useDispatch( noticesStore ); - const { setTemplate, __unstableSetCanvasMode } = - useDispatch( editSiteStore ); + const { setTemplate, setCanvasMode } = unlock( + useDispatch( editSiteStore ) + ); async function createTemplate( template, isWPSuggestion = true ) { if ( isCreatingTemplate ) { @@ -140,7 +142,7 @@ export default function NewTemplate( { setTemplate( newTemplate.id, newTemplate.slug ); // Switch to edit mode. - __unstableSetCanvasMode( 'edit' ); + setCanvasMode( 'edit' ); // Navigate to the created template editor. history.push( { diff --git a/packages/edit-site/src/components/block-editor/index.js b/packages/edit-site/src/components/block-editor/index.js index f9bc730c2a0b7d..d3769f9dd907c8 100644 --- a/packages/edit-site/src/components/block-editor/index.js +++ b/packages/edit-site/src/components/block-editor/index.js @@ -51,13 +51,14 @@ export default function BlockEditor() { const { setIsInserterOpened } = useDispatch( editSiteStore ); const { storedSettings, templateType, canvasMode } = useSelect( ( select ) => { - const { getSettings, getEditedPostType, __unstableGetCanvasMode } = - select( editSiteStore ); + const { getSettings, getEditedPostType, getCanvasMode } = unlock( + select( editSiteStore ) + ); return { storedSettings: getSettings( setIsInserterOpened ), templateType: getEditedPostType(), - canvasMode: __unstableGetCanvasMode(), + canvasMode: getCanvasMode(), }; }, [ setIsInserterOpened ] diff --git a/packages/edit-site/src/components/editor/index.js b/packages/edit-site/src/components/editor/index.js index 3aef650b352be4..c860bda1ce0547 100644 --- a/packages/edit-site/src/components/editor/index.js +++ b/packages/edit-site/src/components/editor/index.js @@ -38,6 +38,7 @@ import { GlobalStylesRenderer } from '../global-styles-renderer'; import { GlobalStylesProvider } from '../global-styles/global-styles-provider'; import useTitle from '../routes/use-title'; import CanvasSpinner from '../canvas-spinner'; +import { unlock } from '../../experiments'; const interfaceLabels = { /* translators: accessibility text for the editor content landmark region. */ @@ -71,11 +72,11 @@ export default function Editor() { getEditedPostId, getEditedPostContext, getEditorMode, - __unstableGetCanvasMode, + getCanvasMode, isInserterOpened, isListViewOpened, isSaveViewOpened, - } = select( editSiteStore ); + } = unlock( select( editSiteStore ) ); const { hasFinishedResolution, getEntityRecord } = select( coreStore ); const { __unstableGetEditorMode } = select( blockEditorStore ); const { getActiveComplementaryArea } = select( interfaceStore ); @@ -99,7 +100,7 @@ export default function Editor() { ] ) : false, editorMode: getEditorMode(), - canvasMode: __unstableGetCanvasMode(), + canvasMode: getCanvasMode(), blockEditorMode: __unstableGetEditorMode(), isInserterOpen: isInserterOpened(), isListViewOpen: isListViewOpened(), diff --git a/packages/edit-site/src/components/layout/index.js b/packages/edit-site/src/components/layout/index.js index b50b8d23ab0765..1f50b1cb1d2f35 100644 --- a/packages/edit-site/src/components/layout/index.js +++ b/packages/edit-site/src/components/layout/index.js @@ -38,6 +38,7 @@ import useInitEditedEntityFromURL from '../sync-state-with-url/use-init-edited-e import SiteHub from '../site-hub'; import ResizeHandle from '../block-editor/resize-handle'; import useSyncCanvasModeWithURL from '../sync-state-with-url/use-sync-canvas-mode-with-url'; +import { unlock } from '../../experiments'; const ANIMATION_DURATION = 0.5; const emptyResizeHandleStyles = { @@ -66,9 +67,9 @@ export default function Layout() { const { getAllShortcutKeyCombinations } = select( keyboardShortcutsStore ); - const { __unstableGetCanvasMode } = select( editSiteStore ); + const { getCanvasMode } = unlock( select( editSiteStore ) ); return { - canvasMode: __unstableGetCanvasMode(), + canvasMode: getCanvasMode(), previousShortcut: getAllShortcutKeyCombinations( 'core/edit-site/previous-region' ), diff --git a/packages/edit-site/src/components/site-hub/index.js b/packages/edit-site/src/components/site-hub/index.js index a0252b81b8c5c7..190caea67fbc07 100644 --- a/packages/edit-site/src/components/site-hub/index.js +++ b/packages/edit-site/src/components/site-hub/index.js @@ -27,6 +27,7 @@ import { useLocation } from '../routes'; import getIsListPage from '../../utils/get-is-list-page'; import SiteIcon from '../site-icon'; import useEditedEntityRecord from '../use-edited-entity-record'; +import { unlock } from '../../experiments'; const HUB_ANIMATION_DURATION = 0.3; @@ -38,13 +39,10 @@ const SiteHub = forwardRef( const { canvasMode, dashboardLink, entityConfig } = useSelect( ( select ) => { select( editSiteStore ).getEditedPostType(); - const { - __unstableGetCanvasMode, - getSettings, - getEditedPostType, - } = select( editSiteStore ); + const { getCanvasMode, getSettings, getEditedPostType } = + unlock( select( editSiteStore ) ); return { - canvasMode: __unstableGetCanvasMode(), + canvasMode: getCanvasMode(), dashboardLink: getSettings().__experimentalDashboardLink, entityConfig: select( coreStore ).getEntityConfig( 'postType', @@ -56,7 +54,7 @@ const SiteHub = forwardRef( ); const disableMotion = useReducedMotion(); const isMobileViewport = useViewportMatch( 'medium', '<' ); - const { __unstableSetCanvasMode } = useDispatch( editSiteStore ); + const { setCanvasMode } = unlock( useDispatch( editSiteStore ) ); const { clearSelectedBlock } = useDispatch( blockEditorStore ); const showEditButton = ( isEditorPage && canvasMode === 'view' && ! isMobileViewport ) || @@ -77,7 +75,7 @@ const SiteHub = forwardRef( onClick: () => { clearSelectedBlock(); setIsMobileCanvasVisible( false ); - __unstableSetCanvasMode( 'view' ); + setCanvasMode( 'view' ); }, }; const { getTitle } = useEditedEntityRecord(); @@ -137,7 +135,7 @@ const SiteHub = forwardRef(