Merge pull request #11985 from overleaf/ii-empty-trial-price-section

[web] Checkout page react migration hide empty trial price section

GitOrigin-RevId: a023a48b205e67778827b6a99fbe948c929549f5
This commit is contained in:
ilkin-overleaf
2023-02-28 11:15:57 +02:00
committed by Copybot
parent 9f95c7c2ab
commit 19688a020c
2 changed files with 24 additions and 16 deletions

View File

@@ -2,17 +2,12 @@ import { useTranslation } from 'react-i18next'
import Collaborators from './collaborators'
import FeaturesList from './features-list'
import PriceSummary from './price-summary'
import TrialPrice from './trial-price'
import NoDiscountPrice from './no-discount-price'
import PriceForFirstXPeriod from './price-for-first-x-period'
import TrialCouponSummary from './trial-coupon-summary'
import { usePaymentContext } from '../../../context/payment-context'
function PaymentPreviewPanel() {
const { t } = useTranslation()
const { plan, planName } = usePaymentContext()
const trialPrice = <TrialPrice />
const priceForFirstXPeriod = <PriceForFirstXPeriod />
const noDiscountPrice = <NoDiscountPrice />
return (
<div className="price-feature-description">
@@ -24,16 +19,7 @@ function PaymentPreviewPanel() {
</>
)}
<PriceSummary />
{(trialPrice || priceForFirstXPeriod || noDiscountPrice) && (
<>
<hr className="thin" />
<div className="trial-coupon-summary">
{trialPrice}
{priceForFirstXPeriod}
{noDiscountPrice}
</div>
</>
)}
<TrialCouponSummary />
<hr className="thin" />
<p className="price-cancel-anytime text-center">{t('cancel_anytime')}</p>
</div>

View File

@@ -0,0 +1,22 @@
import TrialPrice from './trial-price'
import NoDiscountPrice from './no-discount-price'
import PriceForFirstXPeriod from './price-for-first-x-period'
function TrialCouponSummary() {
const children = [TrialPrice, NoDiscountPrice, PriceForFirstXPeriod].map(
(Component, index) => <Component key={index} />
)
const showChildren = children.some(child => child.type() != null)
if (!showChildren) return null
return (
<>
<hr className="thin" />
<div className="trial-coupon-summary">{children}</div>
</>
)
}
export default TrialCouponSummary