@@ -100,11 +100,15 @@ export default function BillingPage() {
100100
101101 // Calculate if minimum term has been met for managed plans
102102 const hasMetMinimumTerm = ( ) => {
103- if ( planType !== 'managed' || ! ( 'currentPeriodStart' in subscription ) ) {
103+ if (
104+ planType !== 'managed' ||
105+ ! ( 'currentPeriodStart' in subscription ) ||
106+ subscription . currentPeriodStart == null
107+ ) {
104108 return true ;
105109 }
106110
107- const startDate = new Date ( subscription . currentPeriodStart ! * 1000 ) ;
111+ const startDate = new Date ( subscription . currentPeriodStart * 1000 ) ;
108112 const now = new Date ( ) ;
109113 const monthsElapsed =
110114 ( now . getFullYear ( ) - startDate . getFullYear ( ) ) * 12 + ( now . getMonth ( ) - startDate . getMonth ( ) ) ;
@@ -116,11 +120,15 @@ export default function BillingPage() {
116120
117121 // Calculate when cancellation will be available
118122 const getCancellationAvailableDate = ( ) => {
119- if ( planType !== 'managed' || ! ( 'currentPeriodStart' in subscription ) ) {
123+ if (
124+ planType !== 'managed' ||
125+ ! ( 'currentPeriodStart' in subscription ) ||
126+ subscription . currentPeriodStart == null
127+ ) {
120128 return null ;
121129 }
122130
123- const startDate = new Date ( subscription . currentPeriodStart ! * 1000 ) ;
131+ const startDate = new Date ( subscription . currentPeriodStart * 1000 ) ;
124132 const cancellationDate = new Date ( startDate ) ;
125133 cancellationDate . setMonth (
126134 cancellationDate . getMonth ( ) + ( planConfig . managed . minimumTermMonths || 12 ) ,
@@ -318,12 +326,17 @@ export default function BillingPage() {
318326
319327 // 3. Active Subscription View (Starter or Managed)
320328 const renderTrialWarning = ( ) => {
321- if ( ! isTrialing || ! ( 'currentPeriodEnd' in subscription ) ) return null ;
329+ if (
330+ ! isTrialing ||
331+ ! ( 'currentPeriodEnd' in subscription ) ||
332+ subscription . currentPeriodEnd == null
333+ )
334+ return null ;
322335
323336 const daysLeft = Math . ceil (
324- ( subscription . currentPeriodEnd ! * 1000 - Date . now ( ) ) / ( 1000 * 60 * 60 * 24 ) ,
337+ ( subscription . currentPeriodEnd * 1000 - Date . now ( ) ) / ( 1000 * 60 * 60 * 24 ) ,
325338 ) ;
326- const trialEndDate = formatDate ( subscription . currentPeriodEnd ! ) ;
339+ const trialEndDate = formatDate ( subscription . currentPeriodEnd ) ;
327340
328341 return (
329342 < Alert >
@@ -456,17 +469,19 @@ export default function BillingPage() {
456469 </ div >
457470 ) }
458471
459- { planType === 'managed' && ! canCancelSubscription && (
460- < div className = "flex items-center justify-between" >
461- < div className = "flex items-center gap-2" >
462- < Lock className = "h-4 w-4 text-muted-foreground" />
463- < span className = "text-sm font-medium" > Minimum Term</ span >
472+ { planType === 'managed' &&
473+ ! canCancelSubscription &&
474+ getCancellationAvailableDate ( ) && (
475+ < div className = "flex items-center justify-between" >
476+ < div className = "flex items-center gap-2" >
477+ < Lock className = "h-4 w-4 text-muted-foreground" />
478+ < span className = "text-sm font-medium" > Minimum Term</ span >
479+ </ div >
480+ < span className = "text-sm text-muted-foreground" >
481+ 12 months (ends { formatDate ( getCancellationAvailableDate ( ) ! ) } )
482+ </ span >
464483 </ div >
465- < span className = "text-sm text-muted-foreground" >
466- 12 months (ends { formatDate ( getCancellationAvailableDate ( ) ! ) } )
467- </ span >
468- </ div >
469- ) }
484+ ) }
470485 </ div >
471486
472487 < Separator />
@@ -515,7 +530,9 @@ export default function BillingPage() {
515530 </ TooltipTrigger >
516531 < TooltipContent >
517532 < p > This plan requires a 12-month minimum commitment.</ p >
518- < p > You can cancel after { formatDate ( getCancellationAvailableDate ( ) ! ) } .</ p >
533+ { getCancellationAvailableDate ( ) && (
534+ < p > You can cancel after { formatDate ( getCancellationAvailableDate ( ) ! ) } .</ p >
535+ ) }
519536 </ TooltipContent >
520537 </ Tooltip >
521538 ) )
0 commit comments