feat(saas): Billing loading state

alifarooq9 · Apr 14, 2024 · f300135 · f300135
1 parent 6a353c7
commit f300135
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 3 deletions.
diff --git a/starterkits/saas/.env.example b/starterkits/saas/.env.example
@@ -38,4 +38,4 @@ UPLOADTHING_ID=""
 # LemonSqueezy keys
 LEMONSQUEEZY_API_KEY=""
 LEMONSQUEEZY_STORE_ID=""
-
+LEMONSQUEEZY_WEBHOOK_SECRET=""
diff --git a/starterkits/saas/src/app/(app)/(user)/org/billing/_constants/page-config.ts b/starterkits/saas/src/app/(app)/(user)/org/billing/_constants/page-config.ts
@@ -0,0 +1,4 @@
+export const orgBillingPageConfig = {
+    title: "Billing",
+    description: "Manage your billing settings and subscription.",
+} as const;
diff --git a/starterkits/saas/src/app/(app)/(user)/org/billing/loading.tsx b/starterkits/saas/src/app/(app)/(user)/org/billing/loading.tsx
@@ -0,0 +1,17 @@
+import { AppPageLoading } from "@/app/(app)/_components/page-loading";
+import { Skeleton } from "@/components/ui/skeleton";
+import { orgBillingPageConfig } from "@/app/(app)/(user)/org/billing/_constants/page-config";
+
+export default function OrgBillingLoading() {
+    return (
+        <AppPageLoading
+            title={orgBillingPageConfig.title}
+            description={orgBillingPageConfig.description}
+        >
+            <div className="grid gap-5">
+                <Skeleton className="h-48 w-full" />
+                <Skeleton className="h-96 w-full" />
+            </div>
+        </AppPageLoading>
+    );
+}
diff --git a/starterkits/saas/src/app/(app)/(user)/org/billing/page.tsx b/starterkits/saas/src/app/(app)/(user)/org/billing/page.tsx
@@ -1,5 +1,6 @@
 import { AvailablePlans } from "@/app/(app)/(user)/org/billing/_components/available-plans";
 import { CurrentPlan } from "@/app/(app)/(user)/org/billing/_components/current-plan";
+import { orgBillingPageConfig } from "@/app/(app)/(user)/org/billing/_constants/page-config";
 import { AppPageShell } from "@/app/(app)/_components/page-shell";
 import { getOrgSubscription } from "@/server/actions/plans/query";
 
@@ -8,8 +9,8 @@ export default async function OrgBillingPage() {
 
     return (
         <AppPageShell
-            title="Billing"
-            description="Manage your billing information"
+            title={orgBillingPageConfig.title}
+            description={orgBillingPageConfig.description}
         >
             <div className="w-full space-y-5">
                 <CurrentPlan subscription={subscription} />