feat: Add submitter fields to entity forms

This commit is contained in:
gpt-engineer-app[bot]
2025-10-29 15:30:15 +00:00
parent 107191c125
commit 9aaff5a10b
10 changed files with 529 additions and 3 deletions

View File

@@ -10,6 +10,7 @@ import { Textarea } from '@/components/ui/textarea';
import { Label } from '@/components/ui/label'; import { Label } from '@/components/ui/label';
import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group'; import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Badge } from '@/components/ui/badge';
import { SlugField } from '@/components/ui/slug-field'; import { SlugField } from '@/components/ui/slug-field';
import { Ruler, Save, X } from 'lucide-react'; import { Ruler, Save, X } from 'lucide-react';
import { useUserRole } from '@/hooks/useUserRole'; import { useUserRole } from '@/hooks/useUserRole';
@@ -35,6 +36,8 @@ interface DesignerFormInput {
founded_date_precision?: 'day' | 'month' | 'year'; founded_date_precision?: 'day' | 'month' | 'year';
headquarters_location?: string; headquarters_location?: string;
website_url?: string; website_url?: string;
source_url?: string;
submission_notes?: string;
images?: { images?: {
uploaded: UploadedImage[]; uploaded: UploadedImage[];
banner_assignment?: number | null; banner_assignment?: number | null;
@@ -77,6 +80,8 @@ export function DesignerForm({ onSubmit, onCancel, initialData }: DesignerFormPr
website_url: initialData?.website_url || '', website_url: initialData?.website_url || '',
founded_year: initialData?.founded_year ? String(initialData.founded_year) : '', founded_year: initialData?.founded_year ? String(initialData.founded_year) : '',
headquarters_location: initialData?.headquarters_location || '', headquarters_location: initialData?.headquarters_location || '',
source_url: initialData?.source_url || '',
submission_notes: initialData?.submission_notes || '',
images: initialData?.images || { uploaded: [] } images: initialData?.images || { uploaded: [] }
} }
}); });
@@ -221,6 +226,61 @@ export function DesignerForm({ onSubmit, onCancel, initialData }: DesignerFormPr
)} )}
</div> </div>
{/* Submission Context - For Reviewers */}
<div className="space-y-4 border-t pt-6">
<div className="flex items-center gap-2 mb-4">
<Badge variant="secondary" className="text-xs">
For Moderator Review
</Badge>
<p className="text-xs text-muted-foreground">
Help reviewers verify your submission
</p>
</div>
<div className="space-y-2">
<Label htmlFor="source_url" className="flex items-center gap-2">
Source URL
<span className="text-xs text-muted-foreground font-normal">
(Optional)
</span>
</Label>
<Input
id="source_url"
type="url"
{...register('source_url')}
placeholder="https://example.com/article"
/>
<p className="text-xs text-muted-foreground">
Where did you find this information? (e.g., official website, news article, press release)
</p>
{errors.source_url && (
<p className="text-sm text-destructive">{errors.source_url.message}</p>
)}
</div>
<div className="space-y-2">
<Label htmlFor="submission_notes" className="flex items-center gap-2">
Notes for Reviewers
<span className="text-xs text-muted-foreground font-normal">
(Optional)
</span>
</Label>
<Textarea
id="submission_notes"
{...register('submission_notes')}
placeholder="Add any context to help moderators verify this information (e.g., 'Confirmed via company website', 'Founded date approximate')"
rows={3}
maxLength={1000}
/>
<p className="text-xs text-muted-foreground">
{watch('submission_notes')?.length || 0}/1000 characters
</p>
{errors.submission_notes && (
<p className="text-sm text-destructive">{errors.submission_notes.message}</p>
)}
</div>
</div>
{/* Images */} {/* Images */}
<EntityMultiImageUploader <EntityMultiImageUploader
mode={initialData ? 'edit' : 'create'} mode={initialData ? 'edit' : 'create'}

View File

