diff --git a/apps/web/app/(dashboard)/home/(user)/billing/page.tsx b/apps/web/app/(dashboard)/home/(user)/billing/page.tsx
index afc898b82..0b1dccf75 100644
--- a/apps/web/app/(dashboard)/home/(user)/billing/page.tsx
+++ b/apps/web/app/(dashboard)/home/(user)/billing/page.tsx
@@ -60,24 +60,24 @@ async function PersonalAccountBillingPage() {
           </If>
 
           <If condition={data}>
-            {(subscription) => (
+            {(data) => (
               <div
                 className={'mx-auto flex w-full max-w-2xl flex-col space-y-6'}
               >
-                <If condition={data}>
+                {'active' in data ? (
                   <CurrentSubscriptionCard
-                    subscription={data.}
+                    subscription={data}
                     config={billingConfig}
                   />
-                </If>
-
-                <If condition={!data}>
-                  <PersonalAccountCheckoutForm customerId={customerId} />
-
+                ) : (
                   <CurrentLifetimeOrderCard
                     order={data}
                     config={billingConfig}
                   />
+                )}
+
+                <If condition={!data}>
+                  <PersonalAccountCheckoutForm customerId={customerId} />
                 </If>
 
                 <If condition={customerId}>
diff --git a/apps/web/app/(dashboard)/home/[account]/billing/page.tsx b/apps/web/app/(dashboard)/home/[account]/billing/page.tsx
index 8969359dd..0a0da8f16 100644
--- a/apps/web/app/(dashboard)/home/[account]/billing/page.tsx
+++ b/apps/web/app/(dashboard)/home/[account]/billing/page.tsx
@@ -2,6 +2,7 @@ import { ExclamationTriangleIcon } from '@radix-ui/react-icons';
 
 import {
   BillingPortalCard,
+  CurrentLifetimeOrderCard,
   CurrentSubscriptionCard,
 } from '@kit/billing-gateway/components';
 import { Alert, AlertDescription, AlertTitle } from '@kit/ui/alert';
@@ -39,8 +40,7 @@ async function TeamAccountBillingPage({ params }: Params) {
   const workspace = await loadTeamWorkspace(params.account);
   const accountId = workspace.account.id;
 
-  const [subscription, customerId] =
-    await loadTeamAccountBillingPage(accountId);
+  const [data, customerId] = await loadTeamAccountBillingPage(accountId);
 
   const canManageBilling =
     workspace.account.permissions.includes('billing.manage');
@@ -81,23 +81,31 @@ async function TeamAccountBillingPage({ params }: Params) {
       <PageBody>
         <div
           className={cn(`flex w-full flex-col space-y-6`, {
-            'mx-auto max-w-2xl ': subscription,
+            'mx-auto max-w-2xl': data,
           })}
         >
           <If
-            condition={subscription}
+            condition={data}
             fallback={
               <div>
                 <Checkout />
               </div>
             }
           >
-            {(subscription) => (
-              <CurrentSubscriptionCard
-                subscription={subscription}
-                config={billingConfig}
-              />
-            )}
+            {(data) => {
+              if ('active' in data) {
+                return (
+                  <CurrentSubscriptionCard
+                    subscription={data}
+                    config={billingConfig}
+                  />
+                );
+              }
+
+              return (
+                <CurrentLifetimeOrderCard order={data} config={billingConfig} />
+              );
+            }}
           </If>
 
           <BillingPortal />