Marketplace Theme Install: Fix stuck loading screen (take 2) (#97012)

* Marketplace theme install: Fix stuck loading screen

* Marketplace theme install: Fix stuck loading screen

* Handle /with-theme and Theme Showcase scenarios

client/my-sites/checkout/checkout-thank-you/marketplace/use-themes-thank-you-data.tsx

@@ -2,11 +2,19 @@ import page from '@automattic/calypso-router';
 import { addQueryArgs } from '@wordpress/url';
 import { useTranslate } from 'i18n-calypso';
 import { useEffect, useMemo } from 'react';
+import { useQuerySitePurchases } from 'calypso/components/data/query-site-purchases';
 import { useQueryThemes } from 'calypso/components/data/query-theme';
 import { useDispatch, useSelector } from 'calypso/state';
+import {
+	hasLoadedSitePurchasesFromServer,
+	isFetchingSitePurchases,
+} from 'calypso/state/purchases/selectors';
 import { isJetpackSite, getSiteAdminUrl, getSiteOption } from 'calypso/state/sites/selectors';
 import { clearActivated } from 'calypso/state/themes/actions';
-import { getThemes } from 'calypso/state/themes/selectors';
+import {
+	getThemes,
+	isMarketplaceThemeSubscribed as getIsMarketplaceThemeSubscribed,
+} from 'calypso/state/themes/selectors';
 import { hasExternallyManagedThemes as getHasExternallyManagedThemes } from 'calypso/state/themes/selectors/is-externally-managed-theme';
 import { getSelectedSiteId, getSelectedSiteSlug } from 'calypso/state/ui/selectors';
 import { Theme } from 'calypso/types';
@@ -45,6 +53,10 @@ export function useThemesThankYouData(
 		"Your new theme is a reflection of your unique style and personality, and we're thrilled to see it come to life."
 	);
 
+	useQuerySitePurchases( siteId );
+	const isRequestingSitePurchases = useSelector( isFetchingSitePurchases );
+	const hasLoadedSitePurchases = useSelector( hasLoadedSitePurchasesFromServer );
+
 	const dotComThemes = useSelector( ( state ) => getThemes( state, 'wpcom', themeSlugs ) );
 	const dotOrgThemes = useSelector( ( state ) => getThemes( state, 'wporg', themeSlugs ) );
 	const themesList = useMemo(
@@ -117,10 +129,37 @@ export function useThemesThankYouData(
 				( dotComTheme: { id: string } | undefined ) => dotComTheme?.id === theme.id
 			)
 	);
+
+	const themesSubscribed = useSelector( ( state ) =>
+		themeSlugs.filter( ( themeId ) => getIsMarketplaceThemeSubscribed( state, themeId, siteId ) )
+	);
+
+	const hasExternallyManagedThemesSubscribed = themesSubscribed.length > 0;
+
 	const hasExternallyManagedThemes = useSelector( ( state ) =>
 		getHasExternallyManagedThemes( state, themeSlugs )
 	);
-	const isAtomicNeeded = hasDotOrgThemes || hasExternallyManagedThemes;
+
+	useEffect( () => {
+		if (
+			! isRequestingSitePurchases &&
+			hasLoadedSitePurchases &&
+			! hasExternallyManagedThemesSubscribed &&
+			hasExternallyManagedThemes
+		) {
+			page( `/home/${ siteSlug }` );
+		}
+	}, [
+		hasExternallyManagedThemes,
+		hasExternallyManagedThemesSubscribed,
+		isRequestingSitePurchases,
+		siteSlug,
+	] );
+
+	const isAtomicNeeded =
+		hasDotOrgThemes ||
+		( hasExternallyManagedThemes &&
+			( isRequestingSitePurchases || hasExternallyManagedThemesSubscribed ) );
 
 	// Clear completed activated theme request state to avoid displaying the Thanks modal
 	useEffect( () => {
@@ -163,6 +202,7 @@ export function useThemesThankYouData(
 		// Always display the loading screen for the following situations:
 		// - Redirect to the plugin-bundle flow after the theme is activated for Woo themes.
 		// - Redirect to the Theme Details page after the atomic transfer if it's required.
-		! ( continueWithPluginBundle || isAtomicNeeded ),
+		// - Redirect to the /home page if the user removed the externally managed theme from checkout.
+		! ( continueWithPluginBundle || isAtomicNeeded || ! isRequestingSitePurchases ),
 	];
 }