Improve billing plan lookup (#270)

Retrieve plan from Stripe/LS if not found in billing configuration. Useful for legacy plans.

apps/web/app/home/(user)/billing/page.tsx

@@ -1,3 +1,7 @@
+import { z } from 'zod';
+
+import { PlanSchema, ProductSchema } from '@kit/billing';
+import { resolveProductPlan } from '@kit/billing-gateway';
 import {
   BillingPortalCard,
   CurrentLifetimeOrderCard,
@@ -33,6 +37,23 @@ async function PersonalAccountBillingPage() {
 
   const [data, customerId] = await loadPersonalAccountBillingPageData(user.id);
 
+  let productPlan: {
+    product: ProductSchema;
+    plan: z.infer<typeof PlanSchema>;
+  } | null = null;
+
+  if (data) {
+    const firstLineItem = data.items[0];
+
+    if (firstLineItem) {
+      productPlan = await resolveProductPlan(
+        billingConfig,
+        firstLineItem.variant_id,
+        data.currency,
+      );
+    }
+  }
+
   return (
     <>
       <HomeLayoutPageHeader
@@ -56,12 +77,14 @@ async function PersonalAccountBillingPage() {
                 {'active' in data ? (
                   <CurrentSubscriptionCard
                     subscription={data}
-                    config={billingConfig}
+                    product={productPlan!.product}
+                    plan={productPlan!.plan}
                   />
                 ) : (
                   <CurrentLifetimeOrderCard
                     order={data}
-                    config={billingConfig}
+                    product={productPlan!.product}
+                    plan={productPlan!.plan}
                   />
                 )}
 

apps/web/app/home/[account]/billing/page.tsx

@@ -1,5 +1,8 @@
 import { ExclamationTriangleIcon } from '@radix-ui/react-icons';
+import { z } from 'zod';
 
+import { PlanSchema, ProductSchema } from '@kit/billing';
+import { resolveProductPlan } from '@kit/billing-gateway';
 import {
   BillingPortalCard,
   CurrentLifetimeOrderCard,
@@ -43,6 +46,23 @@ async function TeamAccountBillingPage({ params }: TeamAccountBillingPageProps) {
 
   const [data, customerId] = await loadTeamAccountBillingPage(accountId);
 
+  let productPlan: {
+    product: ProductSchema;
+    plan: z.infer<typeof PlanSchema>;
+  } | null = null;
+
+  if (data) {
+    const firstLineItem = data.items[0];
+
+    if (firstLineItem) {
+      productPlan = await resolveProductPlan(
+        billingConfig,
+        firstLineItem.variant_id,
+        data.currency,
+      );
+    }
+  }
+
   const canManageBilling =
     workspace.account.permissions.includes('billing.manage');
 
@@ -98,13 +118,18 @@ async function TeamAccountBillingPage({ params }: TeamAccountBillingPageProps) {
                 return (
                   <CurrentSubscriptionCard
                     subscription={data}
-                    config={billingConfig}
+                    product={productPlan!.product}
+                    plan={productPlan!.plan}
                   />
                 );
               }
 
               return (
-                <CurrentLifetimeOrderCard order={data} config={billingConfig} />
+                <CurrentLifetimeOrderCard
+                  order={data}
+                  product={productPlan!.product}
+                  plan={productPlan!.plan}
+                />
               );
             }}
           </If>