function ThankYouContent()

in support-frontend/assets/pages/weekly-subscription-checkout/components/thankYou.tsx [119:234]
113 lines of code
6 McCabe index (conditional complexity)

function ThankYouContent({
	billingPeriod,
	startDate,
	isPending,
	orderIsGift,
	product,
}: PropTypes) {
	const whatHappensNextItems = orderIsGift
		? [
				<span>
					Look out for an email from us confirming your subscription.
				</span>,
				<span>
					We&apos;re unable to contact the gift recipient directly - make sure
					to let them know the gift is on its way.
				</span>,
				<span>
					Each copy will be delivered to the gift recipient&apos;s door.{' '}
					<a className="thank-you-link" href={homeDeliveryUrl}>
						Here&apos;s a reminder of how home delivery works
					</a>
					.
				</span>,
		  ]
		: [
				<span>
					You&apos;ll receive a confirmation email with everything you need to
					know, as well as future communications on how to make the most of your
					subscription and weekly newsletters written by the editors. You can
					opt out at any time via your account.
				</span>,
				<span>
					Your magazine will be delivered to your door. Please allow 1 to 7 days
					after publication date for your magazine to arrive, depending on
					national post services.
				</span>,
		  ];

	useScrollToTop();

	return (
		<div className="thank-you-stage">
			<HeroWrapper
				appearance="custom"
				className={
					!orderIsGift ? styles.heroGuardianWeeklyNonGifting : styles.hero
				}
			>
				<HeroImage orderIsGift={orderIsGift} />
				<HeadingBlock
					overheadingClass="--thankyou"
					overheading="Thank you for supporting our journalism!"
				>
					{getHeading(billingPeriod, isPending, orderIsGift)}
				</HeadingBlock>
			</HeroWrapper>

			<Content>
				{isPending && (
					<Text>
						<LargeParagraph>
							Your subscription is being processed and you will receive an email
							when it goes live.
						</LargeParagraph>
					</Text>
				)}
				<StartDateCopy orderIsGift={orderIsGift} startDate={startDate} />
				<Text title="What happens next?">
					<OrderedList items={whatHappensNextItems} />
				</Text>
			</Content>
			<Content>
				<Text>
					<SansParagraph>
						You can manage your subscription by visiting{' '}
						<a
							href={manageSubsUrl}
							onClick={sendTrackingEventsOnClick({
								id: 'checkout_my_account',
								product: 'Paper',
								componentType: 'ACQUISITIONS_BUTTON',
							})}
						>
							Manage My Account
						</a>
						. For any other queries please visit the{' '}
						<a
							href={helpCentreUrl}
							onClick={sendTrackingEventsOnClick({
								id: 'checkout_help_centre',
								product: 'Paper',
								componentType: 'ACQUISITIONS_BUTTON',
							})}
						>
							Help Centre
						</a>
						.
					</SansParagraph>
				</Text>
			</Content>
			<SubscriptionsSurvey product={product} />
			<Content>
				<Asyncronously
					loader={
						import(
							'components/subscriptionCheckouts/thankYou/marketingConsentContainer'
						)
					}
					render={(MktConsent) => (
						<MktConsent requestPending={false} error={false} />
					)}
				/>
			</Content>
		</div>
	);
}