Merge pull request #761 from Financial-Times/revert-changes-for-7-day…

…-pass-experiment RS-357 Revert changes for 7-day pass experiment
Financial-Times · Sep 18, 2023 · a19d57d · a19d57d
2 parents 2702f16 + 60f9158
commit a19d57d
Show file tree

Hide file tree

Showing 11 changed files with 23 additions and 366 deletions.
diff --git a/components/__snapshots__/package-change.spec.js.snap b/components/__snapshots__/package-change.spec.js.snap
@@ -1,20 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`PackageChange annual render when is7DayPassExperiment is true 1`] = `
-<div class="ncf__package-change">
-  <div class="ncf__package-change__package">
-    <div class="ncf__package-change__content">
-      <p>
-        You have chosen
-        <span class="ncf__strong">
-          Trial
-        </span>
-      </p>
-    </div>
-  </div>
-</div>
-`;
-
 exports[`PackageChange annual render with defaults 1`] = `
 <div class="ncf__package-change">
   <div class="ncf__package-change__package">

diff --git a/components/accept-terms-subscription.jsx b/components/accept-terms-subscription.jsx
@@ -9,7 +9,6 @@ export function AcceptTermsSubscription({
 	isTrial = false,
 	isPrintProduct = false,
 	isSingleTerm = false,
-	is7DayPassExperiment = false,
 	isTransition = false,
 	transitionType = null,
 	isDeferredBilling = false,
@@ -38,56 +37,6 @@ export function AcceptTermsSubscription({
 		required: true,
 	};
 
-	if (is7DayPassExperiment) {
-		return (
-			<div {...divProps}>
-				<ul className="o-typography-list ncf__accept-terms-list">
-					<li>
-						<span className="terms-transition terms-transition--immediate">
-							I give consent for my chosen payment method to be charged
-							automatically.
-						</span>
-					</li>
-					<li>
-						<span className="terms-transition terms-transition--immediate">
-							By placing your order subject to the Terms & Conditions (save for
-							section 2) referred to below, you agree that we may start your
-							7-day pass immediately upon our acceptance of your order and that
-							you are waiving your statutory right to cancel our contract within
-							14 days of confirmation. Your payment is a one-time payment
-							collected at the time of checkout, and cancelling at any point
-							(whether before or after the 14-day period) will not entitle you
-							to a refund.
-						</span>
-					</li>
-					<li>
-						<span className="terms-transition">
-							Please see here for the complete{' '}
-							<a
-								className="ncf__link--external"
-								href="http://help.ft.com/help/legal-privacy/terms-conditions/"
-								target="_blank"
-								rel="noopener noreferrer"
-							>
-								Terms &amp; Conditions
-							</a>
-							.
-						</span>
-					</li>
-				</ul>
-				<label className={labelClassName} htmlFor="termsAcceptance">
-					<input {...inputProps} />
-					<span className="o-forms-input__label">
-						I agree to the above terms &amp; conditions.
-					</span>
-					<p className="o-forms-input__error">
-						Please accept our terms &amp; conditions
-					</p>
-				</label>
-			</div>
-		);
-	}
-
 	const transitionTerms = isTransition && (
 		<>
 			{!isSingleTerm && (
@@ -260,7 +209,6 @@ AcceptTermsSubscription.propTypes = {
 	isTrial: PropTypes.bool,
 	isPrintProduct: PropTypes.bool,
 	isSingleTerm: PropTypes.bool,
-	is7DayPassExperiment: PropTypes.bool,
 	isTransition: PropTypes.bool,
 	transitionType: PropTypes.string,
 	isDeferredBilling: PropTypes.bool,

diff --git a/components/index.js b/components/index.js
@@ -49,7 +49,6 @@ export { Province } from './province';
 export { RegistrationConfirmation } from './registration-confirmation';
 export { Responsibility } from './responsibility';
 export { Section } from './section';
-export { SevenDayPassExperimentConfirmation } from './seven-day-pass-experiment-confirmation';
 export { State } from './state';
 export { Submit } from './submit';
 export { TrialBanner } from './trial-banner';

diff --git a/components/package-change.jsx b/components/package-change.jsx
@@ -5,7 +5,6 @@ export function PackageChange({
 	changePackageUrl,
 	currentPackage,
 	packageDescription,
-	is7DayPassExperiment,
 }) {
 	return (
 		<div className="ncf__package-change">
@@ -21,17 +20,15 @@ export function PackageChange({
 						</p>
 					)}
 				</div>
-				{!is7DayPassExperiment && (
-					<div className="ncf__package-change__actions">
-						<a
-							href={changePackageUrl}
-							className="ncf__button ncf__button--mono ncf__button--baseline"
-							data-trackable="change"
-						>
-							Change
-						</a>
-					</div>
-				)}
+				<div className="ncf__package-change__actions">
+					<a
+						href={changePackageUrl}
+						className="ncf__button ncf__button--mono ncf__button--baseline"
+						data-trackable="change"
+					>
+						Change
+					</a>
+				</div>
 			</div>
 		</div>
 	);
@@ -41,5 +38,4 @@ PackageChange.propTypes = {
 	changePackageUrl: PropTypes.string.isRequired,
 	currentPackage: PropTypes.string.isRequired,
 	packageDescription: PropTypes.string,
-	is7DayPassExperiment: PropTypes.bool,
 };
diff --git a/components/package-change.spec.js b/components/package-change.spec.js
@@ -74,23 +74,6 @@ describe('PackageChange', () => {
 
 				expect(PackageChange).toRenderCorrectly(props);
 			});
-
-			it('render when is7DayPassExperiment is true', () => {
-				const props = {
-					changePackageUrl: 'https://www.ft.com',
-					currentPackage: 'Trial',
-					is7DayPassExperiment: true,
-					terms: [
-						{
-							name: term,
-							price: '£1.00',
-							weeklyPrice: '£1.00',
-						},
-					],
-				};
-
-				expect(PackageChange).toRenderCorrectly(props);
-			});
 		});
 	});
 });
diff --git a/components/package-change.stories.js b/components/package-change.stories.js
@@ -18,11 +18,3 @@ WithPackageDescription.args = {
 	changePackageUrl: 'https://ft.com/products',
 	packageDescription: 'Personalised email briefings and alerts',
 };
-
-export const SevenDayPassExperiment = (args) => <PackageChange {...args} />;
-SevenDayPassExperiment.args = {
-	currentPackage: 'Premium Digital',
-	changePackageUrl: 'https://ft.com/products',
-	packageDescription: 'Personalised email briefings and alerts',
-	is7DayPassExperiment: true,
-};
diff --git a/components/payment-term.jsx b/components/payment-term.jsx
@@ -15,7 +15,6 @@ export function PaymentTerm({
 	largePrice = false,
 	optionsInARow = false,
 	billingCountry = '',
-	is7DayPassExperiment = false,
 }) {
 	/**
 	 * Compute monthly price for given term name
@@ -108,24 +107,11 @@ export function PaymentTerm({
 		},
 		monthly: {
 			title: 'Monthly',
-			price: (price, is7DayPassExperiment) => {
-				const paymentIntervalTextToDisplay = (() => {
-					switch (true) {
-						case is7DayPassExperiment:
-							return ' one-time payment';
-
-						default:
-							return ' per month';
-					}
-				})();
-
-				return (
-					<React.Fragment>
-						<span className="ncf__payment-term__price">{price}</span>
-						{paymentIntervalTextToDisplay}
-					</React.Fragment>
-				);
-			},
+			price: (price) => (
+				<React.Fragment>
+					<span className="ncf__payment-term__price">{price}</span> per month
+				</React.Fragment>
+			),
 			trialPrice: (price) => (
 				<React.Fragment>
 					Unless you cancel during your trial you will be billed{' '}
@@ -134,19 +120,10 @@ export function PaymentTerm({
 				</React.Fragment>
 			),
 			monthlyPrice: () => {},
-			renewsText: (isFixedTermOffer, is7DayPassExperiment) => {
-				const textToDisplay = (() => {
-					switch (true) {
-						case is7DayPassExperiment:
-							return 'This subscription is for 7 days, charged at the outset.';
-
-						case isFixedTermOffer:
-							return 'This subscription is for 3 months, charged monthly. You can cancel at anytime';
-
-						default:
-							return 'Renews monthly unless cancelled';
-					}
-				})();
+			renewsText: (isFixedTermOffer) => {
+				const textToDisplay = isFixedTermOffer
+					? 'This subscription is for 3 months, charged monthly. You can cancel at anytime'
+					: 'Renews monthly unless cancelled';
 
 				return (
 					<p className="ncf__payment-term__renews-text">{textToDisplay}</p>
@@ -242,12 +219,9 @@ export function PaymentTerm({
 				<React.Fragment>
 					{nameMap[option.name] ? (
 						<div className="ncf__payment-term__description">
-							{nameMap[option.name].price(option.price, is7DayPassExperiment)}
+							{nameMap[option.name].price(option.price)}
 							{nameMap[option.name].monthlyPrice(option.monthlyPrice)}
-							{nameMap[option.name].renewsText(
-								isFixedTermOffer,
-								is7DayPassExperiment
-							)}
+							{nameMap[option.name].renewsText(isFixedTermOffer)}
 							{/* Remove this discount text temporarily in favour of monthly price */}
 							{/* <br />Save up to 25% when you pay annually */}
 						</div>
@@ -289,21 +263,11 @@ export function PaymentTerm({
 			const showTrialCopyInTitle =
 				option.isTrial && !isPrintOrBundle && !isEpaper;
 
-			const defaultTitle = (() => {
-				switch (true) {
-					case is7DayPassExperiment:
-						return '';
-
-					case Boolean(option.name && nameMap[option.name]):
-						return nameMap[option.name].title;
-
-					default:
-						return '';
-				}
-			})();
+			const defaultTitle =
+				option.name && nameMap[option.name] ? nameMap[option.name].title : '';
 
 			const title = isFixedTermOffer
-				? [offerDisplayName, defaultTitle].filter(Boolean).join(' - ')
+				? `${offerDisplayName} - ${defaultTitle}`
 				: defaultTitle;
 
 			let termDisplayName = '';

diff --git a/components/payment-term.spec.js b/components/payment-term.spec.js
@@ -153,37 +153,6 @@ describe('PaymentTerm', () => {
 		});
 	});
 
-	describe('given is7DayPassExperiment is true', () => {
-		const options = [
-			{
-				name: 'monthly',
-				price: '$5.00',
-				value: 'monthly',
-				monthlyPrice: '$5.00',
-			},
-		];
-		const wrapper = shallow(
-			<PaymentTerm
-				isFixedTermOffer={true}
-				options={options}
-				offerDisplayName="7-day pass"
-				is7DayPassExperiment={true}
-			/>
-		);
-
-		it('renders renewal text that actually reflects how the 7-day pass is a fixed term subscription with a one-off payment made at the outset', () => {
-			expect(wrapper.find('.ncf__payment-term__renews-text').text()).toMatch(
-				/This subscription is for 7 days, charged at the outset./
-			);
-		});
-
-		it('renders offer name and omits payment term title', () => {
-			expect(wrapper.find('.ncf__payment-term__title').text()).toMatch(
-				'7-day pass'
-			);
-		});
-	});
-
 	describe('getDisplayName', () => {
 		const baseOptions = {
 			name: 'monthly',
@@ -230,22 +199,6 @@ describe('PaymentTerm', () => {
 				);
 			});
 		});
-		describe('7-day pass experiment', () => {
-			const options = [
-				{
-					...baseOptions,
-					isTrial: false,
-				},
-			];
-			it('renders with time period only if trial.option == false', () => {
-				const wrapper = shallow(
-					<PaymentTerm options={options} is7DayPassExperiment={true} />
-				);
-				expect(wrapper.find('.ncf__payment-term__label').text().trim()).toMatch(
-					'£20.00 one-time paymentThis subscription is for 7 days, charged at the outset.'
-				);
-			});
-		});
 	});
 
 	describe('[data-base-amount]', () => {

diff --git a/components/payment-term.stories.js b/components/payment-term.stories.js
@@ -109,26 +109,6 @@ FixedTermOffer.args = {
 	offerDisplayName: 'Mix & Match',
 };
 
-export const SevenDayPassExperimentOffer = (args) => (
-	<div className="ncf">
-		<Fieldset>
-			<PaymentTerm {...args} />
-		</Fieldset>
-	</div>
-);
-SevenDayPassExperimentOffer.args = {
-	options: [
-		{
-			name: 'monthly',
-			price: '$5.00',
-			value: 5.0,
-		},
-	],
-	isFixedTermOffer: true,
-	is7DayPassExperiment: true,
-	offerDisplayName: '7-day pass',
-};
-
 export const RenewOffers = (args) => (
 	<div className="ncf">
 		<Fieldset>