import AdminLayout from '@/Layouts/AdminLayout'; import { Head, useForm, Link } from '@inertiajs/react'; import { Save, Plus, X, Calendar, Clock, DollarSign, Mail, ArrowLeft } from 'lucide-react'; import { useState } from 'react'; interface Props { settings: { booking_slots: string[]; booking_duration: number; audit_fee_ngn: number; audit_fee_gbp: number; blackout_dates: string[]; }; } export default function Settings({ settings }: Props) { const { data, setData, patch, processing, errors } = useForm({ booking_slots: settings.booking_slots, booking_duration: settings.booking_duration, audit_fee_ngn: settings.audit_fee_ngn, audit_fee_gbp: settings.audit_fee_gbp, blackout_dates: settings.blackout_dates, }); const [newSlot, setNewSlot] = useState(''); const [newBlackoutDate, setNewBlackoutDate] = useState(''); function addSlot() { if (newSlot && !data.booking_slots.includes(newSlot)) { setData('booking_slots', [...data.booking_slots, newSlot].sort()); setNewSlot(''); } } function removeSlot(slot: string) { setData('booking_slots', data.booking_slots.filter(s => s !== slot)); } function addBlackoutDate() { if (newBlackoutDate && !data.blackout_dates.includes(newBlackoutDate)) { setData('blackout_dates', [...data.blackout_dates, newBlackoutDate].sort()); setNewBlackoutDate(''); } } function removeBlackoutDate(date: string) { setData('blackout_dates', data.blackout_dates.filter(d => d !== date)); } function submit(e: React.FormEvent) { e.preventDefault(); patch(route('admin.settings.bookings.update'), { preserveScroll: true, }); } return (
Back to Settings

Booking Settings

Manage availability, pricing, and notification preferences.

{/* Availability Section */}

Daily Time Slots

{data.booking_slots.map(slot => ( {slot} ))}
setNewSlot(e.target.value)} className="flex-1 px-4 py-2 bg-white border border-[#E8E6DF] rounded-lg text-[13px] outline-none focus:border-primary" />
setData('booking_duration', parseInt(e.target.value))} className="w-32 px-4 py-2 bg-white border border-[#E8E6DF] rounded-lg text-[13px] outline-none focus:border-primary" />
{/* Blackout Dates Section */}

Blackout Dates

{data.blackout_dates.map(date => ( {new Date(date).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' })} ))} {data.blackout_dates.length === 0 && ( No dates blocked yet. )}
setNewBlackoutDate(e.target.value)} className="flex-1 px-4 py-2 bg-white border border-[#E8E6DF] rounded-lg text-[13px] outline-none focus:border-primary" />
{/* Pricing Section */}

Audit Report Pricing

₦ setData('audit_fee_ngn', parseInt(e.target.value))} className="w-full pl-8 pr-4 py-2 bg-white border border-[#E8E6DF] rounded-lg text-[13px] outline-none focus:border-primary" />
£ setData('audit_fee_gbp', parseInt(e.target.value))} className="w-full pl-8 pr-4 py-2 bg-white border border-[#E8E6DF] rounded-lg text-[13px] outline-none focus:border-primary" />
{/* Save Button */}
); }