refactor(hosting-server-settings): move to the right place, rename an…

…d a bit clean up

client/components/scheduled-updates/scheduled-updates-gate/index.tsx

@@ -3,7 +3,7 @@ import { FC, ReactNode, FocusEvent, useState } from 'react';
 import { useIsEligibleForFeature } from 'calypso/blocks/plugins-scheduled-updates/hooks/use-is-eligible-for-feature';
 import Notice from 'calypso/components/notice';
 import NoticeAction from 'calypso/components/notice/notice-action';
-import HostingActivateStatus from 'calypso/my-sites/hosting/hosting-activate-status';
+import HostingActivateStatus from 'calypso/hosting/server-settings/hosting-activate-status';
 import { useDispatch, useSelector } from 'calypso/state';
 import { transferInProgress } from 'calypso/state/automated-transfer/constants';
 import { getAutomatedTransferStatus } from 'calypso/state/automated-transfer/selectors';

client/hosting/overview/components/hosting-overview.tsx

@@ -5,7 +5,7 @@ import ActiveDomainsCard from 'calypso/hosting/overview/components/active-domain
 import PlanCard from 'calypso/hosting/overview/components/plan-card';
 import QuickActionsCard from 'calypso/hosting/overview/components/quick-actions-card';
 import SiteBackupCard from 'calypso/hosting/overview/components/site-backup-card';
-import SupportCard from 'calypso/my-sites/hosting/support-card';
+import SupportCard from 'calypso/hosting/server-settings/support-card';
 import { isNotAtomicJetpack } from 'calypso/sites-dashboard/utils';
 import { useSelector } from 'calypso/state';
 import { getSelectedSite } from 'calypso/state/ui/selectors';

client/hosting/overview/controller.tsx

@@ -1,7 +1,7 @@
 import { Context as PageJSContext } from '@automattic/calypso-router';
 import HostingOverview from 'calypso/hosting/overview/components/hosting-overview';
