Fix: Improve booking status page error handling

- Add better error messages for invalid/expired booking tokens
- Replace generic 'Internal server error' with user-friendly explanations
- List possible reasons why booking links might not work
- Add clear call-to-action for new bookings
- Improve user experience with helpful guidance
This commit is contained in:
2025-10-02 15:38:22 +02:00
parent 6502f0d416
commit d7b1ae3525

View File

@@ -114,16 +114,26 @@ export default function BookingStatusPage({ token }: BookingStatusPageProps) {
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
</svg>
</div>
<h2 className="text-xl font-bold text-gray-900 mb-2">Fehler</h2>
<h2 className="text-xl font-bold text-gray-900 mb-2">Link nicht verfügbar</h2>
<p className="text-gray-600 mb-4">
{error?.message || "Der Link ist ungültig oder abgelaufen."}
Dieser Buchungslink ist nicht mehr verfügbar. Mögliche Gründe:
</p>
<a
href="/"
className="inline-flex items-center px-4 py-2 bg-pink-600 text-white rounded-lg hover:bg-pink-700 transition-colors"
>
Zur Startseite
</a>
<ul className="text-sm text-gray-600 text-left mb-6 space-y-2">
<li> Der Link ist abgelaufen</li>
<li> Die Buchung wurde bereits storniert</li>
<li> Der Link wurde bereits verwendet</li>
</ul>
<div className="space-y-3">
<a
href="/"
className="inline-flex items-center px-4 py-2 bg-pink-600 text-white rounded-lg hover:bg-pink-700 transition-colors"
>
Neue Buchung erstellen
</a>
<p className="text-sm text-gray-500">
Bei Fragen wende dich direkt an uns.
</p>
</div>
</div>
</div>
</div>