@@ -10,6 +10,7 @@ import { Textarea } from '@/components/ui/textarea';
import { Label } from '@/components/ui/label'; import { Label } from '@/components/ui/label';
import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group'; import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Badge } from '@/components/ui/badge';
import { SlugField } from '@/components/ui/slug-field'; import { SlugField } from '@/components/ui/slug-field';
import { Building2, Save, X } from 'lucide-react'; import { Building2, Save, X } from 'lucide-react';
import { useUserRole } from '@/hooks/useUserRole'; import { useUserRole } from '@/hooks/useUserRole';
@@ -36,6 +37,8 @@ interface ManufacturerFormInput {
founded_date_precision?: 'day' | 'month' | 'year'; founded_date_precision?: 'day' | 'month' | 'year';
headquarters_location?: string; headquarters_location?: string;
website_url?: string; website_url?: string;
source_url?: string;
submission_notes?: string;
images?: { images?: {
uploaded: UploadedImage[]; uploaded: UploadedImage[];
banner_assignment?: number | null; banner_assignment?: number | null;
@@ -80,6 +83,8 @@ export function ManufacturerForm({ onSubmit, onCancel, initialData }: Manufactur
founded_date: initialData?.founded_date || (initialData?.founded_year ? `${initialData.founded_year}-01-01` : ''), founded_date: initialData?.founded_date || (initialData?.founded_year ? `${initialData.founded_year}-01-01` : ''),
founded_date_precision: initialData?.founded_date_precision || (initialData?.founded_year ? ('year' as const) : ('day' as const)), founded_date_precision: initialData?.founded_date_precision || (initialData?.founded_year ? ('year' as const) : ('day' as const)),
headquarters_location: initialData?.headquarters_location || '', headquarters_location: initialData?.headquarters_location || '',
source_url: initialData?.source_url || '',
submission_notes: initialData?.submission_notes || '',
images: initialData?.images || { uploaded: [] } images: initialData?.images || { uploaded: [] }
} }
}); });
@@ -222,6 +227,61 @@ export function ManufacturerForm({ onSubmit, onCancel, initialData }: Manufactur
)} )}
</div> </div>
{/* Submission Context - For Reviewers */}
<div className="space-y-4 border-t pt-6">
<div className="flex items-center gap-2 mb-4">
<Badge variant="secondary" className="text-xs">
For Moderator Review
</Badge>
<p className="text-xs text-muted-foreground">
Help reviewers verify your submission
</p>
</div>
<div className="space-y-2">
<Label htmlFor="source_url" className="flex items-center gap-2">
Source URL
<span className="text-xs text-muted-foreground font-normal">
(Optional)
</span>
</Label>
<Input
id="source_url"
type="url"
{...register('source_url')}
placeholder="https://example.com/article"
/>
<p className="text-xs text-muted-foreground">
Where did you find this information? (e.g., official website, news article, press release)
</p>
{errors.source_url && (
<p className="text-sm text-destructive">{errors.source_url.message}</p>
)}
</div>
<div className="space-y-2">
<Label htmlFor="submission_notes" className="flex items-center gap-2">
Notes for Reviewers
<span className="text-xs text-muted-foreground font-normal">
(Optional)
</span>
</Label>
<Textarea
id="submission_notes"
{...register('submission_notes')}
placeholder="Add any context to help moderators verify this information (e.g., 'Confirmed via company website', 'Founded date approximate')"
rows={3}
maxLength={1000}
/>
<p className="text-xs text-muted-foreground">
{watch('submission_notes')?.length || 0}/1000 characters
</p>
{errors.submission_notes && (
<p className="text-sm text-destructive">{errors.submission_notes.message}</p>
)}
</div>
</div>
{/* Images */} {/* Images */}
<EntityMultiImageUploader <EntityMultiImageUploader
mode={initialData ? 'edit' : 'create'} mode={initialData ? 'edit' : 'create'}

View File

