diff --git a/client/my-sites/checkout/src/components/CheckoutMoneyBackGuarantee.jsx b/client/my-sites/checkout/src/components/CheckoutMoneyBackGuarantee.tsx similarity index 90% rename from client/my-sites/checkout/src/components/CheckoutMoneyBackGuarantee.jsx rename to client/my-sites/checkout/src/components/CheckoutMoneyBackGuarantee.tsx index 7bfecc9f51e808..43c4cfaf62dfca 100644 --- a/client/my-sites/checkout/src/components/CheckoutMoneyBackGuarantee.jsx +++ b/client/my-sites/checkout/src/components/CheckoutMoneyBackGuarantee.tsx @@ -1,4 +1,5 @@ import { isChargeback, isCredits } from '@automattic/calypso-products'; +import { ResponseCart } from '@automattic/shopping-cart'; import styled from '@emotion/styled'; import { CheckoutSummaryRefundWindows } from './wp-checkout-order-summary'; @@ -38,7 +39,7 @@ const CheckoutMoneyBackGuaranteeWrapper = styled.div` } `; -export function CheckoutMoneyBackGuarantee( { cart } ) { +export function CheckoutMoneyBackGuarantee( { cart }: { cart: ResponseCart } ) { // Return early if the cart is only Chargebacks fees if ( cart.products.every( isChargeback || isCredits ) ) { return null; diff --git a/client/my-sites/checkout/src/components/bundled-domain-notice.jsx b/client/my-sites/checkout/src/components/bundled-domain-notice.tsx similarity index 83% rename from client/my-sites/checkout/src/components/bundled-domain-notice.jsx rename to client/my-sites/checkout/src/components/bundled-domain-notice.tsx index 5073bf8fcd18ec..804664c1242a30 100644 --- a/client/my-sites/checkout/src/components/bundled-domain-notice.jsx +++ b/client/my-sites/checkout/src/components/bundled-domain-notice.tsx @@ -1,5 +1,6 @@ import { isMonthly, getPlan, getBillingMonthsForTerm } from '@automattic/calypso-products'; import { localizeUrl } from '@automattic/i18n-utils'; +import { ResponseCart } from '@automattic/shopping-cart'; import { REGISTER_DOMAIN } from '@automattic/urls'; import { translate } from 'i18n-calypso'; import { @@ -12,34 +13,35 @@ import { } from 'calypso/lib/cart-values/cart-items'; import CheckoutTermsItem from 'calypso/my-sites/checkout/src/components/checkout-terms-item'; -/* eslint-disable wpcalypso/jsx-classname-namespace */ - -function getBillingMonthsForPlan( cart ) { +function getBillingMonthsForPlan( cart: ResponseCart ) { const plans = cart.products .map( ( { product_slug } ) => getPlan( product_slug ) ) .filter( Boolean ); const plan = plans?.[ 0 ]; + if ( ! plan?.term ) { + return 0; + } try { - return getBillingMonthsForTerm( plan?.term ); + return getBillingMonthsForTerm( plan.term ); } catch ( e ) { return 0; } } -function hasBiennialPlan( cart ) { +function hasBiennialPlan( cart: ResponseCart ) { return getBillingMonthsForPlan( cart ) === 24; } -function hasTriennialPlan( cart ) { +function hasTriennialPlan( cart: ResponseCart ) { return getBillingMonthsForPlan( cart ) === 36; } -function hasMonthlyPlan( cart ) { +function hasMonthlyPlan( cart: ResponseCart ) { return cart.products.some( ( { product_slug } ) => isMonthly( product_slug ) ); } -function getCopyForBillingTerm( cart ) { +function getCopyForBillingTerm( cart: ResponseCart ) { if ( hasBiennialPlan( cart ) ) { return translate( 'Purchasing a two-year subscription to a WordPress.com plan gives you two years of access to your plan’s features and one year of a custom domain name.' @@ -57,10 +59,8 @@ function getCopyForBillingTerm( cart ) { /** * Use showBundledDomainNotice to manage BundleDomainNotice visibility when called. - * @param {import('@automattic/shopping-cart').ResponseCart} cart - * @returns boolean */ -export const showBundledDomainNotice = ( cart ) => { +export const showBundledDomainNotice = ( cart: ResponseCart ): boolean => { const isGiftPurchase = cart.is_gift_purchase; if ( isGiftPurchase ) { @@ -86,7 +86,7 @@ export const showBundledDomainNotice = ( cart ) => { return true; }; -export default function BundledDomainNotice( { cart } ) { +export default function BundledDomainNotice( { cart }: { cart: ResponseCart } ) { const domainRegistrationLink = ( ); diff --git a/client/my-sites/checkout/src/components/prepurchase-notices/index.tsx b/client/my-sites/checkout/src/components/prepurchase-notices/index.tsx index 6e59d6cb432a4a..858a14b49e1f40 100644 --- a/client/my-sites/checkout/src/components/prepurchase-notices/index.tsx +++ b/client/my-sites/checkout/src/components/prepurchase-notices/index.tsx @@ -146,7 +146,12 @@ const PrePurchaseNotices = () => { // but this site does not have the minimum plugin version. const backupSlugInCart = cartItemSlugs.find( isJetpackBackupSlug ); const backupProductInCart = backupSlugInCart && getProductFromSlug( backupSlugInCart ); - if ( ! siteHasBackupMinimumPluginVersion && backupProductInCart ) { + if ( + ! siteHasBackupMinimumPluginVersion && + backupProductInCart && + // getProductFromSlug returns a string if it fails, so we want to check for that. + typeof backupProductInCart !== 'string' + ) { return ( { +const getMessage = ( + translate: LocalizeProps[ 'translate' ], + product: Product, + siteVersion: number | string | undefined, + minVersion: number | string +) => { const displayName = getJetpackProductDisplayName( product ); if ( ! siteVersion ) { @@ -40,14 +46,25 @@ const getMessage = ( translate, product, siteVersion, minVersion ) => { ); }; -const JetpackPluginRequiredVersionNotice = ( { product, minVersion } ) => { +const JetpackPluginRequiredVersionNotice = ( { + product, + minVersion, +}: { + product: Product; + minVersion: string | number; +} ) => { const translate = useTranslate(); const siteId = useSelector( getSelectedSiteId ); - const siteJetpackVersion = useSelector( ( state ) => + let siteJetpackVersion = useSelector( ( state ) => getSiteOption( state, siteId, 'jetpack_version' ) ); + // Validate that the site option isn't something unexpected for some reason. + if ( typeof siteJetpackVersion !== 'string' && typeof siteJetpackVersion !== 'number' ) { + siteJetpackVersion = undefined; + } + const pluginUpgradeUrl = useSelector( ( state ) => getSiteAdminUrl( state, siteId, 'update-core.php#update-plugins-table' ) ); diff --git a/client/my-sites/checkout/src/components/prepurchase-notices/prepurchase-notice.jsx b/client/my-sites/checkout/src/components/prepurchase-notices/prepurchase-notice.tsx similarity index 58% rename from client/my-sites/checkout/src/components/prepurchase-notices/prepurchase-notice.jsx rename to client/my-sites/checkout/src/components/prepurchase-notices/prepurchase-notice.tsx index cbd9bc5ab822d3..a63fd19c029072 100644 --- a/client/my-sites/checkout/src/components/prepurchase-notices/prepurchase-notice.jsx +++ b/client/my-sites/checkout/src/components/prepurchase-notices/prepurchase-notice.tsx @@ -1,6 +1,15 @@ +import { ReactNode } from 'react'; import './style.scss'; -const PrePurchaseNotice = ( { message, linkUrl, linkText } ) => ( +const PrePurchaseNotice = ( { + message, + linkUrl, + linkText, +}: { + message: ReactNode; + linkUrl: string | null | undefined; + linkText: ReactNode | null | undefined; +} ) => (

{ message }

{ linkUrl && linkText && ( diff --git a/client/my-sites/checkout/src/components/titan-terms-of-service.jsx b/client/my-sites/checkout/src/components/titan-terms-of-service.tsx similarity index 86% rename from client/my-sites/checkout/src/components/titan-terms-of-service.jsx rename to client/my-sites/checkout/src/components/titan-terms-of-service.tsx index 8c513b83138fbc..1d30c03ecc47a9 100644 --- a/client/my-sites/checkout/src/components/titan-terms-of-service.jsx +++ b/client/my-sites/checkout/src/components/titan-terms-of-service.tsx @@ -1,11 +1,16 @@ -import { localize } from 'i18n-calypso'; +import { ResponseCart } from '@automattic/shopping-cart'; +import { LocalizeProps, localize } from 'i18n-calypso'; import { hasTitanMail } from 'calypso/lib/cart-values/cart-items'; import { getTitanProductName } from 'calypso/lib/titan'; import CheckoutTermsItem from 'calypso/my-sites/checkout/src/components/checkout-terms-item'; -/* eslint-disable wpcalypso/jsx-classname-namespace */ - -function TitanTermsOfService( { cart, translate } ) { +function TitanTermsOfService( { + cart, + translate, +}: { + cart: ResponseCart; + translate: LocalizeProps[ 'translate' ]; +} ) { if ( ! hasTitanMail( cart ) ) { return null; } diff --git a/client/my-sites/checkout/src/components/upsell.jsx b/client/my-sites/checkout/src/components/upsell.tsx similarity index 70% rename from client/my-sites/checkout/src/components/upsell.jsx rename to client/my-sites/checkout/src/components/upsell.tsx index 5e6cd74ca09742..e682b05f1788b2 100644 --- a/client/my-sites/checkout/src/components/upsell.jsx +++ b/client/my-sites/checkout/src/components/upsell.tsx @@ -1,4 +1,4 @@ -export function UpSellCoupon( { onClick } ) { +export function UpSellCoupon( { onClick }: { onClick: () => void } ) { return (

Exclusive offer