mirror of
https://github.com/pacnpal/thrilltrack-explorer.git
synced 2025-12-20 06:31:13 -05:00
Approve database migration
This commit is contained in:
gpt-engineer-app[bot]
60
src/components/moderation/TimelineEventPreview.tsx
Normal file
60
src/components/moderation/TimelineEventPreview.tsx
Normal file
@@ -0,0 +1,60 @@
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
import { Calendar, Tag } from 'lucide-react';
|
||||
import type { TimelineSubmissionData } from '@/types/timeline';
|
||||
|
||||
interface TimelineEventPreviewProps {
|
||||
data: TimelineSubmissionData;
|
||||
}
|
||||
|
||||
export function TimelineEventPreview({ data }: TimelineEventPreviewProps) {
|
||||
const formatEventType = (type: string) => {
|
||||
return type.replace(/_/g, ' ').replace(/\b\w/g, (l) => l.toUpperCase());
|
||||
};
|
||||
|
||||
return (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<Tag className="h-4 w-4" />
|
||||
Timeline Event: {data.title}
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
<div className="grid grid-cols-2 gap-4 text-sm">
|
||||
<div>
|
||||
<span className="font-medium">Event Type:</span>
|
||||
<p className="text-muted-foreground">
|
||||
{formatEventType(data.event_type)}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<span className="font-medium">Date:</span>
|
||||
<p className="text-muted-foreground flex items-center gap-1">
|
||||
<Calendar className="h-3 w-3" />
|
||||
{new Date(data.event_date).toLocaleDateString()}
|
||||
({data.event_date_precision})
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{(data.from_value || data.to_value) && (
|
||||
<div className="flex items-center gap-2 text-sm">
|
||||
<span className="font-medium">Change:</span>
|
||||
<span className="text-muted-foreground">
|
||||
{data.from_value || '—'} → {data.to_value || '—'}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{data.description && (
|
||||
<div>
|
||||
<span className="font-medium text-sm">Description:</span>
|
||||
<p className="text-sm text-muted-foreground mt-1">
|
||||
{data.description}
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
92
src/components/timeline/EntityTimelineManager.tsx
Normal file
92
src/components/timeline/EntityTimelineManager.tsx
Normal file
@@ -0,0 +1,92 @@
|
||||
import { useState } from 'react';
|
||||
import { Plus } from 'lucide-react';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
import { TimelineEventEditorDialog } from './TimelineEventEditorDialog';
|
||||
import { EntityHistoryTimeline } from '@/components/history/EntityHistoryTimeline';
|
||||
import { useQuery } from '@tanstack/react-query';
|
||||
import { supabase } from '@/integrations/supabase/client';
|
||||
import type { EntityType, TimelineEvent } from '@/types/timeline';
|
||||
|
||||
interface EntityTimelineManagerProps {
|
||||
entityType: EntityType;
|
||||
entityId: string;
|
||||
entityName: string;
|
||||
}
|
||||
|
||||
export function EntityTimelineManager({
|
||||
entityType,
|
||||
entityId,
|
||||
entityName,
|
||||
}: EntityTimelineManagerProps) {
|
||||
const [isDialogOpen, setIsDialogOpen] = useState(false);
|
||||
|
||||
// Fetch timeline events
|
||||
const { data: events, refetch } = useQuery({
|
||||
queryKey: ['timeline-events', entityType, entityId],
|
||||
queryFn: async () => {
|
||||
const { data, error } = await supabase
|
||||
.from('entity_timeline_events')
|
||||
.select('*')
|
||||
.eq('entity_type', entityType)
|
||||
.eq('entity_id', entityId)
|
||||
.eq('is_public', true)
|
||||
.not('approved_by', 'is', null)
|
||||
.order('event_date', { ascending: false });
|
||||
|
||||
if (error) throw error;
|
||||
return data as TimelineEvent[];
|
||||
},
|
||||
});
|
||||
|
||||
// Convert to HistoryEvent format for display
|
||||
const historyEvents = events?.map((event) => {
|
||||
// Map timeline event types to history event types
|
||||
let mappedType: 'name_change' | 'status_change' | 'ownership_change' | 'relocation' | 'milestone' = 'milestone';
|
||||
|
||||
if (event.event_type === 'name_change') mappedType = 'name_change';
|
||||
else if (event.event_type === 'status_change') mappedType = 'status_change';
|
||||
else if (event.event_type === 'operator_change' || event.event_type === 'owner_change') mappedType = 'ownership_change';
|
||||
else if (event.event_type === 'location_change') mappedType = 'relocation';
|
||||
|
||||
return {
|
||||
date: event.event_date,
|
||||
title: event.title,
|
||||
description: event.description,
|
||||
type: mappedType,
|
||||
from: event.from_value,
|
||||
to: event.to_value,
|
||||
};
|
||||
}) || [];
|
||||
|
||||
return (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<div className="flex items-center justify-between">
|
||||
<div>
|
||||
<CardTitle>Timeline & History</CardTitle>
|
||||
<CardDescription>
|
||||
Historical events and milestones for {entityName}
|
||||
</CardDescription>
|
||||
</div>
|
||||
<Button onClick={() => setIsDialogOpen(true)} size="sm">
|
||||
<Plus className="mr-2 h-4 w-4" />
|
||||
Add Event
|
||||
</Button>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<EntityHistoryTimeline events={historyEvents} entityName={entityName} />
|
||||
</CardContent>
|
||||
|
||||
<TimelineEventEditorDialog
|
||||
open={isDialogOpen}
|
||||
onOpenChange={setIsDialogOpen}
|
||||
entityType={entityType}
|
||||
entityId={entityId}
|
||||
entityName={entityName}
|
||||
onSuccess={() => refetch()}
|
||||
/>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
386
src/components/timeline/TimelineEventEditorDialog.tsx
Normal file
386
src/components/timeline/TimelineEventEditorDialog.tsx
Normal file
@@ -0,0 +1,386 @@
|
||||
import { useState } from 'react';
|
||||
import { useForm } from 'react-hook-form';
|
||||
import { zodResolver } from '@hookform/resolvers/zod';
|
||||
import * as z from 'zod';
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from '@/components/ui/dialog';
|
||||
import {
|
||||
Form,
|
||||
FormControl,
|
||||
FormDescription,
|
||||
FormField,
|
||||
FormItem,
|
||||
FormLabel,
|
||||
FormMessage,
|
||||
} from '@/components/ui/form';
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from '@/components/ui/select';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Textarea } from '@/components/ui/textarea';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { DatePicker } from '@/components/ui/date-picker';
|
||||
import { Switch } from '@/components/ui/switch';
|
||||
import { Loader2 } from 'lucide-react';
|
||||
import { useAuth } from '@/hooks/useAuth';
|
||||
import { useToast } from '@/hooks/use-toast';
|
||||
import { submitTimelineEvent, submitTimelineEventUpdate } from '@/lib/entitySubmissionHelpers';
|
||||
import type {
|
||||
EntityType,
|
||||
TimelineEventFormData,
|
||||
} from '@/types/timeline';
|
||||
|
||||
// Validation schema
|
||||
const timelineEventSchema = z.object({
|
||||
event_type: z.enum([
|
||||
'name_change',
|
||||
'operator_change',
|
||||
'owner_change',
|
||||
'location_change',
|
||||
'status_change',
|
||||
'closure',
|
||||
'reopening',
|
||||
'renovation',
|
||||
'expansion',
|
||||
'acquisition',
|
||||
'milestone',
|
||||
'other',
|
||||
]),
|
||||
event_date: z.date({
|
||||
message: 'Event date is required',
|
||||
}),
|
||||
event_date_precision: z.enum(['day', 'month', 'year']).default('day'),
|
||||
title: z.string().min(1, 'Title is required').max(200, 'Title is too long'),
|
||||
description: z.string().max(1000, 'Description is too long').optional(),
|
||||
|
||||
// Conditional fields
|
||||
from_value: z.string().max(200).optional(),
|
||||
to_value: z.string().max(200).optional(),
|
||||
from_entity_id: z.string().uuid().optional(),
|
||||
to_entity_id: z.string().uuid().optional(),
|
||||
from_location_id: z.string().uuid().optional(),
|
||||
to_location_id: z.string().uuid().optional(),
|
||||
|
||||
is_public: z.boolean().default(true),
|
||||
});
|
||||
|
||||
interface TimelineEventEditorDialogProps {
|
||||
open: boolean;
|
||||
onOpenChange: (open: boolean) => void;
|
||||
entityType: EntityType;
|
||||
entityId: string;
|
||||
entityName: string;
|
||||
existingEvent?: any;
|
||||
onSuccess?: () => void;
|
||||
}
|
||||
|
||||
export function TimelineEventEditorDialog({
|
||||
open,
|
||||
onOpenChange,
|
||||
entityType,
|
||||
entityId,
|
||||
entityName,
|
||||
existingEvent,
|
||||
onSuccess,
|
||||
}: TimelineEventEditorDialogProps) {
|
||||
const { user } = useAuth();
|
||||
const { toast } = useToast();
|
||||
const [isSubmitting, setIsSubmitting] = useState(false);
|
||||
|
||||
const isEditing = !!existingEvent;
|
||||
|
||||
const form = useForm<TimelineEventFormData>({
|
||||
resolver: zodResolver(timelineEventSchema),
|
||||
defaultValues: existingEvent ? {
|
||||
event_type: existingEvent.event_type,
|
||||
event_date: new Date(existingEvent.event_date),
|
||||
event_date_precision: existingEvent.event_date_precision,
|
||||
title: existingEvent.title,
|
||||
description: existingEvent.description || '',
|
||||
from_value: existingEvent.from_value || '',
|
||||
to_value: existingEvent.to_value || '',
|
||||
from_entity_id: existingEvent.from_entity_id || '',
|
||||
to_entity_id: existingEvent.to_entity_id || '',
|
||||
from_location_id: existingEvent.from_location_id || '',
|
||||
to_location_id: existingEvent.to_location_id || '',
|
||||
is_public: existingEvent.is_public,
|
||||
} : {
|
||||
event_type: 'milestone',
|
||||
event_date: new Date(),
|
||||
event_date_precision: 'day',
|
||||
title: '',
|
||||
description: '',
|
||||
is_public: true,
|
||||
},
|
||||
});
|
||||
|
||||
const selectedEventType = form.watch('event_type');
|
||||
|
||||
const onSubmit = async (data: TimelineEventFormData) => {
|
||||
if (!user) {
|
||||
toast({
|
||||
title: 'Authentication required',
|
||||
description: 'You must be logged in to submit timeline events.',
|
||||
variant: 'destructive',
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
setIsSubmitting(true);
|
||||
try {
|
||||
if (isEditing) {
|
||||
await submitTimelineEventUpdate(existingEvent.id, data, user.id);
|
||||
toast({
|
||||
title: 'Timeline event update submitted',
|
||||
description: 'Your update has been submitted for moderator review.',
|
||||
});
|
||||
} else {
|
||||
await submitTimelineEvent(entityType, entityId, data, user.id);
|
||||
toast({
|
||||
title: 'Timeline event submitted',
|
||||
description: 'Your timeline event has been submitted for moderator review.',
|
||||
});
|
||||
}
|
||||
|
||||
form.reset();
|
||||
onOpenChange(false);
|
||||
onSuccess?.();
|
||||
} catch (error) {
|
||||
console.error('Failed to submit timeline event:', error);
|
||||
toast({
|
||||
title: 'Submission failed',
|
||||
description: error instanceof Error ? error.message : 'Failed to submit timeline event',
|
||||
variant: 'destructive',
|
||||
});
|
||||
} finally {
|
||||
setIsSubmitting(false);
|
||||
}
|
||||
};
|
||||
|
||||
// Event type configurations for conditional field rendering
|
||||
const showFromTo = [
|
||||
'name_change',
|
||||
'operator_change',
|
||||
'owner_change',
|
||||
'status_change',
|
||||
].includes(selectedEventType);
|
||||
|
||||
return (
|
||||
<Dialog open={open} onOpenChange={onOpenChange}>
|
||||
<DialogContent className="max-w-2xl max-h-[90vh] overflow-y-auto">
|
||||
<DialogHeader>
|
||||
<DialogTitle>
|
||||
{isEditing ? 'Edit' : 'Add'} Timeline Event
|
||||
</DialogTitle>
|
||||
<DialogDescription>
|
||||
Add a historical milestone or event for {entityName}.
|
||||
All submissions go through moderator review.
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
|
||||
<Form {...form}>
|
||||
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="event_type"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Event Type</FormLabel>
|
||||
<Select
|
||||
onValueChange={field.onChange}
|
||||
defaultValue={field.value}
|
||||
>
|
||||
<FormControl>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select event type" />
|
||||
</SelectTrigger>
|
||||
</FormControl>
|
||||
<SelectContent>
|
||||
<SelectItem value="name_change">Name Change</SelectItem>
|
||||
<SelectItem value="operator_change">Operator Change</SelectItem>
|
||||
<SelectItem value="owner_change">Ownership Change</SelectItem>
|
||||
<SelectItem value="location_change">Relocation</SelectItem>
|
||||
<SelectItem value="status_change">Status Change</SelectItem>
|
||||
<SelectItem value="closure">Closure</SelectItem>
|
||||
<SelectItem value="reopening">Reopening</SelectItem>
|
||||
<SelectItem value="renovation">Renovation</SelectItem>
|
||||
<SelectItem value="expansion">Expansion</SelectItem>
|
||||
<SelectItem value="acquisition">Acquisition</SelectItem>
|
||||
<SelectItem value="milestone">Milestone</SelectItem>
|
||||
<SelectItem value="other">Other</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="title"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Event Title</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
placeholder="e.g., Renamed to Six Flags"
|
||||
{...field}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormDescription>
|
||||
A brief, descriptive title for this event
|
||||
</FormDescription>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="event_date"
|
||||
render={({ field }) => (
|
||||
<FormItem className="flex flex-col">
|
||||
<FormLabel>Event Date</FormLabel>
|
||||
<DatePicker
|
||||
date={field.value}
|
||||
onSelect={field.onChange}
|
||||
fromYear={1800}
|
||||
toYear={new Date().getFullYear() + 10}
|
||||
/>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="event_date_precision"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Date Precision</FormLabel>
|
||||
<Select
|
||||
onValueChange={field.onChange}
|
||||
defaultValue={field.value}
|
||||
>
|
||||
<FormControl>
|
||||
<SelectTrigger>
|
||||
<SelectValue />
|
||||
</SelectTrigger>
|
||||
</FormControl>
|
||||
<SelectContent>
|
||||
<SelectItem value="day">Exact Day</SelectItem>
|
||||
<SelectItem value="month">Month Only</SelectItem>
|
||||
<SelectItem value="year">Year Only</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{showFromTo && (
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="from_value"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>From</FormLabel>
|
||||
<FormControl>
|
||||
<Input placeholder="Previous value" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="to_value"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>To</FormLabel>
|
||||
<FormControl>
|
||||
<Input placeholder="New value" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="description"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Description (Optional)</FormLabel>
|
||||
<FormControl>
|
||||
<Textarea
|
||||
placeholder="Additional context about this event..."
|
||||
rows={4}
|
||||
{...field}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormDescription>
|
||||
Provide additional details, context, or sources
|
||||
</FormDescription>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="is_public"
|
||||
render={({ field }) => (
|
||||
<FormItem className="flex flex-row items-center justify-between rounded-lg border p-4">
|
||||
<div className="space-y-0.5">
|
||||
<FormLabel className="text-base">Public Event</FormLabel>
|
||||
<FormDescription>
|
||||
Make this event visible to all users
|
||||
</FormDescription>
|
||||
</div>
|
||||
<FormControl>
|
||||
<Switch
|
||||
checked={field.value}
|
||||
onCheckedChange={field.onChange}
|
||||
/>
|
||||
</FormControl>
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<DialogFooter>
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
onClick={() => onOpenChange(false)}
|
||||
disabled={isSubmitting}
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button type="submit" disabled={isSubmitting}>
|
||||
{isSubmitting && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
|
||||
{isEditing ? 'Submit Update' : 'Submit for Review'}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</form>
|
||||
</Form>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
9
src/components/timeline/index.ts
Normal file
9
src/components/timeline/index.ts
Normal file
@@ -0,0 +1,9 @@
|
||||
/**
|
||||
* Timeline Components
|
||||
*
|
||||
* Components for managing entity timeline/historical milestones.
|
||||
* All timeline events flow through the moderation queue.
|
||||
*/
|
||||
|
||||
export { TimelineEventEditorDialog } from './TimelineEventEditorDialog';
|
||||
export { EntityTimelineManager } from './EntityTimelineManager';
|
||||
@@ -584,6 +584,100 @@ export type Database = {
|
||||
}
|
||||
Relationships: []
|
||||
}
|
||||
entity_timeline_events: {
|
||||
Row: {
|
||||
approved_by: string | null
|
||||
created_at: string
|
||||
created_by: string | null
|
||||
description: string | null
|
||||
display_order: number | null
|
||||
entity_id: string
|
||||
entity_type: string
|
||||
event_date: string
|
||||
event_date_precision: string | null
|
||||
event_type: string
|
||||
from_entity_id: string | null
|
||||
from_location_id: string | null
|
||||
from_value: string | null
|
||||
id: string
|
||||
is_public: boolean
|
||||
submission_id: string | null
|
||||
title: string
|
||||
to_entity_id: string | null
|
||||
to_location_id: string | null
|
||||
to_value: string | null
|
||||
updated_at: string
|
||||
}
|
||||
Insert: {
|
||||
approved_by?: string | null
|
||||
created_at?: string
|
||||
created_by?: string | null
|
||||
description?: string | null
|
||||
display_order?: number | null
|
||||
entity_id: string
|
||||
entity_type: string
|
||||
event_date: string
|
||||
event_date_precision?: string | null
|
||||
event_type: string
|
||||
from_entity_id?: string | null
|
||||
from_location_id?: string | null
|
||||
from_value?: string | null
|
||||
id?: string
|
||||
is_public?: boolean
|
||||
submission_id?: string | null
|
||||
title: string
|
||||
to_entity_id?: string | null
|
||||
to_location_id?: string | null
|
||||
to_value?: string | null
|
||||
updated_at?: string
|
||||
}
|
||||
Update: {
|
||||
approved_by?: string | null
|
||||
created_at?: string
|
||||
created_by?: string | null
|
||||
description?: string | null
|
||||
display_order?: number | null
|
||||
entity_id?: string
|
||||
entity_type?: string
|
||||
event_date?: string
|
||||
event_date_precision?: string | null
|
||||
event_type?: string
|
||||
from_entity_id?: string | null
|
||||
from_location_id?: string | null
|
||||
from_value?: string | null
|
||||
id?: string
|
||||
is_public?: boolean
|
||||
submission_id?: string | null
|
||||
title?: string
|
||||
to_entity_id?: string | null
|
||||
to_location_id?: string | null
|
||||
to_value?: string | null
|
||||
updated_at?: string
|
||||
}
|
||||
Relationships: [
|
||||
{
|
||||
foreignKeyName: "entity_timeline_events_from_location_id_fkey"
|
||||
columns: ["from_location_id"]
|
||||
isOneToOne: false
|
||||
referencedRelation: "locations"
|
||||
referencedColumns: ["id"]
|
||||
},
|
||||
{
|
||||
foreignKeyName: "entity_timeline_events_submission_id_fkey"
|
||||
columns: ["submission_id"]
|
||||
isOneToOne: false
|
||||
referencedRelation: "content_submissions"
|
||||
referencedColumns: ["id"]
|
||||
},
|
||||
{
|
||||
foreignKeyName: "entity_timeline_events_to_location_id_fkey"
|
||||
columns: ["to_location_id"]
|
||||
isOneToOne: false
|
||||
referencedRelation: "locations"
|
||||
referencedColumns: ["id"]
|
||||
},
|
||||
]
|
||||
}
|
||||
entity_versions_archive: {
|
||||
Row: {
|
||||
change_reason: string | null
|
||||
|
||||
@@ -134,6 +134,9 @@ export interface CompanyFormData {
|
||||
card_image_id?: string;
|
||||
}
|
||||
|
||||
// Import timeline types
|
||||
import type { TimelineEventFormData, TimelineSubmissionData, EntityType } from '@/types/timeline';
|
||||
|
||||
/**
|
||||
* ⚠️ CRITICAL SECURITY PATTERN ⚠️
|
||||
*
|
||||
@@ -896,3 +899,185 @@ export async function submitPropertyOwnerUpdate(
|
||||
|
||||
return { submitted: true, submissionId: submissionData.id };
|
||||
}
|
||||
|
||||
/**
|
||||
* ⚠️ CRITICAL SECURITY PATTERN ⚠️
|
||||
*
|
||||
* Submits a new timeline event for an entity through the moderation queue.
|
||||
*
|
||||
* DO NOT write directly to entity_timeline_events:
|
||||
* ❌ await supabase.from('entity_timeline_events').insert(data) // BYPASSES MODERATION!
|
||||
* ✅ await submitTimelineEvent(entityType, entityId, data, userId) // CORRECT
|
||||
*
|
||||
* Flow: User Submit → Moderation Queue → Approval → Database Write
|
||||
*
|
||||
* @param entityType - Type of entity (park, ride, company)
|
||||
* @param entityId - ID of the entity
|
||||
* @param data - The timeline event form data
|
||||
* @param userId - The ID of the user submitting
|
||||
* @returns Object containing submitted boolean and submissionId
|
||||
*/
|
||||
export async function submitTimelineEvent(
|
||||
entityType: EntityType,
|
||||
entityId: string,
|
||||
data: TimelineEventFormData,
|
||||
userId: string
|
||||
): Promise<{ submitted: boolean; submissionId: string }> {
|
||||
// Validate user
|
||||
if (!userId) {
|
||||
throw new Error('User ID is required for timeline event submission');
|
||||
}
|
||||
|
||||
// Create submission content (minimal reference data only)
|
||||
const content: Json = {
|
||||
action: 'create',
|
||||
entity_type: entityType,
|
||||
entity_id: entityId,
|
||||
};
|
||||
|
||||
// Create the main submission record
|
||||
const { data: submission, error: submissionError } = await supabase
|
||||
.from('content_submissions')
|
||||
.insert({
|
||||
user_id: userId,
|
||||
submission_type: 'timeline_event',
|
||||
content,
|
||||
status: 'pending',
|
||||
approval_mode: 'full',
|
||||
})
|
||||
.select()
|
||||
.single();
|
||||
|
||||
if (submissionError || !submission) {
|
||||
console.error('Failed to create timeline event submission:', submissionError);
|
||||
throw new Error('Failed to submit timeline event for review');
|
||||
}
|
||||
|
||||
// Create submission item with actual data
|
||||
const itemData: Record<string, any> = {
|
||||
entity_type: entityType,
|
||||
entity_id: entityId,
|
||||
event_type: data.event_type,
|
||||
event_date: data.event_date.toISOString().split('T')[0],
|
||||
event_date_precision: data.event_date_precision,
|
||||
title: data.title,
|
||||
description: data.description,
|
||||
from_value: data.from_value,
|
||||
to_value: data.to_value,
|
||||
from_entity_id: data.from_entity_id,
|
||||
to_entity_id: data.to_entity_id,
|
||||
from_location_id: data.from_location_id,
|
||||
to_location_id: data.to_location_id,
|
||||
is_public: data.is_public ?? true,
|
||||
};
|
||||
|
||||
const { error: itemError } = await supabase
|
||||
.from('submission_items')
|
||||
.insert({
|
||||
submission_id: submission.id,
|
||||
item_type: 'timeline_event',
|
||||
action_type: 'create',
|
||||
item_data: itemData as unknown as Json,
|
||||
status: 'pending',
|
||||
order_index: 0,
|
||||
});
|
||||
|
||||
if (itemError) {
|
||||
console.error('Failed to create timeline event item:', itemError);
|
||||
throw new Error('Failed to submit timeline event item for review');
|
||||
}
|
||||
|
||||
return {
|
||||
submitted: true,
|
||||
submissionId: submission.id,
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* ⚠️ CRITICAL SECURITY PATTERN ⚠️
|
||||
*
|
||||
* Submits an update to an existing timeline event through the moderation queue.
|
||||
*
|
||||
* @param eventId - ID of the existing timeline event
|
||||
* @param data - The updated timeline event data
|
||||
* @param userId - The ID of the user submitting the update
|
||||
* @returns Object containing submitted boolean and submissionId
|
||||
*/
|
||||
export async function submitTimelineEventUpdate(
|
||||
eventId: string,
|
||||
data: TimelineEventFormData,
|
||||
userId: string
|
||||
): Promise<{ submitted: boolean; submissionId: string }> {
|
||||
// Fetch original event
|
||||
const { data: originalEvent, error: fetchError } = await supabase
|
||||
.from('entity_timeline_events')
|
||||
.select('*')
|
||||
.eq('id', eventId)
|
||||
.single();
|
||||
|
||||
if (fetchError || !originalEvent) {
|
||||
throw new Error('Failed to fetch original timeline event');
|
||||
}
|
||||
|
||||
// Create submission
|
||||
const content: Json = {
|
||||
action: 'edit',
|
||||
event_id: eventId,
|
||||
entity_type: originalEvent.entity_type,
|
||||
};
|
||||
|
||||
const { data: submission, error: submissionError } = await supabase
|
||||
.from('content_submissions')
|
||||
.insert({
|
||||
user_id: userId,
|
||||
submission_type: 'timeline_event',
|
||||
content,
|
||||
status: 'pending',
|
||||
approval_mode: 'full',
|
||||
})
|
||||
.select()
|
||||
.single();
|
||||
|
||||
if (submissionError || !submission) {
|
||||
throw new Error('Failed to create timeline event update submission');
|
||||
}
|
||||
|
||||
// Create submission item
|
||||
const itemData: Record<string, any> = {
|
||||
entity_type: originalEvent.entity_type,
|
||||
entity_id: originalEvent.entity_id,
|
||||
event_type: data.event_type,
|
||||
event_date: data.event_date.toISOString().split('T')[0],
|
||||
event_date_precision: data.event_date_precision,
|
||||
title: data.title,
|
||||
description: data.description,
|
||||
from_value: data.from_value,
|
||||
to_value: data.to_value,
|
||||
from_entity_id: data.from_entity_id,
|
||||
to_entity_id: data.to_entity_id,
|
||||
from_location_id: data.from_location_id,
|
||||
to_location_id: data.to_location_id,
|
||||
is_public: data.is_public ?? true,
|
||||
};
|
||||
|
||||
const { error: itemError } = await supabase
|
||||
.from('submission_items')
|
||||
.insert({
|
||||
submission_id: submission.id,
|
||||
item_type: 'timeline_event',
|
||||
action_type: 'edit',
|
||||
item_data: itemData as unknown as Json,
|
||||
original_data: originalEvent as unknown as Json,
|
||||
status: 'pending',
|
||||
order_index: 0,
|
||||
});
|
||||
|
||||
if (itemError) {
|
||||
throw new Error('Failed to submit timeline event update item');
|
||||
}
|
||||
|
||||
return {
|
||||
submitted: true,
|
||||
submissionId: submission.id,
|
||||
};
|
||||
}
|
||||
|
||||
86
src/types/timeline.ts
Normal file
86
src/types/timeline.ts
Normal file
@@ -0,0 +1,86 @@
|
||||
/**
|
||||
* Timeline Event Types
|
||||
*
|
||||
* Type definitions for entity timeline/historical milestone system.
|
||||
* All timeline events flow through moderation queue before being stored.
|
||||
*/
|
||||
|
||||
export type TimelineEventType =
|
||||
| 'name_change'
|
||||
| 'operator_change'
|
||||
| 'owner_change'
|
||||
| 'location_change'
|
||||
| 'status_change'
|
||||
| 'closure'
|
||||
| 'reopening'
|
||||
| 'renovation'
|
||||
| 'expansion'
|
||||
| 'acquisition'
|
||||
| 'milestone'
|
||||
| 'other';
|
||||
|
||||
export type EntityType = 'park' | 'ride' | 'company';
|
||||
|
||||
export type DatePrecision = 'day' | 'month' | 'year';
|
||||
|
||||
/**
|
||||
* Timeline event stored in database after approval
|
||||
*/
|
||||
export interface TimelineEvent {
|
||||
id: string;
|
||||
entity_id: string;
|
||||
entity_type: EntityType;
|
||||
event_type: TimelineEventType;
|
||||
event_date: string;
|
||||
event_date_precision: DatePrecision;
|
||||
title: string;
|
||||
description?: string;
|
||||
|
||||
// Type-specific relational data
|
||||
from_value?: string;
|
||||
to_value?: string;
|
||||
from_entity_id?: string;
|
||||
to_entity_id?: string;
|
||||
from_location_id?: string;
|
||||
to_location_id?: string;
|
||||
|
||||
// Metadata
|
||||
is_public: boolean;
|
||||
display_order: number;
|
||||
created_by?: string;
|
||||
approved_by?: string;
|
||||
submission_id?: string;
|
||||
|
||||
created_at: string;
|
||||
updated_at: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* Form data for creating/editing timeline events
|
||||
*/
|
||||
export interface TimelineEventFormData {
|
||||
event_type: TimelineEventType;
|
||||
event_date: Date;
|
||||
event_date_precision: DatePrecision;
|
||||
title: string;
|
||||
description?: string;
|
||||
|
||||
// Conditional fields based on event_type
|
||||
from_value?: string;
|
||||
to_value?: string;
|
||||
from_entity_id?: string;
|
||||
to_entity_id?: string;
|
||||
from_location_id?: string;
|
||||
to_location_id?: string;
|
||||
|
||||
is_public?: boolean;
|
||||
}
|
||||
|
||||
/**
|
||||
* Complete submission data for timeline events
|
||||
* Includes entity reference and all form data
|
||||
*/
|
||||
export interface TimelineSubmissionData extends TimelineEventFormData {
|
||||
entity_id: string;
|
||||
entity_type: EntityType;
|
||||
}
|
||||
@@ -290,6 +290,9 @@ serve(async (req) => {
|
||||
await deletePhoto(supabase, resolvedData);
|
||||
entityId = resolvedData.photo_id;
|
||||
break;
|
||||
case 'timeline_event':
|
||||
entityId = await createTimelineEvent(supabase, resolvedData, submitterId, authenticatedUserId, submissionId);
|
||||
break;
|
||||
default:
|
||||
throw new Error(`Unknown item type: ${item.item_type}`);
|
||||
}
|
||||
@@ -872,3 +875,42 @@ async function deletePhoto(supabase: any, data: any): Promise<void> {
|
||||
|
||||
if (error) throw new Error(`Failed to delete photo: ${error.message}`);
|
||||
}
|
||||
|
||||
async function createTimelineEvent(
|
||||
supabase: any,
|
||||
data: any,
|
||||
submitterId: string,
|
||||
approvingUserId: string,
|
||||
submissionId: string
|
||||
): Promise<string> {
|
||||
console.log('Creating timeline event');
|
||||
|
||||
const eventData = {
|
||||
entity_id: data.entity_id,
|
||||
entity_type: data.entity_type,
|
||||
event_type: data.event_type,
|
||||
event_date: data.event_date,
|
||||
event_date_precision: data.event_date_precision,
|
||||
title: data.title,
|
||||
description: data.description,
|
||||
from_value: data.from_value,
|
||||
to_value: data.to_value,
|
||||
from_entity_id: data.from_entity_id,
|
||||
to_entity_id: data.to_entity_id,
|
||||
from_location_id: data.from_location_id,
|
||||
to_location_id: data.to_location_id,
|
||||
is_public: data.is_public ?? true,
|
||||
created_by: submitterId,
|
||||
approved_by: approvingUserId,
|
||||
submission_id: submissionId,
|
||||
};
|
||||
|
||||
const { data: event, error } = await supabase
|
||||
.from('entity_timeline_events')
|
||||
.insert(eventData)
|
||||
.select('id')
|
||||
.single();
|
||||
|
||||
if (error) throw new Error(`Failed to create timeline event: ${error.message}`);
|
||||
return event.id;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,66 @@
|
||||
-- Create entity_timeline_events table for historical milestones
|
||||
CREATE TABLE public.entity_timeline_events (
|
||||
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
|
||||
entity_id UUID NOT NULL,
|
||||
entity_type TEXT NOT NULL CHECK (entity_type IN ('park', 'ride', 'company')),
|
||||
event_type TEXT NOT NULL CHECK (event_type IN (
|
||||
'name_change',
|
||||
'operator_change',
|
||||
'owner_change',
|
||||
'location_change',
|
||||
'status_change',
|
||||
'closure',
|
||||
'reopening',
|
||||
'renovation',
|
||||
'expansion',
|
||||
'acquisition',
|
||||
'milestone',
|
||||
'other'
|
||||
)),
|
||||
event_date DATE NOT NULL,
|
||||
event_date_precision TEXT DEFAULT 'day' CHECK (event_date_precision IN ('day', 'month', 'year')),
|
||||
title TEXT NOT NULL,
|
||||
description TEXT,
|
||||
|
||||
-- Type-specific relational data (NO JSON!)
|
||||
from_value TEXT,
|
||||
to_value TEXT,
|
||||
from_entity_id UUID,
|
||||
to_entity_id UUID,
|
||||
from_location_id UUID REFERENCES public.locations(id),
|
||||
to_location_id UUID REFERENCES public.locations(id),
|
||||
|
||||
-- Metadata
|
||||
is_public BOOLEAN NOT NULL DEFAULT true,
|
||||
display_order INTEGER DEFAULT 0,
|
||||
created_by UUID REFERENCES auth.users(id),
|
||||
approved_by UUID,
|
||||
submission_id UUID REFERENCES public.content_submissions(id),
|
||||
|
||||
created_at TIMESTAMP WITH TIME ZONE NOT NULL DEFAULT now(),
|
||||
updated_at TIMESTAMP WITH TIME ZONE NOT NULL DEFAULT now()
|
||||
);
|
||||
|
||||
-- Create indexes for performance
|
||||
CREATE INDEX idx_timeline_events_entity ON public.entity_timeline_events(entity_type, entity_id);
|
||||
CREATE INDEX idx_timeline_events_date ON public.entity_timeline_events(event_date DESC);
|
||||
CREATE INDEX idx_timeline_events_submission ON public.entity_timeline_events(submission_id) WHERE submission_id IS NOT NULL;
|
||||
CREATE INDEX idx_timeline_events_created_by ON public.entity_timeline_events(created_by);
|
||||
|
||||
-- Enable RLS
|
||||
ALTER TABLE public.entity_timeline_events ENABLE ROW LEVEL SECURITY;
|
||||
|
||||
-- Public can view approved public events
|
||||
CREATE POLICY "Public can view public timeline events"
|
||||
ON public.entity_timeline_events FOR SELECT
|
||||
USING (is_public = true AND approved_by IS NOT NULL);
|
||||
|
||||
-- Users can view their own pending submissions
|
||||
CREATE POLICY "Users can view their own timeline submissions"
|
||||
ON public.entity_timeline_events FOR SELECT
|
||||
USING (created_by = auth.uid() AND approved_by IS NULL);
|
||||
|
||||
-- Service role can manage (for approval process)
|
||||
CREATE POLICY "Service role can manage timeline events"
|
||||
ON public.entity_timeline_events FOR ALL
|
||||
USING (auth.jwt() ->> 'role' = 'service_role');
|
||||
Reference in New Issue
Block a user