Adjusted Per seat billing and added example to the sample schema

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

@@ -50,7 +50,7 @@ async function PersonalAccountBillingPage() {
       />
 
       <PageBody>
-        <div className={'flex flex-col space-y-8'}>
+        <div className={'flex flex-col space-y-4'}>
           <If condition={!data}>
             <PersonalAccountCheckoutForm customerId={customerId} />
 

apps/web/app/(dashboard)/home/[account]/billing/_lib/server/team-billing.service.ts

@@ -242,7 +242,11 @@ export class TeamBillingService {
     }> = [];
 
     for (const lineItem of lineItems) {
-      if (lineItem.type === 'per-seat') {
+      // check if the line item is a per seat type
+      const isPerSeat = lineItem.type === 'per_seat';
+
+      if (isPerSeat) {
+        // get the current number of members in the account
         const quantity = await this.getCurrentMembersCount(accountId);
 
         const item = {
@@ -254,6 +258,7 @@ export class TeamBillingService {
       }
     }
 
+    // set initial quantity for the line items
     return variantQuantities;
   }
 

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

@@ -80,7 +80,7 @@ async function TeamAccountBillingPage({ params }: Params) {
 
       <PageBody>
         <div
-          className={cn(`flex w-full flex-col space-y-6`, {
+          className={cn(`flex w-full flex-col space-y-4`, {
             'mx-auto max-w-2xl': data,
           })}
         >

apps/web/app/(dashboard)/home/[account]/billing/return/page.tsx

@@ -54,18 +54,24 @@ async function ReturnCheckoutSessionPage({ searchParams }: SessionPageProps) {
         />
       </div>
 
-      <div
-        className={
-          'fixed left-0 top-0 w-full bg-background/30 backdrop-blur-sm' +
-          ' !m-0 h-full'
-        }
-      />
+      <BlurryBackdrop />
     </>
   );
 }
 
 export default withI18n(ReturnCheckoutSessionPage);
 
+function BlurryBackdrop() {
+  return (
+    <div
+      className={
+        'fixed left-0 top-0 w-full bg-background/30 backdrop-blur-sm' +
+        ' !m-0 h-full'
+      }
+    />
+  );
+}
+
 async function loadCheckoutSession(sessionId: string) {
   const client = getSupabaseServerComponentClient();
   const { error } = await requireUser(client);

apps/web/config/billing.sample.config.ts

@@ -26,7 +26,6 @@ export default createBillingSchema({
         {
           name: 'Starter Monthly',
           id: 'starter-monthly',
-          trialDays: 7,
           paymentType: 'recurring',
           interval: 'month',
           lineItems: [
@@ -36,6 +35,26 @@ export default createBillingSchema({
               cost: 9.99,
               type: 'flat',
             },
+            {
+              id: 'price_1P8N0zI1i3VnbZTqtUPc1Zvr',
+              name: 'Addon 3',
+              cost: 0,
+              type: 'per_seat',
+              tiers: [
+                {
+                  upTo: 1,
+                  cost: 0,
+                },
+                {
+                  upTo: 5,
+                  cost: 4,
+                },
+                {
+                  upTo: 'unlimited',
+                  cost: 3,
+                },
+              ],
+            },
           ],
         },
         {

apps/web/supabase/migrations/20221215192558_schema.sql

@@ -1378,6 +1378,7 @@ on conflict (
     -- Upsert subscription items
     with item_data as (
         select
+            (line_item ->> 'id')::varchar as line_item_id,
             (line_item ->> 'product_id')::varchar as prod_id,
             (line_item ->> 'variant_id')::varchar as var_id,
             (line_item ->> 'type')::public.subscription_item_type as type,
@@ -1388,6 +1389,7 @@ on conflict (
         from
             jsonb_array_elements(line_items) as line_item)
     insert into public.subscription_items(
+        id,
         subscription_id,
         product_id,
         variant_id,
@@ -1397,6 +1399,7 @@ on conflict (
         interval,
         interval_count)
     select
+        line_item_id,
         target_subscription_id,
         prod_id,
         var_id,
@@ -1436,6 +1439,7 @@ grant execute on function public.upsert_subscription(uuid, varchar,
  * -------------------------------------------------------
  */
 create table if not exists public.subscription_items(
+    id varchar(255) not null primary key,
     subscription_id text references public.subscriptions(id) on
 	delete cascade not null,
     product_id varchar(255) not null,