230417/smartagenda_pap
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor: Safely access shop properties with optional chaining and reorder the shop null check in the Booking page.

Browse Source
This commit is contained in:
230417
2026-03-10 16:14:43 +00:00
parent 13a350676c
commit 4971d5ee53
1 changed files with 12 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
web/src/pages/Booking.tsx
View File

@@ -29,10 +29,8 @@ export default function Booking() {
const [date, setDate] = useState('');
const [slot, setSlot] = useState('');
if (!shop) return <div className="text-center py-12 text-slate-600">Barbearia não encontrada</div>;
const selectedService = shop.services.find((s) => s.id === serviceId);
const selectedBarber = shop.barbers.find((b) => b.id === barberId);
const selectedService = shop?.services.find((s) => s.id === serviceId);
const selectedBarber = shop?.barbers.find((b) => b.id === barberId);
/**
* Função para gerar horários padrão se não houver horários específicos predefinidos
@@ -80,6 +78,8 @@ export default function Booking() {
return slots.filter((slot) => !bookedSlots.includes(slot));
}, [selectedBarber, date, barberId, appointments]);
if (!shop) return <div className="text-center py-12 text-slate-600">Barbearia não encontrada</div>;
const canSubmit = serviceId && barberId && date && slot;
/**
@@ -124,8 +124,8 @@ export default function Booking() {
<div className="flex flex-col items-center flex-1">
<div
className={`w-10 h-10 rounded-full flex items-center justify-center border-2 transition-all ${step.completed
? 'bg-gradient-to-br from-amber-500 to-amber-600 border-amber-600 text-white shadow-md'
: 'bg-white border-slate-300 text-slate-400'
? 'bg-gradient-to-br from-amber-500 to-amber-600 border-amber-600 text-white shadow-md'
: 'bg-white border-slate-300 text-slate-400'
}`}
>
{step.completed ? <CheckCircle2 size={18} /> : <step.icon size={18} />}
@@ -154,8 +154,8 @@ export default function Booking() {
key={s.id}
onClick={() => setService(s.id)}
className={`p-4 rounded-xl border-2 text-left transition-all ${serviceId === s.id
? 'border-amber-500 bg-gradient-to-br from-amber-50 to-amber-100/50 shadow-md scale-[1.02]'
: 'border-slate-200 hover:border-amber-300 hover:bg-amber-50/50'
? 'border-amber-500 bg-gradient-to-br from-amber-50 to-amber-100/50 shadow-md scale-[1.02]'
: 'border-slate-200 hover:border-amber-300 hover:bg-amber-50/50'
}`}
>
<div className="flex items-center justify-between mb-1">
@@ -180,8 +180,8 @@ export default function Booking() {
key={b.id}
onClick={() => setBarber(b.id)}
className={`px-4 py-2.5 rounded-full border-2 text-sm font-medium transition-all ${barberId === b.id
? 'border-amber-500 bg-gradient-to-r from-amber-500 to-amber-600 text-white shadow-md'
: 'border-slate-200 text-slate-700 hover:border-amber-300 hover:bg-amber-50'
? 'border-amber-500 bg-gradient-to-r from-amber-500 to-amber-600 text-white shadow-md'
: 'border-slate-200 text-slate-700 hover:border-amber-300 hover:bg-amber-50'
}`}
>
{b.name}
@@ -221,8 +221,8 @@ export default function Booking() {
key={h}
onClick={() => setSlot(h)}
className={`px-4 py-2 rounded-lg border-2 text-sm font-medium transition-all ${slot === h
? 'border-amber-500 bg-gradient-to-r from-amber-500 to-amber-600 text-white shadow-md'
: 'border-slate-200 text-slate-700 hover:border-amber-300 hover:bg-amber-50'
? 'border-amber-500 bg-gradient-to-r from-amber-500 to-amber-600 text-white shadow-md'
: 'border-slate-200 text-slate-700 hover:border-amber-300 hover:bg-amber-50'
}`}
>
{h}