import { useTranslation } from '@/hooks/use-translation'; import React, { useMemo } from 'react'; import { Head, Link, useForm } from '@inertiajs/react'; import AppLayout from '@/layouts/app-layout'; import { Button } from '@/components/ui/button'; import { Input } from '@/components/ui/input'; import { Label } from '@/components/ui/label'; import { Textarea } from '@/components/ui/textarea'; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'; import { Checkbox } from '@/components/ui/checkbox'; import { ArrowLeft } from 'lucide-react'; import { type BreadcrumbItem, type Gravesite, type Member } from '@/types'; interface Props { gravesite: Gravesite; members: Member[]; } export default function GravesitesEdit({ gravesite, members }: Readonly) { const { t } = useTranslation(); const { data, setData, put, processing, errors } = useForm({ cemetery_name: gravesite.cemetery_name || '', section: gravesite.section || '', row: gravesite.row || '', plot_number: gravesite.plot_number, block: gravesite.block || '', status: gravesite.status, gravesite_type: gravesite.gravesite_type, size_length: gravesite.size_length?.toString() || '', size_width: gravesite.size_width?.toString() || '', member_id: gravesite.member_id?.toString() || '', purchase_date: gravesite.purchase_date || '', purchase_price: gravesite.purchase_price?.toString() || '', reserved_date: gravesite.reserved_date || '', reserved_by: gravesite.reserved_by || '', deceased_name: gravesite.deceased_name || '', deceased_hebrew_name: gravesite.deceased_hebrew_name || '', date_of_birth: gravesite.date_of_birth || '', date_of_death: gravesite.date_of_death || '', burial_date: gravesite.burial_date || '', notes: gravesite.notes || '', gps_coordinates: gravesite.gps_coordinates || '', perpetual_care: gravesite.perpetual_care, monument_inscription: gravesite.monument_inscription || '', }); const breadcrumbs: BreadcrumbItem[] = useMemo(() => [ { title: 'Dashboard', href: '/dashboard' }, { title: 'Gravesites', href: '/admin/gravesites' }, { title: `Plot ${gravesite.plot_number}`, href: `/admin/gravesites/${gravesite.id}` }, { title: 'Edit', href: `/admin/gravesites/${gravesite.id}/edit` }, ], [gravesite.id]); const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); put(`/admin/gravesites/${gravesite.id}`); }; return (

{t('Edit Gravesite')}

Plot {gravesite.plot_number}

{t('Location Information')}

setData('cemetery_name', e.target.value)} /> {errors.cemetery_name &&

{errors.cemetery_name}

}
setData('plot_number', e.target.value)} required /> {errors.plot_number &&

{errors.plot_number}

}
setData('section', e.target.value)} /> {errors.section &&

{errors.section}

}
setData('row', e.target.value)} /> {errors.row &&

{errors.row}

}
setData('block', e.target.value)} /> {errors.block &&

{errors.block}

}
setData('gps_coordinates', e.target.value)} /> {errors.gps_coordinates &&

{errors.gps_coordinates}

}

{t('Site Details')}

{errors.status &&

{errors.status}

}
{errors.gravesite_type &&

{errors.gravesite_type}

}
setData('size_length', e.target.value)} /> {errors.size_length &&

{errors.size_length}

}
setData('size_width', e.target.value)} /> {errors.size_width &&

{errors.size_width}

}
setData('perpetual_care', checked as boolean)} />

{t('Ownership Information')}

{errors.member_id &&

{errors.member_id}

}
setData('purchase_date', e.target.value)} /> {errors.purchase_date &&

{errors.purchase_date}

}
setData('purchase_price', e.target.value)} /> {errors.purchase_price &&

{errors.purchase_price}

}
setData('reserved_date', e.target.value)} /> {errors.reserved_date &&

{errors.reserved_date}

}
setData('reserved_by', e.target.value)} /> {errors.reserved_by &&

{errors.reserved_by}

}

{t('Occupancy Information')}

setData('deceased_name', e.target.value)} /> {errors.deceased_name &&

{errors.deceased_name}

}
setData('deceased_hebrew_name', e.target.value)} /> {errors.deceased_hebrew_name &&

{errors.deceased_hebrew_name}

}
setData('date_of_birth', e.target.value)} /> {errors.date_of_birth &&

{errors.date_of_birth}

}
setData('date_of_death', e.target.value)} /> {errors.date_of_death &&

{errors.date_of_death}

}
setData('burial_date', e.target.value)} /> {errors.burial_date &&

{errors.burial_date}

}