feat:simplify dx and improve payment functions

apps/web/src/routes/admin.tsx

@@ -477,6 +477,12 @@ function AdminPage() {
 										<th className="px-6 py-4 text-left font-medium text-sm text-white/60">
 											16+
 										</th>
+										<th className="px-6 py-4 text-left font-medium text-sm text-white/60">
+											Betaald
+										</th>
+										<th className="px-6 py-4 text-left font-medium text-sm text-white/60">
+											Betaald
+										</th>
 										<th className="px-6 py-4 text-left font-medium text-sm text-white/60">
 											Datum
 										</th>
@@ -486,7 +492,7 @@ function AdminPage() {
 									{registrationsQuery.isLoading ? (
 										<tr>
 											<td
-												colSpan={9}
+												colSpan={10}
 												className="px-6 py-8 text-center text-white/60"
 											>
 												Laden...
@@ -495,7 +501,7 @@ function AdminPage() {
 									) : registrations.length === 0 ? (
 										<tr>
 											<td
-												colSpan={9}
+												colSpan={10}
 												className="px-6 py-8 text-center text-white/60"
 											>
 												Geen registraties gevonden
@@ -564,6 +570,47 @@ function AdminPage() {
 															"-"
 														)}
 													</td>
+													<td className="px-6 py-4">
+														{isPerformer ? (
+															<span className="text-white/40">-</span>
+														) : reg.paymentStatus === "paid" ? (
+															<span className="inline-flex items-center gap-1 text-green-400 text-sm">
+																<svg
+																	className="h-4 w-4"
+																	fill="none"
+																	viewBox="0 0 24 24"
+																	stroke="currentColor"
+																	strokeWidth={2}
+																>
+																	<title>Betaald icoon</title>
+																	<path
+																		strokeLinecap="round"
+																		strokeLinejoin="round"
+																		d="M5 13l4 4L19 7"
+																	/>
+																</svg>
+																Betaald
+															</span>
+														) : (
+															<span className="inline-flex items-center gap-1 text-sm text-yellow-400">
+																<svg
+																	className="h-4 w-4"
+																	fill="none"
+																	viewBox="0 0 24 24"
+																	stroke="currentColor"
+																	strokeWidth={2}
+																>
+																	<title>In afwachting icoon</title>
+																	<path
+																		strokeLinecap="round"
+																		strokeLinejoin="round"
+																		d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"
+																	/>
+																</svg>
+																Open
+															</span>
+														)}
+													</td>
 													<td className="px-6 py-4 text-white/60">
 														{new Date(reg.createdAt).toLocaleDateString(
 															"nl-BE",