Calypso 404: Redirect user to selected site home when 404 return home…

… is clicked (#95140) * when there is a 404 error on a selected site return home redirects to the selected site home * add test for wp-admin style interface
Automattic · Oct 5, 2024 · 28cdfbe · 28cdfbe
1 parent aae77f5
commit 28cdfbe
Show file tree

Hide file tree

Showing 2 changed files with 83 additions and 7 deletions.
diff --git a/client/root.js b/client/root.js
@@ -14,6 +14,7 @@ import {
 	isAdminInterfaceWPAdmin,
 } from 'calypso/state/sites/selectors';
 import { hasSitesAsLandingPage } from 'calypso/state/sites/selectors/has-sites-as-landing-page';
+import { getSelectedSiteId } from './state/ui/selectors';
 
 /**
  * @param clientRouter Unused. We can't use the isomorphic router because we want to do redirects.
@@ -94,9 +95,9 @@ async function getLoggedInLandingPage( { dispatch, getState } ) {
 
 	// determine the primary site ID (it's a property of "current user" object) and then
 	// ensure that the primary site info is loaded into Redux before proceeding.
-	const primarySiteId = getPrimarySiteId( getState() );
-	await dispatch( waitForSite( primarySiteId ) );
-	const primarySiteSlug = getSiteSlug( getState(), primarySiteId );
+	const primaryOrSelectedSiteId = getSelectedSiteId( getState() ) || getPrimarySiteId( getState() );
+	await dispatch( waitForSite( primaryOrSelectedSiteId ) );
+	const primarySiteSlug = getSiteSlug( getState(), primaryOrSelectedSiteId );
 
 	if ( ! primarySiteSlug ) {
 		if ( getIsSubscriptionOnly( getState() ) ) {
@@ -106,12 +107,15 @@ async function getLoggedInLandingPage( { dispatch, getState } ) {
 		return '/sites';
 	}
 
-	const isCustomerHomeEnabled = canCurrentUserUseCustomerHome( getState(), primarySiteId );
+	const isCustomerHomeEnabled = canCurrentUserUseCustomerHome(
+		getState(),
+		primaryOrSelectedSiteId
+	);
 
 	if ( isCustomerHomeEnabled ) {
-		if ( isAdminInterfaceWPAdmin( getState(), primarySiteId ) ) {
+		if ( isAdminInterfaceWPAdmin( getState(), primaryOrSelectedSiteId ) ) {
 			// This URL starts with 'https://' because it's the access to wp-admin.
-			return getSiteAdminUrl( getState(), primarySiteId );
+			return getSiteAdminUrl( getState(), primaryOrSelectedSiteId );
 		}
 		return `/home/${ primarySiteSlug }`;
 	}

diff --git a/client/test/root-section.ts b/client/test/root-section.ts
@@ -37,7 +37,7 @@ describe( 'Logged Out Landing Page', () => {
 
 describe( 'Logged In Landing Page', () => {
 	test( 'user with no sites goes to Sites Dashboard', async () => {
-		const state = { currentUser: { id: 1 }, sites: { items: {} } };
+		const state = { currentUser: { id: 1 }, sites: { items: {} }, ui: {} };
 		const { page } = initRouter( { state } );
 
 		page( '/' );
@@ -48,6 +48,7 @@ describe( 'Logged In Landing Page', () => {
 	test( 'user with a primary site but no permissions goes to day stats', async () => {
 		const state = {
 			currentUser: { id: 1, capabilities: { 1: {} }, user: { primary_blog: 1 } },
+			ui: {},
 			sites: {
 				items: {
 					1: {
@@ -67,6 +68,7 @@ describe( 'Logged In Landing Page', () => {
 	test( 'user with a primary site and edit permissions goes to My Home', async () => {
 		const state = {
 			currentUser: { id: 1, capabilities: { 1: { edit_posts: true } }, user: { primary_blog: 1 } },
+			ui: {},
 			sites: {
 				items: {
 					1: {
@@ -86,6 +88,7 @@ describe( 'Logged In Landing Page', () => {
 	test( 'user with a Jetpack site set as their primary site goes to day stats', async () => {
 		const state = {
 			currentUser: { id: 1, capabilities: { 1: { edit_posts: true } }, user: { primary_blog: 1 } },
+			ui: {},
 			sites: {
 				items: {
 					1: {
@@ -115,6 +118,7 @@ describe( 'Logged In Landing Page', () => {
 					'sites-landing-page': { useSitesAsLandingPage: true, updatedAt: 1111 },
 				},
 			},
+			ui: {},
 			sites: {
 				items: {
 					1: {
@@ -135,4 +139,72 @@ describe( 'Logged In Landing Page', () => {
 
 		await waitFor( () => expect( page.current ).toBe( '/sites' ) );
 	} );
+
+	test( 'user with a selected site goes to My Home for Default Style interface', async () => {
+		const state = {
+			currentUser: {
+				id: 1,
+				capabilities: { 1: { edit_posts: true }, 2: { edit_posts: true } },
+				user: { primary_blog: 1 },
+			},
+			ui: { selectedSiteId: 2 },
+			sites: {
+				items: {
+					1: {
+						ID: 1,
+						URL: 'https://test.wordpress.com',
+					},
+					2: {
+						ID: 2,
+						URL: 'https://selected.wordpress.com',
+						options: { wpcom_admin_interface: 'calypso' },
+					},
+				},
+			},
+		};
+		const { page } = initRouter( { state } );
+
+		page( '/' );
+
+		await waitFor( () => expect( page.current ).toBe( '/home/selected.wordpress.com' ) );
+	} );
+
+	test( 'user with a selected site goes to WP Admin Dashboard for Classic Style interface', async () => {
+		const state = {
+			currentUser: {
+				id: 1,
+				capabilities: { 1: { edit_posts: true } },
+				user: { primary_blog: 1 },
+			},
+			ui: { selectedSiteId: 1 },
+			sites: {
+				items: {
+					1: {
+						ID: 1,
+						URL: 'https://test.wordpress.com',
+						options: {
+							wpcom_admin_interface: 'wp-admin',
+							admin_url: 'https://test.wordpress.com/wp-admin/',
+						},
+					},
+				},
+			},
+		};
+
+		const { page } = initRouter( { state } );
+
+		Object.defineProperty( window, 'location', {
+			value: {
+				assign: jest.fn(),
+			},
+		} );
+
+		page( '/' );
+
+		await waitFor( () => {
+			expect( window.location.assign ).toHaveBeenCalledWith(
+				'https://test.wordpress.com/wp-admin/'
+			);
+		} );
+	} );
 } );