fix: resolve build issues with server actions

- Move server action to separate file with 'use server' directive
- Fix syntax error in page component
- Update imports to use new actions file

Co-Authored-By: ben <ben@prologe.io>

packages/web/app/claim-offer/actions.ts

@@ -0,0 +1,62 @@
+'use server';
+
+import { db, UserUsageTable, createEmptyUserUsage } from "@/drizzle/schema";
+import { eq, sql } from "drizzle-orm";
+import { revalidatePath } from 'next/cache';
+import { handleAuthorizationV2 } from "@/lib/handleAuthorization";
+import { headers } from 'next/headers';
+import { NextRequest } from 'next/server';
+
+export async function claimTokens() {
+  try {
+    // Check if after deadline
+    const deadline = new Date('2025-01-01');
+    if (new Date() > deadline) {
+      return { error: "This offer has expired" };
+    }
+
+    // Get authenticated user
+    const headersList = headers();
+    const request = new NextRequest('https://dummy.url', {
+      headers: headersList,
+    });
+
+    const { userId } = await handleAuthorizationV2(request);
+    if (!userId) {
+      return { error: "You must be logged in to claim tokens" };
+    }
+
+    // Get or create user usage record
+    let [usage] = await db.select().from(UserUsageTable).where(eq(UserUsageTable.userId, userId));
+
+    if (!usage) {
+      await createEmptyUserUsage(userId);
+      [usage] = await db.select().from(UserUsageTable).where(eq(UserUsageTable.userId, userId));
+    }
+
+    // Check if already claimed
+    if (usage.maxTokenUsage >= 5_000_000) {
+      return { error: "You have already claimed this offer" };
+    }
+
+    // Increase maxTokenUsage by 5M
+    const result = await db
+      .update(UserUsageTable)
+      .set({
+        maxTokenUsage: sql`GREATEST(${UserUsageTable.maxTokenUsage}, 5000000)`,
+        subscriptionStatus: "active",
+        paymentStatus: "succeeded"
+      })
+      .where(eq(UserUsageTable.userId, userId))
+      .returning({ newMaxTokens: UserUsageTable.maxTokenUsage });
+
+    revalidatePath('/claim-offer');
+    return { 
+      success: true,
+      maxTokens: result[0].newMaxTokens
+    };
+  } catch (error: any) {
+    console.error("Error claiming tokens:", error);
+    return { error: error.message || "Failed to claim tokens" };
+  }
+}

packages/web/app/claim-offer/claim-button.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { useState } from "react";
-import { claimTokens } from "./page";
+import { claimTokens } from "./actions";
 
 export function ClaimButton() {
   const [loading, setLoading] = useState(false);

packages/web/app/claim-offer/page.tsx

@@ -1,68 +1,6 @@
 import Image from 'next/image';
-import { db, UserUsageTable, createEmptyUserUsage } from "@/drizzle/schema";
-import { eq, sql } from "drizzle-orm";
-import { revalidatePath } from 'next/cache';
-import { handleAuthorizationV2 } from "@/lib/handleAuthorization";
-import { headers } from 'next/headers';
-import { NextRequest } from 'next/server';
 import { ClaimButton } from './claim-button';
 
-export async function claimTokens() {
-  'use server'
-
-  try {
-    // Check if after deadline
-    const deadline = new Date('2025-01-01');
-    if (new Date() > deadline) {
-      return { error: "This offer has expired" };
-    }
-
-    // Get authenticated user
-    const headersList = headers();
-    const request = new NextRequest('https://dummy.url', {
-      headers: headersList,
-    });
-
-    const { userId } = await handleAuthorizationV2(request);
-    if (!userId) {
-      return { error: "You must be logged in to claim tokens" };
-    }
-
-    // Get or create user usage record
-    let [usage] = await db.select().from(UserUsageTable).where(eq(UserUsageTable.userId, userId));
-
-    if (!usage) {
-      await createEmptyUserUsage(userId);
-      [usage] = await db.select().from(UserUsageTable).where(eq(UserUsageTable.userId, userId));
-    }
-
-    // Check if already claimed
-    if (usage.maxTokenUsage >= 5_000_000) {
-      return { error: "You have already claimed this offer" };
-    }
-
-    // Increase maxTokenUsage by 5M
-    const result = await db
-      .update(UserUsageTable)
-      .set({
-        maxTokenUsage: sql`GREATEST(${UserUsageTable.maxTokenUsage}, 5000000)`,
-        subscriptionStatus: "active",
-        paymentStatus: "succeeded"
-      })
-      .where(eq(UserUsageTable.userId, userId))
-      .returning({ newMaxTokens: UserUsageTable.maxTokenUsage });
-
-    revalidatePath('/claim-offer');
-    return { 
-      success: true,
-      maxTokens: result[0].newMaxTokens
-    };
-  } catch (error: any) {
-    console.error("Error claiming tokens:", error);
-    return { error: error.message || "Failed to claim tokens" };
-  }
-}
-
 export default function ClaimOfferPage() {
   return (
     <div className="max-w-md mx-auto p-6 mt-8 text-center space-y-6">