feat: show the cancel trial UI (#25967)

PostHog · Nov 4, 2024 · ef5fa18 · ef5fa18
1 parent 87562c5
commit ef5fa18
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 11 deletions.
diff --git a/frontend/src/scenes/billing/BillingProductAddon.tsx b/frontend/src/scenes/billing/BillingProductAddon.tsx
@@ -49,6 +49,7 @@ export const BillingProductAddon = ({ addon }: { addon: BillingProductV2AddonTyp
         initiateProductUpgrade,
         setTrialModalOpen,
         activateTrial,
+        cancelTrial,
     } = useActions(billingProductLogic({ product: addon }))
     const { openSupportForm } = useActions(supportLogic)
 
@@ -190,16 +191,15 @@ export const BillingProductAddon = ({ addon }: { addon: BillingProductV2AddonTyp
                                         You're on a trial for this add-on
                                     </LemonTag>
                                 </Tooltip>
-                                {/* Comment out until we can make sure a customer can't activate a trial multiple times */}
-                                {/* <LemonButton
+                                <LemonButton
                                     type="primary"
                                     size="small"
                                     onClick={cancelTrial}
                                     loading={trialLoading}
                                     className="mt-1"
                                 >
                                     Cancel trial
-                                </LemonButton> */}
+                                </LemonButton>
                             </div>
                         ) : addon.included_with_main_product ? (
                             <LemonTag type="completion" icon={<IconCheckCircle />}>
@@ -275,14 +275,18 @@ export const BillingProductAddon = ({ addon }: { addon: BillingProductV2AddonTyp
                             </>
                         )}
                     </div>
-                    {!addon.inclusion_only && !addon.trial && isProrated && !addon.contact_support && (
-                        <p className="mt-2 text-xs text-muted text-right">
-                            Pay ~${prorationAmount} today (prorated) and
-                            <br />
-                            {formatFlatRate(Number(upgradePlan?.unit_amount_usd), upgradePlan?.unit)} every month
-                            thereafter.
-                        </p>
-                    )}
+                    {!addon.inclusion_only &&
+                        !addon.trial &&
+                        isProrated &&
+                        !addon.contact_support &&
+                        !billing?.trial && (
+                            <p className="mt-2 text-xs text-muted text-right">
+                                Pay ~${prorationAmount} today (prorated) and
+                                <br />
+                                {formatFlatRate(Number(upgradePlan?.unit_amount_usd), upgradePlan?.unit)} every month
+                                thereafter.
+                            </p>
+                        )}
                     {!!addon.trial && !!trialExperiment && !billing?.trial && (
                         <p className="mt-2 text-xs text-muted text-right">
                             You'll have {addon.trial.length} days to try it out. Then you'll be charged{' '}

diff --git a/frontend/src/scenes/billing/billingProductLogic.ts b/frontend/src/scenes/billing/billingProductLogic.ts
@@ -394,6 +394,7 @@ export const billingProductLogic = kea<billingProductLogicType>([
                 lemonToast.error('There was an error cancelling your trial. Please try again or contact support.')
             } finally {
                 actions.loadBilling()
+                window.location.reload()
                 actions.setTrialLoading(false)
             }
         },