@@ -10,6 +10,7 @@ import { Textarea } from '@/components/ui/textarea';
import { Label } from '@/components/ui/label'; import { Label } from '@/components/ui/label';
import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group'; import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Badge } from '@/components/ui/badge';
import { SlugField } from '@/components/ui/slug-field'; import { SlugField } from '@/components/ui/slug-field';
import { FerrisWheel, Save, X } from 'lucide-react'; import { FerrisWheel, Save, X } from 'lucide-react';
import { useUserRole } from '@/hooks/useUserRole'; import { useUserRole } from '@/hooks/useUserRole';
@@ -35,6 +36,8 @@ interface OperatorFormInput {
founded_date_precision?: 'day' | 'month' | 'year'; founded_date_precision?: 'day' | 'month' | 'year';
headquarters_location?: string; headquarters_location?: string;
website_url?: string; website_url?: string;
source_url?: string;
submission_notes?: string;
images?: { images?: {
uploaded: UploadedImage[]; uploaded: UploadedImage[];
banner_assignment?: number | null; banner_assignment?: number | null;
@@ -77,6 +80,8 @@ export function OperatorForm({ onSubmit, onCancel, initialData }: OperatorFormPr
website_url: initialData?.website_url || '', website_url: initialData?.website_url || '',
founded_year: initialData?.founded_year ? String(initialData.founded_year) : '', founded_year: initialData?.founded_year ? String(initialData.founded_year) : '',
headquarters_location: initialData?.headquarters_location || '', headquarters_location: initialData?.headquarters_location || '',
source_url: initialData?.source_url || '',
submission_notes: initialData?.submission_notes || '',
images: initialData?.images || { uploaded: [] } images: initialData?.images || { uploaded: [] }
} }
}); });
@@ -221,6 +226,61 @@ export function OperatorForm({ onSubmit, onCancel, initialData }: OperatorFormPr
)} )}
</div> </div>
{/* Submission Context - For Reviewers */}
<div className="space-y-4 border-t pt-6">
<div className="flex items-center gap-2 mb-4">
<Badge variant="secondary" className="text-xs">
For Moderator Review
</Badge>
<p className="text-xs text-muted-foreground">
Help reviewers verify your submission
</p>
</div>
<div className="space-y-2">
<Label htmlFor="source_url" className="flex items-center gap-2">
Source URL
<span className="text-xs text-muted-foreground font-normal">
(Optional)
</span>
</Label>
<Input
id="source_url"
type="url"
{...register('source_url')}
placeholder="https://example.com/article"
/>
<p className="text-xs text-muted-foreground">
Where did you find this information? (e.g., official website, news article, press release)
</p>
{errors.source_url && (
<p className="text-sm text-destructive">{errors.source_url.message}</p>
)}
</div>
<div className="space-y-2">
<Label htmlFor="submission_notes" className="flex items-center gap-2">
Notes for Reviewers
<span className="text-xs text-muted-foreground font-normal">
(Optional)
</span>
</Label>
<Textarea
id="submission_notes"
{...register('submission_notes')}
placeholder="Add any context to help moderators verify this information (e.g., 'Confirmed via company website', 'Founded date approximate')"
rows={3}
maxLength={1000}
/>
<p className="text-xs text-muted-foreground">
{watch('submission_notes')?.length || 0}/1000 characters
</p>
{errors.submission_notes && (
<p className="text-sm text-destructive">{errors.submission_notes.message}</p>
)}
</div>
</div>
{/* Images */} {/* Images */}
<EntityMultiImageUploader <EntityMultiImageUploader
mode={initialData ? 'edit' : 'create'} mode={initialData ? 'edit' : 'create'}

View File

