mirror of
https://github.com/pacnpal/thrilltrack-explorer.git
synced 2025-12-23 19:11:12 -05:00
Refactor: Update image upload components
This commit is contained in:
@@ -12,6 +12,7 @@ import { Ruler, Save, X } from 'lucide-react';
|
||||
import { Combobox } from '@/components/ui/combobox';
|
||||
import { useCompanyHeadquarters } from '@/hooks/useAutocompleteData';
|
||||
import { useUserRole } from '@/hooks/useUserRole';
|
||||
import { EntityImageUploader } from '@/components/upload/EntityImageUploader';
|
||||
|
||||
const designerSchema = z.object({
|
||||
name: z.string().min(1, 'Name is required'),
|
||||
@@ -20,7 +21,12 @@ const designerSchema = z.object({
|
||||
person_type: z.enum(['company', 'individual', 'firm', 'organization']),
|
||||
website_url: z.string().url().optional().or(z.literal('')),
|
||||
founded_year: z.number().min(1800).max(new Date().getFullYear()).optional(),
|
||||
headquarters_location: z.string().optional()
|
||||
headquarters_location: z.string().optional(),
|
||||
logo_url: z.string().optional(),
|
||||
banner_image_id: z.string().optional(),
|
||||
banner_image_url: z.string().optional(),
|
||||
card_image_id: z.string().optional(),
|
||||
card_image_url: z.string().optional()
|
||||
});
|
||||
|
||||
type DesignerFormData = z.infer<typeof designerSchema>;
|
||||
@@ -50,7 +56,12 @@ export function DesignerForm({ onSubmit, onCancel, initialData }: DesignerFormPr
|
||||
person_type: initialData?.person_type || 'company',
|
||||
website_url: initialData?.website_url || '',
|
||||
founded_year: initialData?.founded_year || undefined,
|
||||
headquarters_location: initialData?.headquarters_location || ''
|
||||
headquarters_location: initialData?.headquarters_location || '',
|
||||
logo_url: initialData?.logo_url || '',
|
||||
banner_image_id: initialData?.banner_image_id || '',
|
||||
banner_image_url: initialData?.banner_image_url || '',
|
||||
card_image_id: initialData?.card_image_id || '',
|
||||
card_image_url: initialData?.card_image_url || ''
|
||||
}
|
||||
});
|
||||
|
||||
@@ -169,6 +180,24 @@ export function DesignerForm({ onSubmit, onCancel, initialData }: DesignerFormPr
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Images */}
|
||||
<EntityImageUploader
|
||||
images={{
|
||||
logo: { url: watch('logo_url') },
|
||||
banner: { url: watch('banner_image_url'), id: watch('banner_image_id') },
|
||||
card: { url: watch('card_image_url'), id: watch('card_image_id') }
|
||||
}}
|
||||
onImagesChange={(images) => {
|
||||
if (images.logo_url !== undefined) setValue('logo_url', images.logo_url);
|
||||
if (images.banner_image_id !== undefined) setValue('banner_image_id', images.banner_image_id);
|
||||
if (images.banner_image_url !== undefined) setValue('banner_image_url', images.banner_image_url);
|
||||
if (images.card_image_id !== undefined) setValue('card_image_id', images.card_image_id);
|
||||
if (images.card_image_url !== undefined) setValue('card_image_url', images.card_image_url);
|
||||
}}
|
||||
showLogo={true}
|
||||
entityType="designer"
|
||||
/>
|
||||
|
||||
{/* Actions */}
|
||||
<div className="flex gap-3 justify-end">
|
||||
<Button type="button" variant="outline" onClick={onCancel}>
|
||||
|
||||
@@ -12,6 +12,7 @@ import { Building2, Save, X } from 'lucide-react';
|
||||
import { Combobox } from '@/components/ui/combobox';
|
||||
import { useCompanyHeadquarters } from '@/hooks/useAutocompleteData';
|
||||
import { useUserRole } from '@/hooks/useUserRole';
|
||||
import { EntityImageUploader } from '@/components/upload/EntityImageUploader';
|
||||
|
||||
const manufacturerSchema = z.object({
|
||||
name: z.string().min(1, 'Name is required'),
|
||||
@@ -20,7 +21,12 @@ const manufacturerSchema = z.object({
|
||||
person_type: z.enum(['company', 'individual', 'firm', 'organization']),
|
||||
website_url: z.string().url().optional().or(z.literal('')),
|
||||
founded_year: z.number().min(1800).max(new Date().getFullYear()).optional(),
|
||||
headquarters_location: z.string().optional()
|
||||
headquarters_location: z.string().optional(),
|
||||
logo_url: z.string().optional(),
|
||||
banner_image_id: z.string().optional(),
|
||||
banner_image_url: z.string().optional(),
|
||||
card_image_id: z.string().optional(),
|
||||
card_image_url: z.string().optional()
|
||||
});
|
||||
|
||||
type ManufacturerFormData = z.infer<typeof manufacturerSchema>;
|
||||
@@ -50,7 +56,12 @@ export function ManufacturerForm({ onSubmit, onCancel, initialData }: Manufactur
|
||||
person_type: initialData?.person_type || 'company',
|
||||
website_url: initialData?.website_url || '',
|
||||
founded_year: initialData?.founded_year || undefined,
|
||||
headquarters_location: initialData?.headquarters_location || ''
|
||||
headquarters_location: initialData?.headquarters_location || '',
|
||||
logo_url: initialData?.logo_url || '',
|
||||
banner_image_id: initialData?.banner_image_id || '',
|
||||
banner_image_url: initialData?.banner_image_url || '',
|
||||
card_image_id: initialData?.card_image_id || '',
|
||||
card_image_url: initialData?.card_image_url || ''
|
||||
}
|
||||
});
|
||||
|
||||
@@ -169,6 +180,24 @@ export function ManufacturerForm({ onSubmit, onCancel, initialData }: Manufactur
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Images */}
|
||||
<EntityImageUploader
|
||||
images={{
|
||||
logo: { url: watch('logo_url') },
|
||||
banner: { url: watch('banner_image_url'), id: watch('banner_image_id') },
|
||||
card: { url: watch('card_image_url'), id: watch('card_image_id') }
|
||||
}}
|
||||
onImagesChange={(images) => {
|
||||
if (images.logo_url !== undefined) setValue('logo_url', images.logo_url);
|
||||
if (images.banner_image_id !== undefined) setValue('banner_image_id', images.banner_image_id);
|
||||
if (images.banner_image_url !== undefined) setValue('banner_image_url', images.banner_image_url);
|
||||
if (images.card_image_id !== undefined) setValue('card_image_id', images.card_image_id);
|
||||
if (images.card_image_url !== undefined) setValue('card_image_url', images.card_image_url);
|
||||
}}
|
||||
showLogo={true}
|
||||
entityType="manufacturer"
|
||||
/>
|
||||
|
||||
{/* Actions */}
|
||||
<div className="flex gap-3 justify-end">
|
||||
<Button type="button" variant="outline" onClick={onCancel}>
|
||||
|
||||
@@ -12,6 +12,7 @@ import { FerrisWheel, Save, X } from 'lucide-react';
|
||||
import { Combobox } from '@/components/ui/combobox';
|
||||
import { useCompanyHeadquarters } from '@/hooks/useAutocompleteData';
|
||||
import { useUserRole } from '@/hooks/useUserRole';
|
||||
import { EntityImageUploader } from '@/components/upload/EntityImageUploader';
|
||||
|
||||
const operatorSchema = z.object({
|
||||
name: z.string().min(1, 'Name is required'),
|
||||
@@ -20,7 +21,12 @@ const operatorSchema = z.object({
|
||||
person_type: z.enum(['company', 'individual', 'firm', 'organization']),
|
||||
website_url: z.string().url().optional().or(z.literal('')),
|
||||
founded_year: z.number().min(1800).max(new Date().getFullYear()).optional(),
|
||||
headquarters_location: z.string().optional()
|
||||
headquarters_location: z.string().optional(),
|
||||
logo_url: z.string().optional(),
|
||||
banner_image_id: z.string().optional(),
|
||||
banner_image_url: z.string().optional(),
|
||||
card_image_id: z.string().optional(),
|
||||
card_image_url: z.string().optional()
|
||||
});
|
||||
|
||||
type OperatorFormData = z.infer<typeof operatorSchema>;
|
||||
@@ -50,7 +56,12 @@ export function OperatorForm({ onSubmit, onCancel, initialData }: OperatorFormPr
|
||||
person_type: initialData?.person_type || 'company',
|
||||
website_url: initialData?.website_url || '',
|
||||
founded_year: initialData?.founded_year || undefined,
|
||||
headquarters_location: initialData?.headquarters_location || ''
|
||||
headquarters_location: initialData?.headquarters_location || '',
|
||||
logo_url: initialData?.logo_url || '',
|
||||
banner_image_id: initialData?.banner_image_id || '',
|
||||
banner_image_url: initialData?.banner_image_url || '',
|
||||
card_image_id: initialData?.card_image_id || '',
|
||||
card_image_url: initialData?.card_image_url || ''
|
||||
}
|
||||
});
|
||||
|
||||
@@ -169,6 +180,24 @@ export function OperatorForm({ onSubmit, onCancel, initialData }: OperatorFormPr
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Images */}
|
||||
<EntityImageUploader
|
||||
images={{
|
||||
logo: { url: watch('logo_url') },
|
||||
banner: { url: watch('banner_image_url'), id: watch('banner_image_id') },
|
||||
card: { url: watch('card_image_url'), id: watch('card_image_id') }
|
||||
}}
|
||||
onImagesChange={(images) => {
|
||||
if (images.logo_url !== undefined) setValue('logo_url', images.logo_url);
|
||||
if (images.banner_image_id !== undefined) setValue('banner_image_id', images.banner_image_id);
|
||||
if (images.banner_image_url !== undefined) setValue('banner_image_url', images.banner_image_url);
|
||||
if (images.card_image_id !== undefined) setValue('card_image_id', images.card_image_id);
|
||||
if (images.card_image_url !== undefined) setValue('card_image_url', images.card_image_url);
|
||||
}}
|
||||
showLogo={true}
|
||||
entityType="operator"
|
||||
/>
|
||||
|
||||
{/* Actions */}
|
||||
<div className="flex gap-3 justify-end">
|
||||
<Button type="button" variant="outline" onClick={onCancel}>
|
||||
|
||||
@@ -12,6 +12,7 @@ import { Building2, Save, X } from 'lucide-react';
|
||||
import { Combobox } from '@/components/ui/combobox';
|
||||
import { useCompanyHeadquarters } from '@/hooks/useAutocompleteData';
|
||||
import { useUserRole } from '@/hooks/useUserRole';
|
||||
import { EntityImageUploader } from '@/components/upload/EntityImageUploader';
|
||||
|
||||
const propertyOwnerSchema = z.object({
|
||||
name: z.string().min(1, 'Name is required'),
|
||||
@@ -20,7 +21,12 @@ const propertyOwnerSchema = z.object({
|
||||
person_type: z.enum(['company', 'individual', 'firm', 'organization']),
|
||||
website_url: z.string().url().optional().or(z.literal('')),
|
||||
founded_year: z.number().min(1800).max(new Date().getFullYear()).optional(),
|
||||
headquarters_location: z.string().optional()
|
||||
headquarters_location: z.string().optional(),
|
||||
logo_url: z.string().optional(),
|
||||
banner_image_id: z.string().optional(),
|
||||
banner_image_url: z.string().optional(),
|
||||
card_image_id: z.string().optional(),
|
||||
card_image_url: z.string().optional()
|
||||
});
|
||||
|
||||
type PropertyOwnerFormData = z.infer<typeof propertyOwnerSchema>;
|
||||
@@ -50,7 +56,12 @@ export function PropertyOwnerForm({ onSubmit, onCancel, initialData }: PropertyO
|
||||
person_type: initialData?.person_type || 'company',
|
||||
website_url: initialData?.website_url || '',
|
||||
founded_year: initialData?.founded_year || undefined,
|
||||
headquarters_location: initialData?.headquarters_location || ''
|
||||
headquarters_location: initialData?.headquarters_location || '',
|
||||
logo_url: initialData?.logo_url || '',
|
||||
banner_image_id: initialData?.banner_image_id || '',
|
||||
banner_image_url: initialData?.banner_image_url || '',
|
||||
card_image_id: initialData?.card_image_id || '',
|
||||
card_image_url: initialData?.card_image_url || ''
|
||||
}
|
||||
});
|
||||
|
||||
@@ -169,6 +180,24 @@ export function PropertyOwnerForm({ onSubmit, onCancel, initialData }: PropertyO
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Images */}
|
||||
<EntityImageUploader
|
||||
images={{
|
||||
logo: { url: watch('logo_url') },
|
||||
banner: { url: watch('banner_image_url'), id: watch('banner_image_id') },
|
||||
card: { url: watch('card_image_url'), id: watch('card_image_id') }
|
||||
}}
|
||||
onImagesChange={(images) => {
|
||||
if (images.logo_url !== undefined) setValue('logo_url', images.logo_url);
|
||||
if (images.banner_image_id !== undefined) setValue('banner_image_id', images.banner_image_id);
|
||||
if (images.banner_image_url !== undefined) setValue('banner_image_url', images.banner_image_url);
|
||||
if (images.card_image_id !== undefined) setValue('card_image_id', images.card_image_id);
|
||||
if (images.card_image_url !== undefined) setValue('card_image_url', images.card_image_url);
|
||||
}}
|
||||
showLogo={true}
|
||||
entityType="property_owner"
|
||||
/>
|
||||
|
||||
{/* Actions */}
|
||||
<div className="flex gap-3 justify-end">
|
||||
<Button type="button" variant="outline" onClick={onCancel}>
|
||||
|
||||
@@ -11,6 +11,7 @@ import { Badge } from '@/components/ui/badge';
|
||||
import { SlugField } from '@/components/ui/slug-field';
|
||||
import { Layers, Save, X } from 'lucide-react';
|
||||
import { useUserRole } from '@/hooks/useUserRole';
|
||||
import { EntityImageUploader } from '@/components/upload/EntityImageUploader';
|
||||
|
||||
const rideModelSchema = z.object({
|
||||
name: z.string().min(1, 'Name is required'),
|
||||
@@ -18,7 +19,11 @@ const rideModelSchema = z.object({
|
||||
category: z.string().min(1, 'Category is required'),
|
||||
ride_type: z.string().min(1, 'Ride type is required'),
|
||||
description: z.string().optional(),
|
||||
technical_specs: z.string().optional()
|
||||
technical_specs: z.string().optional(),
|
||||
banner_image_id: z.string().optional(),
|
||||
banner_image_url: z.string().optional(),
|
||||
card_image_id: z.string().optional(),
|
||||
card_image_url: z.string().optional()
|
||||
});
|
||||
|
||||
type RideModelFormData = z.infer<typeof rideModelSchema>;
|
||||
@@ -63,7 +68,11 @@ export function RideModelForm({
|
||||
category: initialData?.category || '',
|
||||
ride_type: initialData?.ride_type || '',
|
||||
description: initialData?.description || '',
|
||||
technical_specs: initialData?.technical_specs || ''
|
||||
technical_specs: initialData?.technical_specs || '',
|
||||
banner_image_id: initialData?.banner_image_id || '',
|
||||
banner_image_url: initialData?.banner_image_url || '',
|
||||
card_image_id: initialData?.card_image_id || '',
|
||||
card_image_url: initialData?.card_image_url || ''
|
||||
}
|
||||
});
|
||||
|
||||
@@ -166,6 +175,22 @@ export function RideModelForm({
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Images */}
|
||||
<EntityImageUploader
|
||||
images={{
|
||||
banner: { url: watch('banner_image_url'), id: watch('banner_image_id') },
|
||||
card: { url: watch('card_image_url'), id: watch('card_image_id') }
|
||||
}}
|
||||
onImagesChange={(images) => {
|
||||
if (images.banner_image_id !== undefined) setValue('banner_image_id', images.banner_image_id);
|
||||
if (images.banner_image_url !== undefined) setValue('banner_image_url', images.banner_image_url);
|
||||
if (images.card_image_id !== undefined) setValue('card_image_id', images.card_image_id);
|
||||
if (images.card_image_url !== undefined) setValue('card_image_url', images.card_image_url);
|
||||
}}
|
||||
showLogo={false}
|
||||
entityType="ride_model"
|
||||
/>
|
||||
|
||||
{/* Actions */}
|
||||
<div className="flex gap-3 justify-end">
|
||||
<Button type="button" variant="outline" onClick={onCancel}>
|
||||
|
||||
Reference in New Issue
Block a user