feat: Enable users to claim demo videos from the showcase page during sign-up.

src/actions/claim-video.ts

@@ -0,0 +1,72 @@
+'use server';
+
+import { db } from '@/lib/db';
+import { youtubeVideos, youtubeChannels, detectedObjects } from '@/lib/db/schema';
+import { eq, and } from 'drizzle-orm';
+import { auth } from '@/lib/auth';
+import { headers } from 'next/headers';
+import { DEMO_USER_ID } from '@/features/moderation/utils/demo';
+
+export async function claimVideo(videoId: string) {
+    try {
+        const session = await auth.api.getSession({
+            headers: await headers(),
+        });
+
+        if (!session?.user) {
+            return { success: false, error: 'Unauthorized' };
+        }
+
+        const userId = session.user.id;
+
+        // 1. Find the video
+        const video = await db.query.youtubeVideos.findFirst({
+            where: eq(youtubeVideos.videoId, videoId),
+            with: {
+                channel: true
+            }
+        });
+
+        if (!video) {
+            return { success: false, error: 'Video not found' };
+        }
+
+        // 2. Verify it's claimable (owned by demo/shadow user)
+        if (video.channel.creatorId !== DEMO_USER_ID && !video.channel.channelId.startsWith('shadow-')) {
+            return { success: false, error: 'Video already owned' };
+        }
+
+        // 3. Find or Create a channel for the NEW user
+        // For simplicity in this flow, we'll re-assign the EXISTING shadow channel to the new user
+        // In a real app, we might merge this into their existing channel if they have one.
+
+        await db.update(youtubeChannels)
+            .set({
+                creatorId: userId,
+                // We keep the channelId as is (shadow-...) or real ID if we found it
+                // But now it belongs to the real user
+            })
+            .where(eq(youtubeChannels.id, video.channelId));
+
+        // 4. Update any manually added detections to be "addedBy" the new user
+        await db.update(detectedObjects)
+            .set({
+                moderationStatus: 'APPROVED',
+                moderationMetadata: {
+                    manuallyAdded: true,
+                    addedBy: userId,
+                    addedAt: new Date().toISOString(), // effectively "adopted" at this time
+                    autoApproved: true, // Mark as auto-approved during claim
+                }
+            })
+            .where(and(
+                eq(detectedObjects.videoId, video.id),
+                // We could filter by "addedBy == DEMO_USER_ID" if we store that for guests
+            ));
+
+        return { success: true };
+    } catch (error: any) {
+        console.error('Claim video error:', error);
+        return { success: false, error: error.message };
+    }
+}

src/app/showcase/[videoId]/page.tsx

@@ -47,7 +47,7 @@ export default async function ShowcasePage({ params }: ShowcasePageProps) {
                         </div>
                         <div className="flex items-center gap-2">
                             <Button asChild size="sm" className="rounded-full shadow-lg shadow-primary/20">
-                                <Link href="/register">Claim Your Vault</Link>
+                                <Link href={`/register?videoId=${videoId}`}>Claim Your Vault</Link>
                             </Button>
                         </div>
                     </div>

src/components/auth/sign-up-form.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { useState } from "react";
+import { useRouter, useSearchParams } from "next/navigation";
 import { signUp } from "@/lib/auth-client";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
@@ -13,6 +14,9 @@ export function SignUpForm() {
     const [password, setPassword] = useState("");
     const [loading, setLoading] = useState(false);
     const [error, setError] = useState("");
+    const router = useRouter();
+    const searchParams = useSearchParams();
+    const videoId = searchParams.get("videoId");
 
     const handleSubmit = async (e: React.FormEvent) => {
         e.preventDefault();
@@ -27,9 +31,18 @@ export function SignUpForm() {
             onRequest: () => {
                 setLoading(true);
             },
-            onSuccess: () => {
+            onSuccess: async () => {
+                if (videoId) {
+                    try {
+                        const { claimVideo } = await import("@/actions/claim-video");
+                        await claimVideo(videoId);
+                    } catch (err) {
+                        console.error("Failed to claim video:", err);
+                        // Non-blocking error, user is still signed in
+                    }
+                }
                 setLoading(false);
-                // Redirect handled by callbackURL
+                router.push("/dashboard");
             },
             onError: (ctx) => {
                 setLoading(false);