@@ -58,6 +58,8 @@ const parkSchema = z.object({
email: z.string().email().optional().or(z.literal('')), email: z.string().email().optional().or(z.literal('')),
operator_id: z.string().uuid().optional().or(z.literal('')).transform(val => val || undefined), operator_id: z.string().uuid().optional().or(z.literal('')).transform(val => val || undefined),
property_owner_id: z.string().uuid().optional().or(z.literal('')).transform(val => val || undefined), property_owner_id: z.string().uuid().optional().or(z.literal('')).transform(val => val || undefined),
source_url: z.string().url().optional().or(z.literal('')),
submission_notes: z.string().max(1000).optional().or(z.literal('')),
images: z.object({ images: z.object({
uploaded: z.array(z.object({ uploaded: z.array(z.object({
url: z.string(), url: z.string(),
@@ -181,6 +183,8 @@ export function ParkForm({ onSubmit, onCancel, initialData, isEditing = false }:
email: initialData?.email || '', email: initialData?.email || '',
operator_id: initialData?.operator_id || undefined, operator_id: initialData?.operator_id || undefined,
property_owner_id: initialData?.property_owner_id || undefined, property_owner_id: initialData?.property_owner_id || undefined,
source_url: initialData?.source_url || '',
submission_notes: initialData?.submission_notes || '',
images: { uploaded: [] } images: { uploaded: [] }
} }
}); });
@@ -538,6 +542,61 @@ export function ParkForm({ onSubmit, onCancel, initialData, isEditing = false }:
</div> </div>
</div> </div>
{/* Submission Context - For Reviewers */}
<div className="space-y-4 border-t pt-6">
<div className="flex items-center gap-2 mb-4">
<Badge variant="secondary" className="text-xs">
For Moderator Review
</Badge>
<p className="text-xs text-muted-foreground">
Help reviewers verify your submission
</p>
</div>
<div className="space-y-2">
<Label htmlFor="source_url" className="flex items-center gap-2">
Source URL
<span className="text-xs text-muted-foreground font-normal">
(Optional)
</span>
</Label>
<Input
id="source_url"
type="url"
{...register('source_url')}
placeholder="https://example.com/article"
/>
<p className="text-xs text-muted-foreground">
Where did you find this information? (e.g., official website, news article, press release)
</p>
{errors.source_url && (
<p className="text-sm text-destructive">{errors.source_url.message}</p>
)}
</div>
<div className="space-y-2">
<Label htmlFor="submission_notes" className="flex items-center gap-2">
Notes for Reviewers
<span className="text-xs text-muted-foreground font-normal">
(Optional)
</span>
</Label>
<Textarea
id="submission_notes"
{...register('submission_notes')}
placeholder="Add any context to help moderators verify this information (e.g., 'Confirmed via phone call with park', 'Soft opening date not yet announced')"
rows={3}
maxLength={1000}
/>
<p className="text-xs text-muted-foreground">
{watch('submission_notes')?.length || 0}/1000 characters
</p>
{errors.submission_notes && (
<p className="text-sm text-destructive">{errors.submission_notes.message}</p>
)}
</div>
</div>
{/* Images */} {/* Images */}
<EntityMultiImageUploader <EntityMultiImageUploader
mode={isEditing ? 'edit' : 'create'} mode={isEditing ? 'edit' : 'create'}

View File

@@ -10,6 +10,7 @@ import { Textarea } from '@/components/ui/textarea';
import { Label } from '@/components/ui/label'; import { Label } from '@/components/ui/label';
import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group'; import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Badge } from '@/components/ui/badge';
import { SlugField } from '@/components/ui/slug-field'; import { SlugField } from '@/components/ui/slug-field';
import { Building2, Save, X } from 'lucide-react'; import { Building2, Save, X } from 'lucide-react';
import { useUserRole } from '@/hooks/useUserRole'; import { useUserRole } from '@/hooks/useUserRole';
@@ -35,6 +36,8 @@ interface PropertyOwnerFormInput {
founded_date_precision?: 'day' | 'month' | 'year'; founded_date_precision?: 'day' | 'month' | 'year';
headquarters_location?: string; headquarters_location?: string;
website_url?: string; website_url?: string;
source_url?: string;
submission_notes?: string;
images?: { images?: {
uploaded: UploadedImage[]; uploaded: UploadedImage[];
banner_assignment?: number | null; banner_assignment?: number | null;
@@ -77,6 +80,8 @@ export function PropertyOwnerForm({ onSubmit, onCancel, initialData }: PropertyO
website_url: initialData?.website_url || '', website_url: initialData?.website_url || '',
founded_year: initialData?.founded_year ? String(initialData.founded_year) : '', founded_year: initialData?.founded_year ? String(initialData.founded_year) : '',
headquarters_location: initialData?.headquarters_location || '', headquarters_location: initialData?.headquarters_location || '',
source_url: initialData?.source_url || '',
submission_notes: initialData?.submission_notes || '',
images: initialData?.images || { uploaded: [] } images: initialData?.images || { uploaded: [] }
} }
}); });
@@ -221,6 +226,61 @@ export function PropertyOwnerForm({ onSubmit, onCancel, initialData }: PropertyO
)} )}
</div> </div>
{/* Submission Context - For Reviewers */}
<div className="space-y-4 border-t pt-6">
<div className="flex items-center gap-2 mb-4">
<Badge variant="secondary" className="text-xs">
For Moderator Review
</Badge>
<p className="text-xs text-muted-foreground">
Help reviewers verify your submission
</p>
</div>
<div className="space-y-2">
<Label htmlFor="source_url" className="flex items-center gap-2">
Source URL
<span className="text-xs text-muted-foreground font-normal">
(Optional)
</span>
</Label>
<Input
id="source_url"
type="url"
{...register('source_url')}
placeholder="https://example.com/article"
/>
<p className="text-xs text-muted-foreground">
Where did you find this information? (e.g., official website, news article, press release)
</p>
{errors.source_url && (
<p className="text-sm text-destructive">{errors.source_url.message}</p>
)}
</div>
<div className="space-y-2">
<Label htmlFor="submission_notes" className="flex items-center gap-2">
Notes for Reviewers
<span className="text-xs text-muted-foreground font-normal">
(Optional)
</span>
</Label>
<Textarea
id="submission_notes"
{...register('submission_notes')}
placeholder="Add any context to help moderators verify this information (e.g., 'Confirmed via company website', 'Founded date approximate')"
rows={3}
maxLength={1000}
/>
<p className="text-xs text-muted-foreground">
{watch('submission_notes')?.length || 0}/1000 characters
</p>
{errors.submission_notes && (
<p className="text-sm text-destructive">{errors.submission_notes.message}</p>
)}
</div>
</div>
{/* Images */} {/* Images */}
<EntityMultiImageUploader <EntityMultiImageUploader
mode={initialData ? 'edit' : 'create'} mode={initialData ? 'edit' : 'create'}

View File

@@ -213,6 +213,8 @@ export function RideForm({ onSubmit, onCancel, initialData, isEditing = false }:
max_g_force: initialData?.max_g_force || undefined, max_g_force: initialData?.max_g_force || undefined,
manufacturer_id: initialData?.manufacturer_id || undefined, manufacturer_id: initialData?.manufacturer_id || undefined,
ride_model_id: initialData?.ride_model_id || undefined, ride_model_id: initialData?.ride_model_id || undefined,
source_url: initialData?.source_url || '',
submission_notes: initialData?.submission_notes || '',
images: { uploaded: [] } images: { uploaded: [] }
} }
}); });
@@ -792,6 +794,61 @@ export function RideForm({ onSubmit, onCancel, initialData, isEditing = false }:
)} )}
</div> </div>
{/* Submission Context - For Reviewers */}
<div className="space-y-4 border-t pt-6">
<div className="flex items-center gap-2 mb-4">
<Badge variant="secondary" className="text-xs">
For Moderator Review
</Badge>
<p className="text-xs text-muted-foreground">
Help reviewers verify your submission
</p>
</div>
<div className="space-y-2">
<Label htmlFor="source_url" className="flex items-center gap-2">
Source URL
<span className="text-xs text-muted-foreground font-normal">
(Optional)
</span>
</Label>
<Input
id="source_url"
type="url"
{...register('source_url')}
placeholder="https://example.com/article"
/>
<p className="text-xs text-muted-foreground">
Where did you find this information? (e.g., official website, news article, press release)
</p>
{errors.source_url && (
<p className="text-sm text-destructive">{errors.source_url.message}</p>
)}
</div>
<div className="space-y-2">
<Label htmlFor="submission_notes" className="flex items-center gap-2">
Notes for Reviewers
<span className="text-xs text-muted-foreground font-normal">
(Optional)
</span>
</Label>
<Textarea
id="submission_notes"
{...register('submission_notes')}
placeholder="Add any context to help moderators verify this information (e.g., 'Confirmed via phone call with park', 'Soft opening date not yet announced')"
rows={3}
maxLength={1000}
/>
<p className="text-xs text-muted-foreground">
{watch('submission_notes')?.length || 0}/1000 characters
</p>
{errors.submission_notes && (
<p className="text-sm text-destructive">{errors.submission_notes.message}</p>
)}
</div>
</div>
{/* Images */} {/* Images */}
<EntityMultiImageUploader <EntityMultiImageUploader
mode={isEditing ? 'edit' : 'create'} mode={isEditing ? 'edit' : 'create'}

