Merge pull request #11 from API-200/feature/payments

Feature/payments

Author: MaximBudnik

packages/backend/src/modules/base/checkUsage.ts

@@ -1,12 +1,21 @@
+import { PLANS } from '@utils/constants';
 import { supabase } from '../../utils/supabase';
-import { BASIC_PLAN_MAX_REQUESTS } from '../../utils/constants';
 
 export async function checkUsage(
     userId: string,
 ): Promise<{ error?: string; status?: number }> {
+
+    const { data: proSubscriptionExists, error: subscriptionCheckError } = await supabase.rpc('check_subscription', { p_user_id: userId });
+    const maxRequests = proSubscriptionExists ? PLANS.PRO.REQUESTS_PER_MONTH : PLANS.BASIC.REQUESTS_PER_MONTH;
+
+    if (subscriptionCheckError) {
+        console.error('Error checking subscription:', subscriptionCheckError);
+        return { error: 'API200 Error: Internal server error', status: 500 };
+    }
+
     const { data, error } = await supabase.rpc('increment_usage', {
         p_user_id: userId,
-        p_max_requests: BASIC_PLAN_MAX_REQUESTS,
+        p_max_requests: maxRequests,
     });
 
     if (error) {
@@ -19,7 +28,7 @@ export async function checkUsage(
 
     if (!result?.allowed) {
         return {
-            error: `API200 Error: Monthly usage limit exceeded (${result?.c_count}/${BASIC_PLAN_MAX_REQUESTS})`,
+            error: `API200 Error: Monthly usage limit exceeded (${result?.c_count}/${maxRequests})`,
             status: 429,
         };
     }

packages/backend/src/utils/constants.ts

@@ -1,2 +1,10 @@
-export const BASIC_PLAN_MAX_REQUESTS = 1000;
 export const DAY = 24 * 60 * 60 * 1000;
+
+export const PLANS = {
+    BASIC: {
+        REQUESTS_PER_MONTH: 100
+    },
+    PRO: {
+        REQUESTS_PER_MONTH: 10000
+    }
+} as const;

packages/backend/src/utils/database.types.ts

@@ -30,6 +30,27 @@ export type Database = {
         }
         Relationships: []
       }
+      customers: {
+        Row: {
+          created_at: string
+          customer_id: string
+          email: string
+          updated_at: string
+        }
+        Insert: {
+          created_at?: string
+          customer_id: string
+          email: string
+          updated_at?: string
+        }
+        Update: {
+          created_at?: string
+          customer_id?: string
+          email?: string
+          updated_at?: string
+        }
+        Relationships: []
+      }
       endpoints: {
         Row: {
           cache_enabled: boolean
@@ -314,23 +335,73 @@ export type Database = {
         }
         Relationships: []
       }
+      subscriptions: {
+        Row: {
+          billing_cycle: string
+          created_at: string
+          customer_id: string
+          next_billed_at: string
+          price_id: string | null
+          product_id: string | null
+          scheduled_change: string | null
+          subscription_id: string
+          subscription_status: string
+          updated_at: string
+        }
+        Insert: {
+          billing_cycle: string
+          created_at?: string
+          customer_id: string
+          next_billed_at: string
+          price_id?: string | null
+          product_id?: string | null
+          scheduled_change?: string | null
+          subscription_id: string
+          subscription_status: string
+          updated_at?: string
+        }
+        Update: {
+          billing_cycle?: string
+          created_at?: string
+          customer_id?: string
+          next_billed_at?: string
+          price_id?: string | null
+          product_id?: string | null
+          scheduled_change?: string | null
+          subscription_id?: string
+          subscription_status?: string
+          updated_at?: string
+        }
+        Relationships: [
+          {
+            foreignKeyName: "subscriptions_customer_id_fkey"
+            columns: ["customer_id"]
+            isOneToOne: false
+            referencedRelation: "customers"
+            referencedColumns: ["customer_id"]
+          },
+        ]
+      }
       usages: {
         Row: {
           billing_started_at: string
           calls_count: number
           id: number
+          updated_at: string | null
           user_id: string
         }
         Insert: {
           billing_started_at?: string
           calls_count?: number
           id?: number
+          updated_at?: string | null
           user_id: string
         }
         Update: {
           billing_started_at?: string
           calls_count?: number
           id?: number
+          updated_at?: string | null
           user_id?: string
         }
         Relationships: []
@@ -340,6 +411,10 @@ export type Database = {
       [_ in never]: never
     }
     Functions: {
+      check_subscription: {
+        Args: { p_user_id: string }
+        Returns: boolean
+      }
       get_route_data: {
         Args: {
           p_service_name: string

packages/dashboard/package.json

@@ -14,6 +14,8 @@
     "@hookform/resolvers": "^3.10.0",
     "@keyv/redis": "^4.3.2",
     "@monaco-editor/react": "^4.7.0",
+    "@paddle/paddle-js": "^1.4.1",
+    "@paddle/paddle-node-sdk": "^2.7.1",
     "@radix-ui/react-accordion": "^1.2.3",
     "@radix-ui/react-alert-dialog": "^1.1.6",
     "@radix-ui/react-avatar": "^1.1.3",

packages/dashboard/pnpm-lock.yaml

@@ -1,7 +1,7 @@
 "use client"
 import Link from "next/link"
 import { usePathname } from "next/navigation"
-import { AlertCircleIcon, Book, Globe, KeyRound, Layers } from 'lucide-react'
+import {AlertCircleIcon, Book, CreditCard, Globe, KeyRound, Layers} from 'lucide-react'
 import Image from "next/image"
 import {
     Sidebar,
@@ -102,6 +102,15 @@ export function AppSidebar() {
                                     </Link>
                                 </SidebarMenuButton>
                             </SidebarMenuItem>
+                            {FEATURES.SIDEBAR.SHOW_USAGE &&  <SidebarMenuItem>
+                                <SidebarMenuButton asChild isActive={isActive("/subscription")}>
+                                    <Link href="/subscription">
+                                        <CreditCard className="mr-2 h-4 w-4" />
+                                        Subscription
+                                    </Link>
+                                </SidebarMenuButton>
+                            </SidebarMenuItem>}
+
                             <GiveFeedbackLink />
                         </SidebarMenu>
                     </SidebarGroupContent>

packages/dashboard/src/app/(layout)/components/AppSidebar.tsx

@@ -1,32 +1,41 @@
 import { Progress } from "@/components/ui/progress"
 import { useEffect, useState } from "react";
 import { createClient } from "@/utils/supabase/client";
-
-const MAX_REQUESTS_PER_MONTH = 1000
+import { PLANS } from '@/utils/constants';
+import { Badge } from '@/components/ui/badge';
 
 export function UsageProgressBar() {
     const [usages, setUsages] = useState<number>(0)
+    const [percentage, setPercentage] = useState<number>(0)
+    const [maxRequestsPerMonth, setMaxRequestsPerMonth] = useState<number>(0)
+    const [isPro, setIsPro] = useState<boolean>(false)
     const supabase = createClient()
 
-
     useEffect(() => {
         const fetchData = async () => {
             const { data } = await supabase.from('usages').select().maybeSingle()
             setUsages(data?.calls_count ?? 0)
+
+            const user = await supabase.auth.getUser()
+            const { data: proSubscriptionExists } = await supabase.rpc('check_subscription', { p_user_id: user.data.user?.id })
+
+            setIsPro(proSubscriptionExists)
+            setMaxRequestsPerMonth(proSubscriptionExists ? PLANS.PRO.REQUESTS_PER_MONTH : PLANS.BASIC.REQUESTS_PER_MONTH)
+            setPercentage(Math.min((usages / maxRequestsPerMonth) * 100, 100))
         }
         fetchData()
-    }, [supabase]) // Added supabase to the dependency array
-    const percentage = Math.min((usages / MAX_REQUESTS_PER_MONTH) * 100, 100)
+    }, [])
 
     return (
         <div className="px-4 space-y-2">
             <div className="flex justify-between text-sm">
                 <span>Requests this month</span>
                 <span>
-                    {usages} / {MAX_REQUESTS_PER_MONTH}
+                    {usages} / {maxRequestsPerMonth}
                 </span>
             </div>
             <Progress value={percentage} className="w-full" />
+            {isPro && <Badge>Pro</Badge>}
         </div>
     )
 }