-import HostingActivate from 'calypso/my-sites/hosting/hosting-activate';
-import Hosting from 'calypso/my-sites/hosting/main';
+import HostingActivate from 'calypso/hosting/server-settings/hosting-activate';
+import Hosting from 'calypso/hosting/server-settings/main';
 
 export function hostingOverview( context: PageJSContext, next: () => void ) {
 	context.primary = <HostingOverview />;

client/hosting/overview/index.tsx

@@ -7,13 +7,13 @@ import {
 	redirectIfP2,
 	redirectIfJetpackNonAtomic,
 } from 'calypso/controller';
+import { handleHostingPanelRedirect } from 'calypso/hosting/server-settings/controller';
 import {
 	DOTCOM_HOSTING_CONFIG,
 	DOTCOM_OVERVIEW,
 } from 'calypso/hosting/sites/components/site-preview-pane/constants';
 import { siteDashboard } from 'calypso/hosting/sites/controller';
 import { navigation, siteSelection, sites } from 'calypso/my-sites/controller';
-import { handleHostingPanelRedirect } from 'calypso/my-sites/hosting/controller';
 import { hostingOverview, hostingConfiguration, hostingActivate } from './controller';
 
 export default function () {

client/my-sites/hosting/index.js → client/hosting/server-settings/index.js

@@ -7,6 +7,8 @@ import {
 import { navigation, siteSelection, sites } from 'calypso/my-sites/controller';
 import { handleHostingPanelRedirect, layout, activationLayout } from './controller';
 
+// TODO: remove this old unused code
+// Details - https://a8c.slack.com/archives/C06DN6QQVAQ/p1726157495064039
 export default function () {
 	page( '/hosting-config', siteSelection, sites, makeLayout, clientRender );
 	page(

client/my-sites/hosting/main.js → client/hosting/server-settings/main.js

@@ -20,7 +20,10 @@ import NoticeAction from 'calypso/components/notice/notice-action';
 import { ScrollToAnchorOnMount } from 'calypso/components/scroll-to-anchor-on-mount';
 import PageViewTracker from 'calypso/lib/analytics/page-view-tracker';
 import TrackComponentView from 'calypso/lib/analytics/track-component-view';
+import { TrialAcknowledgeModal } from 'calypso/my-sites/plans/trials/trial-acknowledge/acknowlege-modal';
+import { WithOnclickTrialRequest } from 'calypso/my-sites/plans/trials/trial-acknowledge/with-onclick-trial-request';
 import TrialBanner from 'calypso/my-sites/plans/trials/trial-banner';
+import SiteAdminInterface from 'calypso/my-sites/site-settings/site-admin-interface';
 import { recordTracksEvent } from 'calypso/state/analytics/actions';
 import { fetchAutomatedTransferStatus } from 'calypso/state/automated-transfer/actions';
 import { transferStates } from 'calypso/state/automated-transfer/constants';
@@ -39,9 +42,6 @@ import {
 	getSelectedSiteId,
 	getSelectedSiteSlug,
 } from 'calypso/state/ui/selectors';
-import { TrialAcknowledgeModal } from '../plans/trials/trial-acknowledge/acknowlege-modal';
-import { WithOnclickTrialRequest } from '../plans/trials/trial-acknowledge/with-onclick-trial-request';
-import SiteAdminInterface from '../site-settings/site-admin-interface';
 import CacheCard from './cache-card';
 import HostingActivateStatus from './hosting-activate-status';
 import { HostingUpsellNudge } from './hosting-upsell-nudge';
@@ -119,7 +119,7 @@ const AllCards = ( { isAdvancedHostingDisabled, isBasicHostingDisabled, siteId,
 	return <ShowEnabledFeatureCards cards={ allCards } availableTypes={ availableTypes } />;
 };
 
-const Hosting = ( props ) => {
+const ServerSettings = ( props ) => {
 	const {
 		clickActivate,
 		isECommerceTrial,
@@ -222,7 +222,7 @@ const Hosting = ( props ) => {
 				{ isSiteAtomic && <QuerySites siteId={ siteId } /> }
 				{ isJetpack && <QueryJetpackModules siteId={ siteId } /> }
 				<WrapperComponent>
-					<Layout className="hosting__layout">
+					<Layout className="page-server-settings__layout">
 						<AllCards
 							isAdvancedHostingDisabled={ ! hasSftpFeature || ! isSiteAtomic }
 							isBasicHostingDisabled={ ! hasAtomicFeature || ! isSiteAtomic }
@@ -246,7 +246,7 @@ const Hosting = ( props ) => {
 	const banner = shouldShowUpgradeBanner ? getUpgradeBanner() : getAtomicActivationNotice();
 
 	return (
-		<Main wideLayout className="hosting hosting--is-two-columns">
+		<Main wideLayout className="page-server-settings">
 			{ ! isLoadingSftpData && (
 				<ScrollToAnchorOnMount
 					offset={ HEADING_OFFSET }
@@ -287,8 +287,7 @@ const Hosting = ( props ) => {
 	);
 };
 
-export const clickActivate = () =>
-	recordTracksEvent( 'calypso_hosting_configuration_activate_click' );
+const clickActivate = () => recordTracksEvent( 'calypso_hosting_configuration_activate_click' );
 
 export default connect(
 	( state ) => {
@@ -321,4 +320,4 @@ export default connect(
 		fetchAutomatedTransferStatus,
 		requestSiteById: requestSite,
 	}
-)( localize( WithOnclickTrialRequest( Hosting ) ) );
+)( localize( WithOnclickTrialRequest( ServerSettings ) ) );

client/my-sites/hosting/style.scss → client/hosting/server-settings/style.scss

@@ -2,17 +2,12 @@
 
 $areas: sftp, site-backup, support, phpmyadmin, staging-site, restore-plan-software, cache, web-server-settings, admin-interface-style;
 
-.hosting {
+.page-server-settings {
 	/* Rely on the standard spacing for the underlying elements. */
 	.feature-example {
 		margin-top: 0;
 	}
 
-	.hosting__layout .layout__column,
-	.hosting__layout .layout__column fieldset {
-		min-width: 0;
-	}
-
 	.hosting-card {
 		padding-left: 22px;
 		margin-bottom: 12px;
@@ -23,57 +18,40 @@ $areas: sftp, site-backup, support, phpmyadmin, staging-site, restore-plan-softw
 		margin-bottom: 32px;
 	}
 
-	&--is-two-columns {
-		.hosting__layout {
-			.card {
-				width: 100%;
-
-				@include breakpoint-deprecated( ">1280px" ) {
-					margin-bottom: 0;
-					min-width: 0;
+	.page-server-settings__layout {
+		.layout__column,
+		.layout__column fieldset {
+			min-width: 0;
+		}
 
-					fieldset {
-						min-width: 0;
-					}
-				}
-			}
+		.card {
+			width: 100%;
 
 			@include breakpoint-deprecated( ">1280px" ) {
-				@each $area in $areas {
-					.#{$area}-card {
-						grid-area: $area;
-					}
-				}
+				margin-bottom: 0;
+				min-width: 0;
 
-				box-sizing: border-box;
-				display: grid;
-				grid-template-columns: 1fr 1fr;
-				grid-template-areas:
-					"sftp phpmyadmin"
-					"sftp cache"
-					"restore-plan-software web-server-settings"
-					"admin-interface-style web-server-settings";
+				fieldset {
+					min-width: 0;
+				}
 			}
 		}
-	}
 
-	&:not(.hosting--is-two-columns) {
 		@include breakpoint-deprecated( ">1280px" ) {
-			.hosting__layout {
-				gap: 0;
-
-				.layout__column {
-					box-sizing: border-box;
-					flex-basis: 30%;
-					padding-left: 8px;
-
-					&.hosting__main-layout-col {
-						flex-basis: 70%;
-						padding-left: 0;
-						padding-right: 8px;
-					}
+			@each $area in $areas {
+				.#{$area}-card {
+					grid-area: $area;
 				}
 			}
+
+			box-sizing: border-box;
+			display: grid;
+			grid-template-columns: 1fr 1fr;
+			grid-template-areas:
+				"sftp phpmyadmin"
+				"sftp cache"
+				"restore-plan-software web-server-settings"
+				"admin-interface-style web-server-settings";
 		}
 	}
 

client/hosting/staging-site/index.tsx

@@ -5,10 +5,10 @@ import {
 	redirectIfCurrentUserCannot,
 	redirectToHostingPromoIfNotAtomic,
 } from 'calypso/controller';
+import { handleHostingPanelRedirect } from 'calypso/hosting/server-settings/controller';
 import { DOTCOM_STAGING_SITE } from 'calypso/hosting/sites/components/site-preview-pane/constants';
 import { siteDashboard } from 'calypso/hosting/sites/controller';
 import { navigation, siteSelection, sites } from 'calypso/my-sites/controller';
-import { handleHostingPanelRedirect } from 'calypso/my-sites/hosting/controller';
 import { renderStagingSite } from './controller';
 
 export default function () {

client/me/security-ssh-key/use-update-ssh-key-mutation.ts

@@ -1,7 +1,7 @@
 import { useMutation, UseMutationOptions, useQueryClient } from '@tanstack/react-query';
 import { useCallback } from 'react';
+import { USE_ATOMIC_SSH_KEYS_QUERY_KEY } from 'calypso/hosting/server-settings/sftp-card/use-atomic-ssh-keys';
 import wp from 'calypso/lib/wp';
-import { USE_ATOMIC_SSH_KEYS_QUERY_KEY } from 'calypso/my-sites/hosting/sftp-card/use-atomic-ssh-keys';
 import { SSH_KEY_QUERY_KEY } from './use-ssh-key-query';
 
 interface MutationVariables {

client/my-sites/github-deployments/components/page-shell/index.tsx

@@ -7,7 +7,7 @@ import Main from 'calypso/components/main';
 import NavigationHeader from 'calypso/components/navigation-header';
 import Notice from 'calypso/components/notice';
 import NoticeAction from 'calypso/components/notice/notice-action';
-import HostingActivateStatus from 'calypso/my-sites/hosting/hosting-activate-status';
+import HostingActivateStatus from 'calypso/hosting/server-settings/hosting-activate-status';
 import { useDispatch, useSelector } from 'calypso/state';
 import { transferInProgress } from 'calypso/state/automated-transfer/constants';
 import { getAutomatedTransferStatus } from 'calypso/state/automated-transfer/selectors';

client/my-sites/plugins/plugin-upload/index.jsx

@@ -13,8 +13,8 @@ import FeatureExample from 'calypso/components/feature-example';
 import HeaderCake from 'calypso/components/header-cake';
 import Main from 'calypso/components/main';
 import NavigationHeader from 'calypso/components/navigation-header';
+import HostingActivateStatus from 'calypso/hosting/server-settings/hosting-activate-status';
 import PageViewTracker from 'calypso/lib/analytics/page-view-tracker';
-import HostingActivateStatus from 'calypso/my-sites/hosting/hosting-activate-status';
 import { TrialAcknowledgeModal } from 'calypso/my-sites/plans/trials/trial-acknowledge/acknowlege-modal';
 import { WithOnclickTrialRequest } from 'calypso/my-sites/plans/trials/trial-acknowledge/with-onclick-trial-request';
 import { isHostingTrialSite } from 'calypso/sites-dashboard/utils';

client/my-sites/plugins/plugins-discovery-page/index.jsx

@@ -1,5 +1,5 @@
 import { useSelector } from 'react-redux';
-import HostingActivateStatus from 'calypso/my-sites/hosting/hosting-activate-status';
+import HostingActivateStatus from 'calypso/hosting/server-settings/hosting-activate-status';
 import { TrialAcknowledgeModal } from 'calypso/my-sites/plans/trials/trial-acknowledge/acknowlege-modal';
 import { WithOnclickTrialRequest } from 'calypso/my-sites/plans/trials/trial-acknowledge/with-onclick-trial-request';
 import { isCompatiblePlugin } from 'calypso/my-sites/plugins/plugin-compatibility';

client/my-sites/themes/theme-upload/index.jsx

@@ -27,8 +27,8 @@ import InlineSupportLink from 'calypso/components/inline-support-link';
 import Main from 'calypso/components/main';
 import NavigationHeader from 'calypso/components/navigation-header';
 import WpAdminAutoLogin from 'calypso/components/wpadmin-auto-login';
+import HostingActivateStatus from 'calypso/hosting/server-settings/hosting-activate-status';
 import PageViewTracker from 'calypso/lib/analytics/page-view-tracker';
-import HostingActivateStatus from 'calypso/my-sites/hosting/hosting-activate-status';
 import { TrialAcknowledgeModal } from 'calypso/my-sites/plans/trials/trial-acknowledge/acknowlege-modal';
 import { WithOnclickTrialRequest } from 'calypso/my-sites/plans/trials/trial-acknowledge/with-onclick-trial-request';
 import ActivationModal from 'calypso/my-sites/themes/activation-modal';

client/sites-dashboard/components/wpcom-smp-commands.tsx

@@ -9,9 +9,9 @@ import {
 	useSetEdgeCacheMutation,
 	purgeEdgeCache,
 } from 'calypso/data/hosting/use-cache';
+import { useOpenPhpMyAdmin } from 'calypso/hosting/server-settings/phpmyadmin-card';
 import { navigate } from 'calypso/lib/navigate';
 import wpcom from 'calypso/lib/wp';
-import { useOpenPhpMyAdmin } from 'calypso/my-sites/hosting/phpmyadmin-card';
 import { useDispatch } from 'calypso/state';
 import { clearWordPressCache } from 'calypso/state/hosting/actions';
 import { createNotice, removeNotice } from 'calypso/state/notices/actions';