From b64bf19d83748254ea7efc65b13628c15cc94397 Mon Sep 17 00:00:00 2001
From: Matt Aitken <matt@mattaitken.com>
Date: Mon, 4 Dec 2023 13:41:53 +0000
Subject: [PATCH] =?UTF-8?q?Fix=20for=20the=20period=20end=20when=20you?=
 =?UTF-8?q?=E2=80=99ve=20canceled?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../routes/_app.orgs.$organizationSlug.billing/route.tsx   | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.billing/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.billing/route.tsx
index fa0ca526c..4645bf7a7 100644
--- a/apps/webapp/app/routes/_app.orgs.$organizationSlug.billing/route.tsx
+++ b/apps/webapp/app/routes/_app.orgs.$organizationSlug.billing/route.tsx
@@ -52,7 +52,7 @@ export const handle: Handle = {
   breadcrumb: (match) => <BreadcrumbLink to={match.pathname} title="Usage & Billing" />,
 };
 
-function planLabel(subscription?: ActiveSubscription) {
+function planLabel(subscription: ActiveSubscription | undefined, periodEnd: Date) {
   if (!subscription) {
     return "You're currently on the Free plan";
   }
@@ -66,8 +66,7 @@ function planLabel(subscription?: ActiveSubscription) {
     return (
       <>
         You're on the {costDescription} {subscription.plan.title} plan until{" "}
-        <DateTime includeTime={false} date={subscription.canceledAt} /> when you'll be on the Free
-        plan
+        <DateTime includeTime={false} date={periodEnd} /> when you'll be on the Free plan
       </>
     );
   }
@@ -117,7 +116,7 @@ export default function Page() {
             {currentPlan?.subscription && (
               <PageInfoProperty
                 icon={<ReceiptRefundIcon className="h-4 w-4 text-green-600" />}
-                value={planLabel(currentPlan.subscription)}
+                value={planLabel(currentPlan.subscription, currentPlan.usage.periodEnd)}
               />
             )}
             {currentPlan?.subscription?.isPaying && (