diff --git a/packages/edit-site/src/components/block-editor/index.js b/packages/edit-site/src/components/block-editor/index.js index c0b1ca9e00180..d9cf7cee964ba 100644 --- a/packages/edit-site/src/components/block-editor/index.js +++ b/packages/edit-site/src/components/block-editor/index.js @@ -26,6 +26,7 @@ import { DropZoneProvider, Popover } from '@wordpress/components'; import TemplatePartConverter from '../template-part-converter'; import NavigateToLink from '../navigate-to-link'; import { SidebarInspectorFill } from '../sidebar'; +import { store as editSiteStore } from '../../store'; function Canvas( { body } ) { useBlockSelectionClearer( body ); @@ -48,7 +49,7 @@ export default function BlockEditor( { setIsInserterOpen } ) { getEditedPostType, getPage, __experimentalGetPreviewDeviceType, - } = select( 'core/edit-site' ); + } = select( editSiteStore ); return { settings: getSettings( setIsInserterOpen ), templateType: getEditedPostType(), @@ -62,7 +63,7 @@ export default function BlockEditor( { setIsInserterOpen } ) { 'postType', templateType ); - const { setPage } = useDispatch( 'core/edit-site' ); + const { setPage } = useDispatch( editSiteStore ); const resizedCanvasStyles = useResizeCanvas( deviceType, true ); const ref = useRef(); diff --git a/packages/edit-site/src/components/editor/global-styles-provider.js b/packages/edit-site/src/components/editor/global-styles-provider.js index b299179068508..9480b849e821e 100644 --- a/packages/edit-site/src/components/editor/global-styles-provider.js +++ b/packages/edit-site/src/components/editor/global-styles-provider.js @@ -33,6 +33,7 @@ import { getPresetVariable, } from './utils'; import getGlobalStyles from './global-styles-renderer'; +import { store as editSiteStore } from '../../store'; const EMPTY_CONTENT = { isGlobalStylesUserThemeJSON: true }; const EMPTY_CONTENT_STRING = JSON.stringify( EMPTY_CONTENT ); @@ -134,10 +135,10 @@ export default function GlobalStylesProvider( { children, baseStyles } ) { const { blockTypes, settings } = useSelect( ( select ) => { return { blockTypes: select( blocksStore ).getBlockTypes(), - settings: select( 'core/edit-site' ).getSettings(), + settings: select( editSiteStore ).getSettings(), }; } ); - const { updateSettings } = useDispatch( 'core/edit-site' ); + const { updateSettings } = useDispatch( editSiteStore ); const contexts = useMemo( () => getContexts( blockTypes ), [ blockTypes ] ); diff --git a/packages/edit-site/src/components/editor/index.js b/packages/edit-site/src/components/editor/index.js index 204f75e9b0225..d26962bf1124e 100644 --- a/packages/edit-site/src/components/editor/index.js +++ b/packages/edit-site/src/components/editor/index.js @@ -41,6 +41,7 @@ import KeyboardShortcuts from '../keyboard-shortcuts'; import GlobalStylesProvider from './global-styles-provider'; import NavigationSidebar from '../navigation-sidebar'; import URLQueryController from '../url-query-controller'; +import { store as editSiteStore } from '../../store'; const interfaceLabels = { secondarySidebar: __( 'Block Library' ), @@ -67,7 +68,7 @@ function Editor() { getEditedPostId, getPage, isNavigationOpened, - } = select( 'core/edit-site' ); + } = select( editSiteStore ); const postType = getEditedPostType(); const postId = getEditedPostId(); @@ -77,7 +78,7 @@ function Editor() { isFullscreenActive: isFeatureActive( 'fullscreenMode' ), sidebarIsOpened: !! select( interfaceStore - ).getActiveComplementaryArea( 'core/edit-site' ), + ).getActiveComplementaryArea( editSiteStore ), settings: getSettings(), templateType: postType, page: getPage(), @@ -93,7 +94,7 @@ function Editor() { }; }, [] ); const { updateEditorSettings } = useDispatch( 'core/editor' ); - const { setPage, setIsInserterOpened } = useDispatch( 'core/edit-site' ); + const { setPage, setIsInserterOpened } = useDispatch( editSiteStore ); // Keep the defaultTemplateTypes in the core/editor settings too, // so that they can be selected with core/editor selectors in any editor. diff --git a/packages/edit-site/src/components/editor/utils.js b/packages/edit-site/src/components/editor/utils.js index 1e06302ddca9f..4c08feac99b32 100644 --- a/packages/edit-site/src/components/editor/utils.js +++ b/packages/edit-site/src/components/editor/utils.js @@ -6,6 +6,10 @@ import { get, find, forEach, camelCase, isString } from 'lodash'; * WordPress dependencies */ import { useSelect } from '@wordpress/data'; +/** + * Internal dependencies + */ +import { store as editSiteStore } from '../../store'; /* Supporting data */ export const ALL_BLOCKS_NAME = 'defaults'; @@ -90,7 +94,7 @@ export const LINK_COLOR_DECLARATION = `a { color: var(${ LINK_COLOR }, #00e); }` export function useEditorFeature( featurePath, blockName = ALL_BLOCKS_NAME ) { const settings = useSelect( ( select ) => { - return select( 'core/edit-site' ).getSettings(); + return select( editSiteStore ).getSettings(); } ); return ( get( diff --git a/packages/edit-site/src/components/header/feature-toggle/index.js b/packages/edit-site/src/components/header/feature-toggle/index.js index e45b82ee5518d..74f0b1e7e2d91 100644 --- a/packages/edit-site/src/components/header/feature-toggle/index.js +++ b/packages/edit-site/src/components/header/feature-toggle/index.js @@ -12,6 +12,11 @@ import { __ } from '@wordpress/i18n'; import { check } from '@wordpress/icons'; import { speak } from '@wordpress/a11y'; +/** + * Internal dependencies + */ +import { store as editSiteStore } from '../../../store'; + export default function FeatureToggle( { feature, label, @@ -28,10 +33,10 @@ export default function FeatureToggle( { }; const isActive = useSelect( ( select ) => { - return select( 'core/edit-site' ).isFeatureActive( feature ); + return select( editSiteStore ).isFeatureActive( feature ); }, [] ); - const { toggleFeature } = useDispatch( 'core/edit-site' ); + const { toggleFeature } = useDispatch( editSiteStore ); return ( { - return select( 'core/edit-site' ).isNavigationOpened(); + return select( editSiteStore ).isNavigationOpened(); } ); return ( diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/content-navigation.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/content-navigation.js index 0048a41f7e5e6..5b0ba7dd50bea 100644 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/content-navigation.js +++ b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/content-navigation.js @@ -21,12 +21,13 @@ import { MENU_CONTENT_PAGES, MENU_CONTENT_POSTS, } from './constants'; +import { store as editSiteStore } from '../../../store'; export default function ContentNavigation( { onActivateMenu } ) { const [ activeMenu, setActiveMenu ] = useState( 'root' ); const page = useSelect( - ( select ) => select( 'core/edit-site' ).getPage(), + ( select ) => select( editSiteStore ).getPage(), [] ); diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/index.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/index.js index 9db6e54cc87fe..35ce30effb9bc 100644 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/index.js +++ b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/index.js @@ -15,11 +15,12 @@ import ContentNavigation from './content-navigation'; import TemplatesNavigation from './templates-navigation'; import { useSelect } from '@wordpress/data'; import { MENU_ROOT } from './constants'; +import { store as editSiteStore } from '../../../store'; const NavigationPanel = ( { isOpen } ) => { const [ contentActiveMenu, setContentActiveMenu ] = useState( MENU_ROOT ); const { templatesActiveMenu, siteTitle } = useSelect( ( select ) => { - const { getNavigationPanelActiveMenu } = select( 'core/edit-site' ); + const { getNavigationPanelActiveMenu } = select( editSiteStore ); const { getEntityRecord } = select( 'core' ); const siteData = diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/content-posts.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/content-posts.js index 79337feed401e..26f9de091a0a3 100644 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/content-posts.js +++ b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/content-posts.js @@ -13,6 +13,7 @@ import { __ } from '@wordpress/i18n'; */ import NavigationEntityItems from '../navigation-entity-items'; import { MENU_CONTENT_POSTS, MENU_ROOT } from '../constants'; +import { store as editSiteStore } from '../../../../store'; export default function ContentPostsMenu() { const showOnFront = useSelect( @@ -22,7 +23,7 @@ export default function ContentPostsMenu() { [] ); - const { setPage } = useDispatch( 'core/edit-site' ); + const { setPage } = useDispatch( editSiteStore ); const onActivateFrontItem = () => { setPage( { diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/navigation-entity-items.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/navigation-entity-items.js index ca35d46d2a6aa..eff5c13f4cfe9 100644 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/navigation-entity-items.js +++ b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/navigation-entity-items.js @@ -5,6 +5,11 @@ import { useDispatch, useSelect } from '@wordpress/data'; import { __experimentalNavigationItem as NavigationItem } from '@wordpress/components'; import { getPathAndQueryString } from '@wordpress/url'; +/** + * Internal dependencies + */ +import { store as editSiteStore } from '../../../store'; + const getEntityTitle = ( kind, entity ) => 'taxonomy' === kind ? entity.name : entity?.title?.rendered; @@ -14,7 +19,7 @@ export default function NavigationEntityItems( { kind, name, query = {} } ) { [ kind, name, query ] ); - const { setPage } = useDispatch( 'core/edit-site' ); + const { setPage } = useDispatch( editSiteStore ); if ( ! entities ) { return null; diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/new-template-dropdown.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/new-template-dropdown.js index fb359544f657f..4570ed500b951 100644 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/new-template-dropdown.js +++ b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/new-template-dropdown.js @@ -21,6 +21,7 @@ import { Icon, plus } from '@wordpress/icons'; */ import getClosestAvailableTemplate from '../../../utils/get-closest-available-template'; import { TEMPLATES_NEW_OPTIONS } from './constants'; +import { store as editSiteStore } from '../../../store'; export default function NewTemplateDropdown() { const { defaultTemplateTypes, templates } = useSelect( ( select ) => { @@ -36,7 +37,7 @@ export default function NewTemplateDropdown() { templates: templateEntities, }; }, [] ); - const { addTemplate } = useDispatch( 'core/edit-site' ); + const { addTemplate } = useDispatch( editSiteStore ); const createTemplate = ( slug ) => { const closestAvailableTemplate = getClosestAvailableTemplate( diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/template-navigation-item.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/template-navigation-item.js index 9d7e85094de1e..96ff13644eb16 100644 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/template-navigation-item.js +++ b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/template-navigation-item.js @@ -14,6 +14,7 @@ import { __ } from '@wordpress/i18n'; */ import TemplatePreview from './template-preview'; import { NavigationPanelPreviewFill } from '../index'; +import { store as editSiteStore } from '../../../store'; export default function TemplateNavigationItem( { item } ) { const { title, description } = useSelect( @@ -26,7 +27,7 @@ export default function TemplateNavigationItem( { item } ) { }, [] ); - const { setTemplate, setTemplatePart } = useDispatch( 'core/edit-site' ); + const { setTemplate, setTemplatePart } = useDispatch( editSiteStore ); const [ isPreviewVisible, setIsPreviewVisible ] = useState( false ); if ( ! item ) { diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/templates-navigation.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/templates-navigation.js index d20c32286c52a..3e332f674576c 100644 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/templates-navigation.js +++ b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/templates-navigation.js @@ -17,6 +17,7 @@ import TemplatesMenu from './menus/templates'; import TemplatePartsMenu from './menus/template-parts'; import MainDashboardButton from '../../main-dashboard-button'; import { MENU_ROOT, MENU_TEMPLATE_PARTS, MENU_TEMPLATES } from './constants'; +import { store as editSiteStore } from '../../../store'; export default function TemplatesNavigation() { const { postId, postType, activeMenu } = useSelect( ( select ) => { @@ -24,7 +25,7 @@ export default function TemplatesNavigation() { getEditedPostType, getEditedPostId, getNavigationPanelActiveMenu, - } = select( 'core/edit-site' ); + } = select( editSiteStore ); return { postId: getEditedPostId(), @@ -33,7 +34,7 @@ export default function TemplatesNavigation() { }; }, [] ); - const { setNavigationPanelActiveMenu } = useDispatch( 'core/edit-site' ); + const { setNavigationPanelActiveMenu } = useDispatch( editSiteStore ); return ( { - const { isFeatureActive } = select( 'core/edit-site' ); + const { isFeatureActive } = select( editSiteStore ); const { getEntityRecord } = select( 'core' ); const { isResolving } = select( 'core/data' ); const siteData = @@ -28,7 +33,7 @@ function NavigationToggle( { icon, isOpen } ) { [] ); - const { setIsNavigationPanelOpened } = useDispatch( 'core/edit-site' ); + const { setIsNavigationPanelOpened } = useDispatch( editSiteStore ); if ( ! isActive ) { return null; diff --git a/packages/edit-site/src/components/sidebar/color-palette-panel.js b/packages/edit-site/src/components/sidebar/color-palette-panel.js index 30782c779e743..3fce2f3d8d4c8 100644 --- a/packages/edit-site/src/components/sidebar/color-palette-panel.js +++ b/packages/edit-site/src/components/sidebar/color-palette-panel.js @@ -14,6 +14,7 @@ import { useSelect } from '@wordpress/data'; * Internal dependencies */ import { useEditorFeature, ALL_BLOCKS_NAME } from '../editor/utils'; +import { store as editSiteStore } from '../../store'; /** * Shared reference to an empty array for cases where it is important to avoid @@ -35,7 +36,7 @@ export default function ColorPalettePanel( { const userColors = getSetting( contextName, 'color.palette' ); const immutableColorSlugs = useSelect( ( select ) => { - const baseStyles = select( 'core/edit-site' ).getSettings() + const baseStyles = select( editSiteStore ).getSettings() .__experimentalGlobalStylesBaseStyles; const basePalette = get( baseStyles, [ diff --git a/packages/edit-site/src/components/template-details/index.js b/packages/edit-site/src/components/template-details/index.js index ae2d1ab4f0157..780277b21e067 100644 --- a/packages/edit-site/src/components/template-details/index.js +++ b/packages/edit-site/src/components/template-details/index.js @@ -9,6 +9,7 @@ import { useDispatch, useSelect } from '@wordpress/data'; * Internal dependencies */ import { MENU_TEMPLATES } from '../navigation-sidebar/navigation-panel/constants'; +import { store as editSiteStore } from '../../store'; export default function TemplateDetails( { template, onClose } ) { const { title, description } = useSelect( @@ -16,7 +17,7 @@ export default function TemplateDetails( { template, onClose } ) { select( 'core/editor' ).__experimentalGetTemplateInfo( template ), [] ); - const { openNavigationPanelToMenu } = useDispatch( 'core/edit-site' ); + const { openNavigationPanelToMenu } = useDispatch( editSiteStore ); if ( ! template ) { return null; diff --git a/packages/edit-site/src/components/url-query-controller/index.js b/packages/edit-site/src/components/url-query-controller/index.js index 3ff703bf0debd..f7d2c9c04b3d8 100644 --- a/packages/edit-site/src/components/url-query-controller/index.js +++ b/packages/edit-site/src/components/url-query-controller/index.js @@ -5,9 +5,14 @@ import { useEffect } from '@wordpress/element'; import { useDispatch, useSelect } from '@wordpress/data'; import { getQueryArg, addQueryArgs, removeQueryArgs } from '@wordpress/url'; +/** + * Internal dependencies + */ +import { store as editSiteStore } from '../../store'; + export default function URLQueryController() { const { setTemplate, setTemplatePart, showHomepage, setPage } = useDispatch( - 'core/edit-site' + editSiteStore ); // Set correct entity on load. @@ -48,7 +53,7 @@ export default function URLQueryController() { function useCurrentPageContext() { return useSelect( ( select ) => { const { getEditedPostType, getEditedPostId, getPage } = select( - 'core/edit-site' + editSiteStore ); const page = getPage(); diff --git a/packages/edit-site/src/store/actions.js b/packages/edit-site/src/store/actions.js index 25d75765c6582..ebd11e48d8db0 100644 --- a/packages/edit-site/src/store/actions.js +++ b/packages/edit-site/src/store/actions.js @@ -5,6 +5,11 @@ import { controls } from '@wordpress/data'; import { apiFetch } from '@wordpress/data-controls'; import { getPathAndQueryString } from '@wordpress/url'; +/** + * Internal dependencies + */ +import { STORE_NAME as editSiteStoreName } from './constants'; + /** * Returns an action object used to toggle a feature flag. * @@ -91,8 +96,8 @@ export function* removeTemplate( templateId ) { path: `/wp/v2/templates/${ templateId }`, method: 'DELETE', } ); - const page = yield controls.select( 'core/edit-site', 'getPage' ); - yield controls.dispatch( 'core/edit-site', 'setPage', page ); + const page = yield controls.select( editSiteStoreName, 'getPage' ); + yield controls.dispatch( editSiteStoreName, 'setPage', page ); } /** @@ -182,7 +187,7 @@ export function* showHomepage() { ); const { siteUrl } = yield controls.select( - 'core/edit-site', + editSiteStoreName, 'getSettings' ); diff --git a/packages/edit-site/src/store/index.js b/packages/edit-site/src/store/index.js index 1d25cf1e108d5..d7fc3e66a7d6b 100644 --- a/packages/edit-site/src/store/index.js +++ b/packages/edit-site/src/store/index.js @@ -1,7 +1,7 @@ /** * WordPress dependencies */ -import { registerStore } from '@wordpress/data'; +import { createReduxStore, register } from '@wordpress/data'; import { controls } from '@wordpress/data-controls'; /** @@ -12,8 +12,14 @@ import * as actions from './actions'; import * as selectors from './selectors'; import { STORE_NAME } from './constants'; +export let store = null; + export default function registerEditSiteStore( initialState ) { - const store = registerStore( STORE_NAME, { + if ( store !== null ) { + return; + } + + const _store = createReduxStore( STORE_NAME, { reducer, actions, selectors, @@ -21,6 +27,9 @@ export default function registerEditSiteStore( initialState ) { persist: [ 'preferences' ], initialState, } ); + register( _store ); + + store = _store; - return store; + return _store; } diff --git a/packages/edit-site/src/store/test/actions.js b/packages/edit-site/src/store/test/actions.js index 0ad8fdb4af851..0d642be9def78 100644 --- a/packages/edit-site/src/store/test/actions.js +++ b/packages/edit-site/src/store/test/actions.js @@ -1,6 +1,7 @@ /** * Internal dependencies */ +import registerEditSiteStore from '..'; import { toggleFeature, setTemplate, @@ -12,6 +13,8 @@ import { setHomeTemplateId, } from '../actions'; +registerEditSiteStore(); + describe( 'actions', () => { describe( 'toggleFeature', () => { it( 'should return TOGGLE_FEATURE action', () => { diff --git a/packages/edit-site/src/store/test/reducer.js b/packages/edit-site/src/store/test/reducer.js index 9f8263786464b..123f1a4aaf600 100644 --- a/packages/edit-site/src/store/test/reducer.js +++ b/packages/edit-site/src/store/test/reducer.js @@ -22,6 +22,9 @@ import { setIsNavigationPanelOpened, setIsInserterOpened, } from '../actions'; +import registerEditSiteStore from '..'; + +registerEditSiteStore(); describe( 'state', () => { describe( 'preferences()', () => { diff --git a/packages/edit-site/src/store/test/selectors.js b/packages/edit-site/src/store/test/selectors.js index e24b640f07afb..032117da80ea0 100644 --- a/packages/edit-site/src/store/test/selectors.js +++ b/packages/edit-site/src/store/test/selectors.js @@ -1,6 +1,7 @@ /** * Internal dependencies */ +import registerEditSiteStore from '..'; import { isFeatureActive, getCanUserCreateMedia, @@ -14,6 +15,8 @@ import { isInserterOpened, } from '../selectors'; +registerEditSiteStore(); + describe( 'selectors', () => { const canUser = jest.fn( () => true ); getCanUserCreateMedia.registry = {