Move adminInterface check to shouldShowGlobalSiteSidebar (#87583)

Automattic · Feb 19, 2024 · 0714648 · 0714648
1 parent 86d9a16
commit 0714648
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 17 deletions.
diff --git a/client/my-sites/navigation/index.jsx b/client/my-sites/navigation/index.jsx
@@ -4,10 +4,12 @@ import { connect } from 'react-redux';
 import AsyncLoad from 'calypso/components/async-load';
 import { withCurrentRoute } from 'calypso/components/route';
 import GlobalSidebar from 'calypso/layout/global-sidebar';
-import { useGlobalSidebar } from 'calypso/layout/global-sidebar/hooks/use-global-sidebar';
 import SitePicker from 'calypso/my-sites/picker';
 import MySitesSidebarUnifiedBody from 'calypso/my-sites/sidebar/body';
-import { getSiteOption } from 'calypso/state/sites/selectors';
+import {
+	getShouldShowGlobalSidebar,
+	getShouldShowGlobalSiteSidebar,
+} from 'calypso/state/global-sidebar/selectors';
 import { getSelectedSiteId } from 'calypso/state/ui/selectors';
 
 class MySitesNavigation extends Component {
@@ -105,15 +107,15 @@ export default withCurrentRoute(
 	connect( ( state, { currentSection } ) => {
 		const sectionGroup = currentSection?.group ?? null;
 		const siteId = getSelectedSiteId( state );
-		const adminInterface = getSiteOption( state, siteId, 'wpcom_admin_interface' );
-		const { shouldShowGlobalSidebar, shouldShowGlobalSiteSidebar } = useGlobalSidebar(
+		const shouldShowGlobalSidebar = getShouldShowGlobalSidebar( state, siteId, sectionGroup );
+		const shouldShowGlobalSiteSidebar = getShouldShowGlobalSiteSidebar(
+			state,
 			siteId,
 			sectionGroup
 		);
 		return {
 			isGlobalSidebarVisible: shouldShowGlobalSidebar,
-			// Global Site View should be limited to classic interface users only for now.
-			isGlobalSiteSidebarVisible: shouldShowGlobalSiteSidebar && adminInterface === 'wp-admin',
+			isGlobalSiteSidebarVisible: shouldShowGlobalSiteSidebar,
 		};
 	}, null )( MySitesNavigation )
 );
diff --git a/client/my-sites/sidebar/use-site-menu-items.js b/client/my-sites/sidebar/use-site-menu-items.js
@@ -4,9 +4,12 @@ import { useTranslate } from 'i18n-calypso';
 import { useEffect, useMemo } from 'react';
 import { useSelector, useDispatch } from 'react-redux';
 import { useCurrentRoute } from 'calypso/components/route';
-import { useGlobalSidebar } from 'calypso/layout/global-sidebar/hooks/use-global-sidebar';
 import domainOnlyFallbackMenu from 'calypso/my-sites/sidebar/static-data/domain-only-fallback-menu';
 import { getAdminMenu } from 'calypso/state/admin-menu/selectors';
+import {
+	getShouldShowGlobalSidebar,
+	getShouldShowGlobalSiteSidebar,
+} from 'calypso/state/global-sidebar/selectors';
 import { getPluginOnSite } from 'calypso/state/plugins/installed/selectors';
 import { canAnySiteHavePlugins } from 'calypso/state/selectors/can-any-site-have-plugins';
 import { canCurrentUser } from 'calypso/state/selectors/can-current-user';
@@ -17,7 +20,6 @@ import isSiteWPForTeams from 'calypso/state/selectors/is-site-wpforteams';
 import { getSiteDomain, isJetpackSite } from 'calypso/state/sites/selectors';
 import { getSelectedSiteId } from 'calypso/state/ui/selectors';
 import { requestAdminMenu } from '../../state/admin-menu/actions';
-import { getSiteOption } from '../../state/sites/selectors';
 import allSitesMenu from './static-data/all-sites-menu';
 import buildFallbackResponse from './static-data/fallback-menu';
 import globalSidebarMenu from './static-data/global-sidebar-menu';
@@ -36,13 +38,12 @@ const useSiteMenuItems = () => {
 	const locale = useLocale();
 	const isAllDomainsView = '/domains/manage' === currentRoute;
 	const { currentSection } = useCurrentRoute();
-	const adminInterface = useSelector( ( state ) =>
-		getSiteOption( state, selectedSiteId, 'wpcom_admin_interface' )
-	);
-	const { shouldShowGlobalSidebar, shouldShowGlobalSiteSidebar } = useGlobalSidebar(
-		selectedSiteId,
-		currentSection?.group
-	);
+	const shouldShowGlobalSidebar = useSelector( ( state ) => {
+		return getShouldShowGlobalSidebar( state, selectedSiteId, currentSection?.group );
+	} );
+	const shouldShowGlobalSiteSidebar = useSelector( ( state ) => {
+		return getShouldShowGlobalSiteSidebar( state, selectedSiteId, currentSection?.group );
+	} );
 
 	useEffect( () => {
 		if ( selectedSiteId && siteDomain ) {
@@ -114,8 +115,7 @@ const useSiteMenuItems = () => {
 	if ( shouldShowGlobalSidebar ) {
 		return globalSidebarMenu();
 	}
-	// Global Site View should be limited to classic interface users only for now.
-	if ( shouldShowGlobalSiteSidebar && adminInterface === 'wp-admin' ) {
+	if ( shouldShowGlobalSiteSidebar ) {
 		return globalSiteSidebarMenu( {
 			siteDomain,
 			shouldShowAddOns: shouldShowAddOnsInFallbackMenu,

diff --git a/client/state/global-sidebar/selectors.ts b/client/state/global-sidebar/selectors.ts
@@ -0,0 +1,30 @@
+import { isEnabled } from '@automattic/calypso-config';
+import { getSiteOption } from '../sites/selectors';
+import type { AppState } from 'calypso/types';
+
+export const getShouldShowGlobalSidebar = ( _: AppState, siteId: number, sectionGroup: string ) => {
+	let shouldShowGlobalSidebar = false;
+	if ( isEnabled( 'layout/dotcom-nav-redesign' ) ) {
+		shouldShowGlobalSidebar =
+			sectionGroup === 'me' ||
+			sectionGroup === 'reader' ||
+			sectionGroup === 'sites-dashboard' ||
+			( sectionGroup === 'sites' && ! siteId );
+	}
+	return shouldShowGlobalSidebar;
+};
+
+export const getShouldShowGlobalSiteSidebar = (
+	state: AppState,
+	siteId: number,
+	sectionGroup: string
+) => {
+	let shouldShowGlobalSiteSidebar = false;
+	if ( isEnabled( 'layout/dotcom-nav-redesign' ) ) {
+		// Global Site View should be limited to classic interface users only for now.
+		const adminInterface = getSiteOption( state, siteId, 'wpcom_admin_interface' );
+		shouldShowGlobalSiteSidebar =
+			adminInterface === 'wp-admin' && sectionGroup === 'sites' && !! siteId;
+	}
+	return shouldShowGlobalSiteSidebar;
+};