View File

@@ -25,6 +25,8 @@ const rideModelSchema = z.object({
category: z.string().min(1, 'Category is required'), category: z.string().min(1, 'Category is required'),
ride_type: z.string().min(1, 'Ride type is required'), ride_type: z.string().min(1, 'Ride type is required'),
description: z.string().optional(), description: z.string().optional(),
source_url: z.string().url().optional().or(z.literal('')),
submission_notes: z.string().max(1000).optional().or(z.literal('')),
images: z.object({ images: z.object({
uploaded: z.array(z.object({ uploaded: z.array(z.object({
url: z.string(), url: z.string(),
@@ -92,6 +94,8 @@ export function RideModelForm({
category: initialData?.category || '', category: initialData?.category || '',
ride_type: initialData?.ride_type || '', ride_type: initialData?.ride_type || '',
description: initialData?.description || '', description: initialData?.description || '',
source_url: initialData?.source_url || '',
submission_notes: initialData?.submission_notes || '',
images: initialData?.images || { uploaded: [] } images: initialData?.images || { uploaded: [] }
} }
}); });
@@ -214,6 +218,61 @@ export function RideModelForm({
</p> </p>
</div> </div>
{/* Submission Context - For Reviewers */}
<div className="space-y-4 border-t pt-6">
<div className="flex items-center gap-2 mb-4">
<Badge variant="secondary" className="text-xs">
For Moderator Review
</Badge>
<p className="text-xs text-muted-foreground">
Help reviewers verify your submission
</p>
</div>
<div className="space-y-2">
<Label htmlFor="source_url" className="flex items-center gap-2">
Source URL
<span className="text-xs text-muted-foreground font-normal">
(Optional)
</span>
</Label>
<Input
id="source_url"
type="url"
{...register('source_url')}
placeholder="https://example.com/article"
/>
<p className="text-xs text-muted-foreground">
Where did you find this information? (e.g., official website, news article, press release)
</p>
{errors.source_url && (
<p className="text-sm text-destructive">{errors.source_url.message}</p>
)}
</div>
<div className="space-y-2">
<Label htmlFor="submission_notes" className="flex items-center gap-2">
Notes for Reviewers
<span className="text-xs text-muted-foreground font-normal">
(Optional)
</span>
</Label>
<Textarea
id="submission_notes"
{...register('submission_notes')}
placeholder="Add any context to help moderators verify this information (e.g., 'Confirmed via manufacturer catalog', 'Model specifications approximate')"
rows={3}
maxLength={1000}
/>
<p className="text-xs text-muted-foreground">
{watch('submission_notes')?.length || 0}/1000 characters
</p>
{errors.submission_notes && (
<p className="text-sm text-destructive">{errors.submission_notes.message}</p>
)}
</div>
</div>
{/* Images */} {/* Images */}
<EntityMultiImageUploader <EntityMultiImageUploader
mode={initialData ? 'edit' : 'create'} mode={initialData ? 'edit' : 'create'}

View File

@@ -1,5 +1,5 @@
import { memo, useState, useCallback } from 'react'; import { memo, useState, useCallback } from 'react';
import { CheckCircle, XCircle, Eye, Calendar, MessageSquare, FileText, Image, ListTree, RefreshCw, AlertCircle, Lock, Trash2, AlertTriangle, Edit } from 'lucide-react'; import { CheckCircle, XCircle, Eye, Calendar, MessageSquare, FileText, Image, ListTree, RefreshCw, AlertCircle, Lock, Trash2, AlertTriangle, Edit, Info, ExternalLink, ChevronDown } from 'lucide-react';
import { usePhotoSubmissionItems } from '@/hooks/usePhotoSubmissionItems'; import { usePhotoSubmissionItems } from '@/hooks/usePhotoSubmissionItems';
import { PhotoGrid } from '@/components/common/PhotoGrid'; import { PhotoGrid } from '@/components/common/PhotoGrid';
import { normalizePhotoData } from '@/lib/photoHelpers'; import { normalizePhotoData } from '@/lib/photoHelpers';
@@ -14,6 +14,7 @@ import { Textarea } from '@/components/ui/textarea';
import { Label } from '@/components/ui/label'; import { Label } from '@/components/ui/label';
import { Alert, AlertDescription, AlertTitle } from '@/components/ui/alert'; import { Alert, AlertDescription, AlertTitle } from '@/components/ui/alert';
import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'; import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';
import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';
import { format } from 'date-fns'; import { format } from 'date-fns';
import { SubmissionItemsList } from './SubmissionItemsList'; import { SubmissionItemsList } from './SubmissionItemsList';
import { MeasurementDisplay } from '@/components/ui/measurement-display'; import { MeasurementDisplay } from '@/components/ui/measurement-display';
@@ -505,6 +506,42 @@ export const QueueItem = memo(({
)} )}
<div className={isMobile ? 'space-y-4 mt-4' : 'grid grid-cols-1 lg:grid-cols-[1fr,auto] gap-6 items-start mt-4'}> <div className={isMobile ? 'space-y-4 mt-4' : 'grid grid-cols-1 lg:grid-cols-[1fr,auto] gap-6 items-start mt-4'}>
{/* Submitter Context - shown before moderator can add their notes */}
{(item.submission_items?.[0]?.item_data?.source_url || item.submission_items?.[0]?.item_data?.submission_notes) && (
<div className="space-y-3 mb-4 p-4 bg-blue-50 dark:bg-blue-950/20 border border-blue-200 dark:border-blue-800 rounded-lg lg:col-span-2">
<div className="flex items-center gap-2 mb-2">
<Info className="w-4 h-4 text-blue-600 dark:text-blue-400" />
<h4 className="text-sm font-semibold text-blue-900 dark:text-blue-100">
Submitter Context
</h4>
</div>
{item.submission_items?.[0]?.item_data?.source_url && (
<div className="text-sm">
<span className="font-medium text-blue-900 dark:text-blue-100">Source: </span>
<a
href={item.submission_items[0].item_data.source_url}
target="_blank"
rel="noopener noreferrer"
className="text-blue-600 hover:underline dark:text-blue-400 inline-flex items-center gap-1"
>
{item.submission_items[0].item_data.source_url}
<ExternalLink className="w-3 h-3" />
</a>
</div>
)}
{item.submission_items?.[0]?.item_data?.submission_notes && (
<div className="text-sm">
<span className="font-medium text-blue-900 dark:text-blue-100">Submitter Notes: </span>
<p className="mt-1 whitespace-pre-wrap text-blue-800 dark:text-blue-200">
{item.submission_items[0].item_data.submission_notes}
</p>
</div>
)}
</div>
)}
{/* Left: Notes textarea */} {/* Left: Notes textarea */}
<div className="space-y-2"> <div className="space-y-2">
<Label htmlFor={`notes-${item.id}`}>Moderation Notes (optional)</Label> <Label htmlFor={`notes-${item.id}`}>Moderation Notes (optional)</Label>
@@ -648,7 +685,7 @@ export const QueueItem = memo(({
)} )}
{/* Reviewer Information for approved/rejected items */} {/* Reviewer Information for approved/rejected items */}
{(item.status === 'approved' || item.status === 'rejected') && (item.reviewed_at || item.reviewer_notes) && ( {(item.status === 'approved' || item.status === 'rejected') && (item.reviewed_at || item.reviewer_notes || item.submission_items?.[0]?.item_data?.source_url || item.submission_items?.[0]?.item_data?.submission_notes) && (
<div className="space-y-3 pt-4 border-t"> <div className="space-y-3 pt-4 border-t">
<div className="flex items-center gap-2 text-sm text-muted-foreground"> <div className="flex items-center gap-2 text-sm text-muted-foreground">
<Calendar className="w-4 h-4" /> <Calendar className="w-4 h-4" />
@@ -672,9 +709,43 @@ export const QueueItem = memo(({
)} )}
</div> </div>
{/* Submitter Context (shown in collapsed state after review) */}
{(item.submission_items?.[0]?.item_data?.source_url || item.submission_items?.[0]?.item_data?.submission_notes) && (
<Collapsible>
<CollapsibleTrigger className="flex items-center gap-2 text-sm font-medium hover:underline">
<ChevronDown className="w-4 h-4" />
View Submitter Context
</CollapsibleTrigger>
<CollapsibleContent className="mt-2 bg-muted/30 p-3 rounded-lg">
{item.submission_items?.[0]?.item_data?.source_url && (
<div className="text-sm mb-2">
<span className="font-medium">Source: </span>
<a
href={item.submission_items[0].item_data.source_url}
target="_blank"
rel="noopener noreferrer"
className="text-blue-600 hover:underline inline-flex items-center gap-1"
>
{item.submission_items[0].item_data.source_url}
<ExternalLink className="w-3 h-3" />
</a>
</div>
)}
{item.submission_items?.[0]?.item_data?.submission_notes && (
<div className="text-sm">
<span className="font-medium">Submitter Notes: </span>
<p className="mt-1 whitespace-pre-wrap text-muted-foreground">
{item.submission_items[0].item_data.submission_notes}
</p>
</div>
)}
</CollapsibleContent>
</Collapsible>
)}
{item.reviewer_notes && ( {item.reviewer_notes && (
<div className="bg-muted/30 p-3 rounded-lg"> <div className="bg-muted/30 p-3 rounded-lg">
<p className="text-sm font-medium mb-1">Reviewer Notes:</p> <p className="text-sm font-medium mb-1">Moderator Notes:</p>
<p className="text-sm text-muted-foreground">{item.reviewer_notes}</p> <p className="text-sm text-muted-foreground">{item.reviewer_notes}</p>
</div> </div>
)} )}

View File

@@ -53,6 +53,14 @@ export const parkValidationSchema = z.object({
card_image_id: z.string().optional(), card_image_id: z.string().optional(),
card_image_url: z.string().optional(), card_image_url: z.string().optional(),
images: imageAssignmentSchema, images: imageAssignmentSchema,
source_url: z.string().trim().optional().or(z.literal('')).refine((val) => {
if (!val || val === '') return true;
return z.string().url().safeParse(val).success;
}, 'Invalid URL format. Must be a valid URL starting with http:// or https://'),
submission_notes: z.string().trim()
.max(1000, 'Submission notes must be less than 1000 characters')
.optional()
.or(z.literal('')),
}).refine((data) => { }).refine((data) => {
if (data.closing_date && data.opening_date) { if (data.closing_date && data.opening_date) {
return new Date(data.closing_date) >= new Date(data.opening_date); return new Date(data.closing_date) >= new Date(data.opening_date);
@@ -131,6 +139,14 @@ export const rideValidationSchema = z.object({
card_image_id: z.string().optional(), card_image_id: z.string().optional(),
card_image_url: z.string().optional(), card_image_url: z.string().optional(),
images: imageAssignmentSchema, images: imageAssignmentSchema,
source_url: z.string().trim().optional().or(z.literal('')).refine((val) => {
if (!val || val === '') return true;
return z.string().url().safeParse(val).success;
}, 'Invalid URL format. Must be a valid URL starting with http:// or https://'),
submission_notes: z.string().trim()
.max(1000, 'Submission notes must be less than 1000 characters')
.optional()
.or(z.literal('')),
}); });
// ============================================ // ============================================
@@ -159,6 +175,14 @@ export const companyValidationSchema = z.object({
card_image_id: z.string().optional(), card_image_id: z.string().optional(),
card_image_url: z.string().optional(), card_image_url: z.string().optional(),
images: imageAssignmentSchema, images: imageAssignmentSchema,
source_url: z.string().trim().optional().or(z.literal('')).refine((val) => {
if (!val || val === '') return true;
return z.string().url().safeParse(val).success;
}, 'Invalid URL format. Must be a valid URL starting with http:// or https://'),
submission_notes: z.string().trim()
.max(1000, 'Submission notes must be less than 1000 characters')
.optional()
.or(z.literal('')),
}); });
// ============================================ // ============================================
@@ -172,6 +196,14 @@ export const rideModelValidationSchema = z.object({
ride_type: z.string().trim().min(1, 'Ride type is required').max(100, 'Ride type must be less than 100 characters'), ride_type: z.string().trim().min(1, 'Ride type is required').max(100, 'Ride type must be less than 100 characters'),
description: z.string().trim().max(2000, 'Description must be less than 2000 characters').optional().or(z.literal('')), description: z.string().trim().max(2000, 'Description must be less than 2000 characters').optional().or(z.literal('')),
manufacturer_id: z.string().uuid('Invalid manufacturer ID').optional(), manufacturer_id: z.string().uuid('Invalid manufacturer ID').optional(),
source_url: z.string().trim().optional().or(z.literal('')).refine((val) => {
if (!val || val === '') return true;
return z.string().url().safeParse(val).success;
}, 'Invalid URL format. Must be a valid URL starting with http:// or https://'),
submission_notes: z.string().trim()
.max(1000, 'Submission notes must be less than 1000 characters')
.optional()
.or(z.literal('')),
}); });
// ============================================ // ============================================

View File

@@ -23,6 +23,8 @@ export interface ParkSubmissionData {
banner_image_id?: string | null; banner_image_id?: string | null;
card_image_url?: string | null; card_image_url?: string | null;
card_image_id?: string | null; card_image_id?: string | null;
source_url?: string;
submission_notes?: string;
} }
export interface RideSubmissionData { export interface RideSubmissionData {
@@ -58,6 +60,8 @@ export interface RideSubmissionData {
card_image_url?: string | null; card_image_url?: string | null;
card_image_id?: string | null; card_image_id?: string | null;
image_url?: string | null; image_url?: string | null;
source_url?: string;
submission_notes?: string;
} }
export interface CompanySubmissionData { export interface CompanySubmissionData {
@@ -76,6 +80,8 @@ export interface CompanySubmissionData {
banner_image_id?: string | null; banner_image_id?: string | null;
card_image_url?: string | null; card_image_url?: string | null;
card_image_id?: string | null; card_image_id?: string | null;
source_url?: string;
submission_notes?: string;
} }
export interface RideModelSubmissionData { export interface RideModelSubmissionData {
@@ -89,6 +95,8 @@ export interface RideModelSubmissionData {
banner_image_id?: string | null; banner_image_id?: string | null;
card_image_url?: string | null; card_image_url?: string | null;
card_image_id?: string | null; card_image_id?: string | null;
source_url?: string;
submission_notes?: string;
} }
export interface TimelineEventItemData { export interface TimelineEventItemData {