feat: Enable guest users to add product detections and upload images, enhance the product request dialog UI, and update .gitignore.

.gitignore

@@ -39,3 +39,10 @@ yarn-error.log*
 # typescript
 *.tsbuildinfo
 next-env.d.ts
+
+# drizzle migrations (use drizzle-kit generate/push only)
+drizzle-backup/
+*_drizzle-backup.sql
+
+# utility scripts (keep local only)
+scripts/

src/features/moderation/actions/add-detection.ts

@@ -54,11 +54,14 @@ export async function addDetection(data: AddDetectionData) {
             return { success: false, error: 'Video not found' };
         }
 
-        // Verify ownership OR if it's a demo video (allow testing)
+        // Verify ownership for logged-in users (optional check)
+        // Guests can always add products (they'll be attributed to DEMO_USER_ID initially)
         const isOwner = currentUserId && videoData.creatorId === currentUserId;
         const isDemo = videoData.creatorId === DEMO_USER_ID;
+        const isGuest = !currentUserId;
 
-        if (!isOwner && !isDemo) {
+        // Allow: owners, demo videos, or guests (showcase mode)
+        if (!isOwner && !isDemo && !isGuest) {
             return { success: false, error: 'Unauthorized' };
         }
 

src/features/moderation/actions/upload-product-image.ts

@@ -10,9 +10,8 @@ export async function uploadProductImage(formData: FormData) {
             headers: await headers(),
         });
 
-        if (!session?.user) {
-            return { success: false, error: 'Unauthorized' };
-        }
+        // Allow guests to upload (for showcase mode)
+        const userId = session?.user?.id || 'guest';
 
         const file = formData.get('file') as File;
         if (!file) {
@@ -29,7 +28,7 @@ export async function uploadProductImage(formData: FormData) {
         const buffer = Buffer.from(arrayBuffer);
 
         const safeName = (file.name || 'image.png').replace(/[^a-zA-Z0-9.]/g, '_');
-        const fileName = `manual/${session.user.id}-${Date.now()}-${safeName}`;
+        const fileName = `manual/${userId}-${Date.now()}-${safeName}`;
 
         const publicUrl = await uploadThumbnail(buffer, fileName, file.type);
 

src/features/vault/components/product-request-dialog.tsx

@@ -156,14 +156,14 @@ export function ProductRequestDialog({ videoId: initialVideoId, creatorId, video
                     Can't find a product?
                 </Button>
             </DialogTrigger>
-            <DialogContent className="sm:max-w-[425px] glass border-white/10 text-white">
+            <DialogContent className="sm:max-w-[540px] glass border-white/10 text-white">
                 <DialogHeader>
                     <DialogTitle className="text-xl font-bold tracking-tight">Request a Product</DialogTitle>
                     <DialogDescription className="text-muted-foreground">
                         Saw something in a video that's not listed? Let the creator know!
                     </DialogDescription>
                 </DialogHeader>
-                <form onSubmit={handleSubmit} className="space-y-4 py-4">
+                <form onSubmit={handleSubmit} className="space-y-5 py-4 max-h-[60vh] overflow-y-auto pr-2">
                     {!initialVideoId && videos.length > 0 && (
                         <div className="space-y-2">
                             <Label htmlFor="video-select" className="text-sm font-medium">Which video did you see it in?*</Label>
@@ -190,8 +190,7 @@ export function ProductRequestDialog({ videoId: initialVideoId, creatorId, video
                             required
                         />
                     </div>
-                    {/* ... (rest unchanged) ... */}
-                    <div className="grid grid-cols-2 gap-4">
+                    <div className="space-y-4">
                         <div className="space-y-2">
                             <Label htmlFor="name" className="text-sm font-medium">Name (Optional)</Label>
                             <Input
@@ -214,7 +213,7 @@ export function ProductRequestDialog({ videoId: initialVideoId, creatorId, video
                             />
                         </div>
                     </div>
-                    <div className="space-y-4">
+                    <div className="space-y-2">
                         <ImageUploadField
                             label="Product Image (Optional)"
                             icon={<PlaySquare className="h-4 w-4 text-primary" />}

src/features/vault/services/showcase.service.ts

@@ -602,8 +602,7 @@ export class ShowcaseService {
                     await db.update(youtubeChannels)
                         .set({
                             subscriberCount: subscriberCount > 0 ? subscriberCount : channel.subscriberCount,
-                            thumbnailUrl: betterThumbnailUrl || channel.thumbnailUrl,
-                            creatorSlug: expectedSlug
+                            thumbnailUrl: betterThumbnailUrl || channel.thumbnailUrl
                         })
                         .where(eq(youtubeChannels.id, channel.id));
                 } else {