Plans Grid: enable accordion view as non-experimental

apps/editing-toolkit/editing-toolkit-plugin/editor-site-launch/src/launch-steps/plan-step/index.tsx

@@ -19,7 +19,6 @@ import './styles.scss';
 const PlanStep: React.FunctionComponent< LaunchStepProps > = ( { onPrevStep, onNextStep } ) => {
 	const domain = useSelect( ( select ) => select( LAUNCH_STORE ).getSelectedDomain() );
 	const LaunchStep = useSelect( ( select ) => select( LAUNCH_STORE ).getLaunchStep() );
-	const { isExperimental } = useSelect( ( select ) => select( LAUNCH_STORE ).getState() );
 
 	const { updatePlan, setStep } = useDispatch( LAUNCH_STORE );
 
@@ -68,7 +67,7 @@ const PlanStep: React.FunctionComponent< LaunchStepProps > = ( { onPrevStep, onN
 							  }
 							: undefined
 					}
-					isExperimental={ isExperimental }
+					isAccordion
 					selectedFeatures={ selectedFeatures }
 					locale={ window.wpcomEditorSiteLaunch?.locale || 'en' }
 				/>

client/landing/gutenboarding/hooks/use-step-navigation.ts

@@ -1,7 +1,6 @@
 /**
  * External dependencies
  */
-import { isEnabled } from 'calypso/config';
 import { useHistory } from 'react-router-dom';
 import { useSelect, useDispatch } from '@wordpress/data';
 import { useI18n } from '@automattic/react-i18n';
@@ -32,34 +31,26 @@ export default function useStepNavigation(): { goBack: () => void; goNext: () =>
 	const currentStep = useCurrentStep();
 	const { i18nLocale } = useI18n();
 
-	// If the user enters a site title on Intent Capture step we are showing Domains step next.
-	// Else, we're showing Domains step before Plans step.
 	let steps: StepType[];
 
+	// If site title is skipped, we're showing Domains step before Features step. If not, we are showing Domains step next.
 	steps = hasSiteTitle()
-		? [ Step.IntentGathering, Step.Domains, Step.DesignSelection, Step.Style, Step.Plans ]
-		: [ Step.IntentGathering, Step.DesignSelection, Step.Style, Step.Domains, Step.Plans ];
-
-	// When feature picker experiment is enabled, if site title is skipped, we're showing Domains step before Features step.
-	if ( isEnabled( 'gutenboarding/feature-picker' ) ) {
-		steps = hasSiteTitle()
-			? [
-					Step.IntentGathering,
-					Step.Domains,
-					Step.DesignSelection,
-					Step.Style,
-					Step.Features,
-					Step.Plans,
-			  ]
-			: [
-					Step.IntentGathering,
-					Step.DesignSelection,
-					Step.Style,
-					Step.Domains,
-					Step.Features,
-					Step.Plans,
-			  ];
-	}
+		? [
+				Step.IntentGathering,
+				Step.Domains,
+				Step.DesignSelection,
+				Step.Style,
+				Step.Features,
+				Step.Plans,
+		  ]
+		: [
+				Step.IntentGathering,
+				Step.DesignSelection,
+				Step.Style,
+				Step.Domains,
+				Step.Features,
+				Step.Plans,
+		  ];
 
 	// @TODO: move site creation to a separate hook or an action on the ONBOARD store
 	const currentUser = useSelect( ( select ) => select( USER_STORE ).getCurrentUser() );

client/landing/gutenboarding/onboarding-block/edit.tsx

@@ -5,7 +5,6 @@ import * as React from 'react';
 import { Redirect, Switch, Route, useLocation } from 'react-router-dom';
 import type { BlockEditProps } from '@wordpress/blocks';
 import { useSelect } from '@wordpress/data';
-import { isEnabled } from 'calypso/config';
 
 /**
  * Internal dependencies
@@ -100,11 +99,7 @@ const OnboardingEdit: React.FunctionComponent< BlockEditProps< Attributes > > =
 				</Route>
 
 				<Route path={ makePath( Step.Features ) }>
-					{ canUseStyleStep() && isEnabled( 'gutenboarding/feature-picker' ) ? (
-						<Features />
-					) : (
-						redirectToLatestStep
-					) }
+					{ canUseStyleStep() ? <Features /> : redirectToLatestStep }
 				</Route>
 
 				<Route path={ makePath( Step.Domains ) }>

client/landing/gutenboarding/onboarding-block/plans/index.tsx

@@ -2,7 +2,6 @@
  * External dependencies
  */
 import * as React from 'react';
-import { isEnabled } from 'calypso/config';
 import { useHistory } from 'react-router-dom';
 import { useSelect, useDispatch } from '@wordpress/data';
 import { useI18n } from '@automattic/react-i18n';
@@ -107,7 +106,7 @@ const PlansStep: React.FunctionComponent< Props > = ( { isModal } ) => {
 				currentDomain={ domain }
 				onPlanSelect={ handlePlanSelect }
 				onPickDomainClick={ handlePickDomain }
-				isExperimental={ isEnabled( 'gutenboarding/feature-picker' ) }
+				isAccordion
 				selectedFeatures={ selectedFeatures }
 				locale={ locale }
 			/>

packages/plans-grid/src/plans-grid/index.tsx

@@ -32,7 +32,7 @@ export interface Props {
 	onPickDomainClick?: () => void;
 	currentDomain?: DomainSuggestions.DomainSuggestion;
 	disabledPlans?: { [ planSlug: string ]: string };
-	isExperimental?: boolean;
+	isAccordion?: boolean;
 	locale: string;
 }
 
@@ -44,20 +44,18 @@ const PlansGrid: React.FunctionComponent< Props > = ( {
 	onPlanSelect,
 	onPickDomainClick,
 	disabledPlans,
-	isExperimental,
+	isAccordion,
 	locale,
 } ) => {
-	// Note: isExperimental prop would be always false until "gutenboarding/feature-picker" feature flag is enabled
-	// and Gutenboarding flow is started with ?latest query param
-	isExperimental && debug( 'PlansGrid experimental version is active' );
+	isAccordion && debug( 'PlansGrid accordion version is active' );
 
 	return (
 		<div className="plans-grid">
 			{ header && <div className="plans-grid__header">{ header }</div> }
 
 			<div className="plans-grid__table">
 				<div className="plans-grid__table-container">
-					{ isExperimental ? (
+					{ isAccordion ? (
 						<PlansAccordion
 							selectedFeatures={ selectedFeatures }
 							selectedPlanSlug={ currentPlan?.storeSlug ?? '' }