A4A > Referrals: Manual referrals cleanup

Author: yashwin

client/a8c-for-agencies/components/a4a-migration-offer/index.tsx

@@ -21,8 +21,6 @@ export const A4A_MARKETPLACE_CHECKOUT_LINK = `${ A4A_MARKETPLACE_LINK }/checkout
 export const A4A_MARKETPLACE_ASSIGN_LICENSE_LINK = `${ A4A_MARKETPLACE_LINK }/assign-license`;
 export const A4A_PURCHASES_LINK = '/purchases';
 export const A4A_REFERRALS_LINK = '/referrals';
-export const A4A_REFERRALS_BANK_DETAILS_LINK = '/referrals/bank-details';
-export const A4A_REFERRALS_COMMISSIONS_LINK = '/referrals/commissions';
 export const A4A_REFERRALS_DASHBOARD = `${ A4A_REFERRALS_LINK }/dashboard`;
 export const A4A_REFERRALS_PAYMENT_SETTINGS = `${ A4A_REFERRALS_LINK }/payment-settings`;
 export const A4A_REFERRALS_FAQ = `${ A4A_REFERRALS_LINK }/faq`;

client/a8c-for-agencies/components/a4a-migration-offer/style.scss

@@ -18,7 +18,6 @@ interface StepSectionItemProps {
 	statusProps?: React.ComponentProps< typeof Badge > & { tooltip?: string };
 	className?: string;
 	iconClassName?: string;
-	isNewLayout?: boolean;
 	stepNumber?: number;
 }
 
@@ -30,21 +29,10 @@ export default function StepSectionItem( {
 	statusProps,
 	className,
 	iconClassName,
-	isNewLayout = false,
 	stepNumber,
 }: StepSectionItemProps ) {
 	const status = <StatusBadge statusProps={ statusProps } />;
 
-	const buttonContent = buttonProps && (
-		<div className="step-section-item__button">
-			<Button { ...buttonProps } />
-		</div>
-	);
-
-	const statusContent = statusProps && (
-		<div className="step-section-item__status is-large-screen">{ status }</div>
-	);
-
 	return (
 		<div className={ clsx( 'step-section-item', className ) }>
 			{ icon && (
@@ -58,12 +46,18 @@ export default function StepSectionItem( {
 					<div className="step-section-item__status is-small-screen">{ status }</div>
 				) }
 				<div className="step-section-item__heading">
-					{ heading } { isNewLayout && statusContent }
+					{ heading }
+					{ statusProps && (
+						<div className="step-section-item__status is-large-screen">{ status }</div>
+					) }
 				</div>
 				<div className="step-section-item__description">{ preventWidows( description ) }</div>
-				{ ! isNewLayout && buttonContent }
 			</div>
-			{ isNewLayout ? buttonContent : statusContent }
+			{ buttonProps && (
+				<div className="step-section-item__button">
+					<Button { ...buttonProps } />
+				</div>
+			) }
 		</div>
 	);
 }

client/a8c-for-agencies/components/sidebar-menu/lib/constants.ts

@@ -1,6 +1,7 @@
 @import "@wordpress/base-styles/breakpoints";
 @import "@wordpress/base-styles/mixins";
 @import "@wordpress/base-styles/variables";
+
 .step-section-item {
 	margin-block-end: 16px;
 	border-radius: 4px;
@@ -110,27 +111,6 @@
 	}
 }
 
-.referrals-layout--automated .step-section-item {
-	.step-section-item__button .button {
-		min-width: 120px;
-	}
-
-	.step-section-item__button {
-		@include break-large {
-			margin-block: auto;
-		}
-	}
-
-	.step-section-item__status.is-large-screen {
-		@include break-large {
-			display: inline-flex;
-			position: relative;
-			left: 4px;
-		}
-
-	}
-}
-
 .step-section-item__step-number {
 	display: none;
 	color: var(--color-accent);

client/a8c-for-agencies/components/step-section-item/index.tsx

@@ -31,11 +31,3 @@
 		}
 	}
 }
-
-.referrals-layout--automated,
-.commission-overview__layout-automated {
-	.step-section .step-section__header .step-section__step-heading {
-		font-size: rem(16px);
-	}
-}
-

client/a8c-for-agencies/components/step-section-item/style.scss

@@ -1,6 +1,3 @@
-export const A4A_DOWNLOAD_LINK_ON_GITHUB =
-	'https://github.com/Automattic/automattic-for-agencies-client/releases/download/v0.1.0/automattic-for-agencies-client.zip';
-
 export const REFERRAL_EMAIL_QUERY_PARAM_KEY = 'referral_email';
 
 export const AGENCY_FIRST_PURCHASE_SESSION_STORAGE_KEY = 'a4a_first_purchase';

client/a8c-for-agencies/components/step-section/style.scss

@@ -24,8 +24,6 @@ import {
 	A4A_MARKETPLACE_ASSIGN_LICENSE_LINK,
 	A4A_MARKETPLACE_DOWNLOAD_PRODUCTS_LINK,
 	A4A_REFERRALS_LINK,
-	A4A_REFERRALS_BANK_DETAILS_LINK,
-	A4A_REFERRALS_COMMISSIONS_LINK,
 	A4A_REFERRALS_DASHBOARD,
 	A4A_REFERRALS_PAYMENT_SETTINGS,
 	A4A_REFERRALS_FAQ,
@@ -73,8 +71,6 @@ const MEMBER_ACCESSIBLE_PATHS: Record< string, string[] > = {
 	[ A4A_MARKETPLACE_ASSIGN_LICENSE_LINK ]: [ 'a4a_read_marketplace' ],
 	[ A4A_MARKETPLACE_DOWNLOAD_PRODUCTS_LINK ]: [ 'a4a_read_marketplace' ],
 	[ A4A_REFERRALS_LINK ]: [ 'a4a_read_referrals' ],
-	[ A4A_REFERRALS_BANK_DETAILS_LINK ]: [ 'a4a_read_referrals' ],
-	[ A4A_REFERRALS_COMMISSIONS_LINK ]: [ 'a4a_read_referrals' ],
 	[ A4A_REFERRALS_DASHBOARD ]: [ 'a4a_read_referrals' ],
 	[ A4A_REFERRALS_PAYMENT_SETTINGS ]: [ 'a4a_read_referrals' ],
 	[ A4A_REFERRALS_FAQ ]: [ 'a4a_read_referrals' ],

client/a8c-for-agencies/constants/index.ts

@@ -27,7 +27,6 @@ export default function MigrationsCommissionsEmptyState( {
 	return (
 		<StepSection heading={ translate( 'View your migrated websites and commisions right here.' ) }>
 			<StepSectionItem
-				isNewLayout
 				heading={ translate( "We'll tag the sites we moved for you once they're transferred." ) }
 				description={ preventWidows(
 					translate(
@@ -36,7 +35,6 @@ export default function MigrationsCommissionsEmptyState( {
 				) }
 			/>
 			<StepSectionItem
-				isNewLayout
 				heading={ translate( 'Tag your transferred sites so we can pay you for them.' ) }
 				description={
 					<>

client/a8c-for-agencies/lib/permission.ts

@@ -291,7 +291,6 @@ const PartnerDirectoryDashboard = () => {
 						return (
 							<StepSectionItem
 								key={ application.brand }
-								isNewLayout
 								iconClassName={ clsx( brandMeta.className ) }
 								icon={ brandMeta.icon }
 								heading={ application.brand }
@@ -343,7 +342,6 @@ const PartnerDirectoryDashboard = () => {
 			</div>
 			<StepSection heading={ translate( 'How do I start?' ) }>
 				<StepSectionItem
-					isNewLayout
 					className={
 						currentApplicationStep > 0 ? 'partner-directory-dashboard__checked-step' : ''
 					}
@@ -388,7 +386,6 @@ const PartnerDirectoryDashboard = () => {
 					} }
 				/>
 				<StepSectionItem
-					isNewLayout
 					className={
 						currentApplicationStep > 1 ? 'partner-directory-dashboard__checked-step' : ''
 					}
@@ -408,7 +405,6 @@ const PartnerDirectoryDashboard = () => {
 					} }
 				/>
 				<StepSectionItem
-					isNewLayout
 					stepNumber={ currentApplicationStep > 2 ? undefined : 3 }
 					icon={ currentApplicationStep > 2 ? check : undefined }
 					heading={ translate( 'New clients will find you' ) }

client/a8c-for-agencies/sections/migrations/primary/migrations-commissions/empty-state.tsx

@@ -12,7 +12,7 @@ export const MissingPaymentSettingsNotice = () => {
 	const { data: tipaltiData } = useGetTipaltiPayee();
 	const isPayable = tipaltiData?.IsPayable;
 
-	const { data: referrals } = useFetchReferrals( true );
+	const { data: referrals } = useFetchReferrals();
 
 	const hasReferrals = !! referrals?.length;