Security recovery: hold sweep, dashboard updates, and admin fixes.

2026-07-01 05:51:38 +00:00
parent 38526f17b5
commit cacc52ec24
45 changed files with 1452 additions and 474 deletions
@@ -147,6 +147,20 @@ export default function AdminPaymentsPage() {
    }
  };

+  const handleReactivate = async (payment: PaymentWithDetails) => {
+    setProcessing(true);
+    try {
+      await paymentsApi.reactivate(payment.id);
+      toast.success(locale === 'es' ? 'Reserva reactivada' : 'Booking reactivated');
+      setSelectedPayment(null);
+      loadData();
+    } catch (error: any) {
+      toast.error(error.message || 'Failed to reactivate booking');
+    } finally {
+      setProcessing(false);
+    }
+  };
+
  const handleRefund = async (id: string) => {
    if (!confirm('Are you sure you want to process this refund?')) return;

@@ -178,7 +192,7 @@ export default function AdminPaymentsPage() {
  const downloadCSV = () => {
    if (!exportData) return;
    
-    const headers = ['Payment ID', 'Amount', 'Currency', 'Provider', 'Status', 'Reference', 'Paid At', 'Created At', 'Attendee Name', 'Attendee Email', 'Event Title', 'Event Date'];
+    const headers = ['Payment ID', 'Amount', 'Currency', 'Provider', 'Status', 'Reference', 'Paid At', 'Created At', 'Attendee Name', 'Attendee Email', 'RUC', 'Event Title', 'Event Date'];
    const rows = exportData.payments.map(p => [
      p.paymentId,
      p.amount,
@@ -190,6 +204,7 @@ export default function AdminPaymentsPage() {
      p.createdAt,
      `${p.attendeeFirstName} ${p.attendeeLastName || ''}`.trim(),
      p.attendeeEmail || '',
+      p.attendeeRuc || '',
      p.eventTitle,
      p.eventDate,
    ]);
@@ -225,6 +240,7 @@ export default function AdminPaymentsPage() {
      refunded: 'bg-blue-100 text-blue-700',
      failed: 'bg-red-100 text-red-700',
      cancelled: 'bg-gray-100 text-gray-700',
+      on_hold: 'bg-slate-100 text-slate-600',
    };
    const labels: Record<string, string> = {
      pending: locale === 'es' ? 'Pendiente' : 'Pending',
@@ -233,6 +249,7 @@ export default function AdminPaymentsPage() {
      refunded: locale === 'es' ? 'Reembolsado' : 'Refunded',
      failed: locale === 'es' ? 'Fallido' : 'Failed',
      cancelled: locale === 'es' ? 'Cancelado' : 'Cancelled',
+      on_hold: locale === 'es' ? 'En Espera' : 'On Hold',
    };
    return (
      <span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${styles[status] || 'bg-gray-100 text-gray-700'}`}>
@@ -343,6 +360,8 @@ export default function AdminPaymentsPage() {
    payments.filter(p => p.status === 'paid')
  );
  const pendingApprovalBookingsCount = getUniqueBookingsCount(visiblePendingApprovalPayments);
+  const onHoldPayments = payments.filter(p => p.status === 'on_hold');
+  const onHoldBookingsCount = getUniqueBookingsCount(onHoldPayments);

  if (loading) {
    return (
@@ -414,6 +433,9 @@ export default function AdminPaymentsPage() {
                  {selectedPayment.ticket.attendeePhone && (
                    <p className="text-sm text-gray-600">{selectedPayment.ticket.attendeePhone}</p>
                  )}
+                  {selectedPayment.ticket.attendeeRuc && (
+                    <p className="text-sm text-gray-600">RUC: {selectedPayment.ticket.attendeeRuc}</p>
+                  )}
                </div>
              )}
              
@@ -475,6 +497,15 @@ export default function AdminPaymentsPage() {
              </div>
            </div>
            
+            {selectedPayment.status === 'on_hold' && (
+              <div className="mb-3">
+                <Button variant="outline" onClick={() => handleReactivate(selectedPayment)} isLoading={processing} className="w-full min-h-[44px]">
+                  <ArrowPathIcon className="w-5 h-5 mr-2" />
+                  {locale === 'es' ? 'Reactivar (volver a pendiente)' : 'Reactivate (back to pending)'}
+                </Button>
+              </div>
+            )}
+
            <div className="flex gap-3">
              <Button onClick={() => handleApprove(selectedPayment)} isLoading={processing} className="flex-1 min-h-[44px]">
                <CheckCircleIcon className="w-5 h-5 mr-2" />
@@ -486,13 +517,15 @@ export default function AdminPaymentsPage() {
                {locale === 'es' ? 'Rechazar' : 'Reject'}
              </Button>
            </div>
-            
-            <div className="pt-2 border-t">
-              <Button variant="outline" onClick={() => handleSendReminder(selectedPayment)} isLoading={sendingReminder} className="w-full min-h-[44px]">
-                <EnvelopeIcon className="w-5 h-5 mr-2" />
-                {locale === 'es' ? 'Enviar recordatorio' : 'Send reminder'}
-              </Button>
-            </div>
+
+            {selectedPayment.status !== 'on_hold' && (
+              <div className="pt-2 border-t">
+                <Button variant="outline" onClick={() => handleSendReminder(selectedPayment)} isLoading={sendingReminder} className="w-full min-h-[44px]">
+                  <EnvelopeIcon className="w-5 h-5 mr-2" />
+                  {locale === 'es' ? 'Enviar recordatorio' : 'Send reminder'}
+                </Button>
+              </div>
+            )}
            </div>
          </Card>
        </div>
@@ -627,7 +660,7 @@ export default function AdminPaymentsPage() {
      )}

      {/* Summary Cards */}
-      <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 mb-6">
+      <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-5 gap-4 mb-6">
        <Card className="p-4">
          <div className="flex items-center gap-3">
            <div className="w-10 h-10 bg-yellow-100 rounded-full flex items-center justify-center">
@@ -642,6 +675,20 @@ export default function AdminPaymentsPage() {
            </div>
          </div>
        </Card>
+        <Card className="p-4">
+          <div className="flex items-center gap-3">
+            <div className="w-10 h-10 bg-slate-100 rounded-full flex items-center justify-center">
+              <ClockIcon className="w-5 h-5 text-slate-600" />
+            </div>
+            <div>
+              <p className="text-sm text-gray-500">{locale === 'es' ? 'En Espera' : 'On Hold'}</p>
+              <p className="text-xl font-bold text-slate-600">{onHoldBookingsCount}</p>
+              {onHoldPayments.length !== onHoldBookingsCount && (
+                <p className="text-xs text-gray-400">({onHoldPayments.length} tickets)</p>
+              )}
+            </div>
+          </div>
+        </Card>
        <Card className="p-4">
          <div className="flex items-center gap-3">
            <div className="w-10 h-10 bg-gray-100 rounded-full flex items-center justify-center">
@@ -816,6 +863,7 @@ export default function AdminPaymentsPage() {
                  <option value="paid">{locale === 'es' ? 'Pagado' : 'Paid'}</option>
                  <option value="refunded">{locale === 'es' ? 'Reembolsado' : 'Refunded'}</option>
                  <option value="failed">{locale === 'es' ? 'Fallido' : 'Failed'}</option>
+                  <option value="on_hold">{locale === 'es' ? 'En Espera' : 'On Hold'}</option>
                </select>
              </div>
              <div>
@@ -897,6 +945,7 @@ export default function AdminPaymentsPage() {
                <thead className="bg-secondary-gray">
                  <tr>
                    <th className="text-left px-4 py-2 text-xs font-medium text-gray-500 uppercase tracking-wider">{locale === 'es' ? 'Asistente' : 'Attendee'}</th>
+                    <th className="text-left px-4 py-2 text-xs font-medium text-gray-500 uppercase tracking-wider">RUC</th>
                    <th className="text-left px-4 py-2 text-xs font-medium text-gray-500 uppercase tracking-wider">{locale === 'es' ? 'Evento' : 'Event'}</th>
                    <th className="text-left px-4 py-2 text-xs font-medium text-gray-500 uppercase tracking-wider">{locale === 'es' ? 'Monto' : 'Amount'}</th>
                    <th className="text-left px-4 py-2 text-xs font-medium text-gray-500 uppercase tracking-wider">{locale === 'es' ? 'Método' : 'Method'}</th>
@@ -906,7 +955,7 @@ export default function AdminPaymentsPage() {
                </thead>
                <tbody className="divide-y divide-secondary-light-gray">
                  {filteredPayments.length === 0 ? (
-                    <tr><td colSpan={6} className="px-4 py-12 text-center text-gray-500 text-sm">{locale === 'es' ? 'No se encontraron pagos' : 'No payments found'}</td></tr>
+                    <tr><td colSpan={7} className="px-4 py-12 text-center text-gray-500 text-sm">{locale === 'es' ? 'No se encontraron pagos' : 'No payments found'}</td></tr>
                  ) : (
                    filteredPayments.map((payment) => {
                      const bookingInfo = getBookingInfo(payment);
@@ -920,6 +969,7 @@ export default function AdminPaymentsPage() {
                              </div>
                            ) : <span className="text-gray-400 text-sm">-</span>}
                          </td>
+                          <td className="px-4 py-3 text-sm text-gray-600">{payment.ticket?.attendeeRuc || '-'}</td>
                          <td className="px-4 py-3 text-sm truncate max-w-[150px]">{payment.event?.title || '-'}</td>
                          <td className="px-4 py-3">
                            <p className="font-medium text-sm">{formatCurrency(bookingInfo.bookingTotal, payment.currency)}</p>
@@ -933,11 +983,16 @@ export default function AdminPaymentsPage() {
                          <td className="px-4 py-3">{getStatusBadge(payment.status)}</td>
                          <td className="px-4 py-3">
                            <div className="flex items-center justify-end gap-1">
-                              {(payment.status === 'pending' || payment.status === 'pending_approval') && (
+                              {(payment.status === 'pending' || payment.status === 'pending_approval' || payment.status === 'on_hold') && (
                                <Button size="sm" onClick={() => setSelectedPayment(payment)} className="text-xs px-2 py-1">
                                  {locale === 'es' ? 'Revisar' : 'Review'}
                                </Button>
                              )}
+                              {payment.status === 'on_hold' && (
+                                <Button size="sm" variant="outline" onClick={() => handleReactivate(payment)} className="text-xs px-2 py-1">
+                                  {locale === 'es' ? 'Reactivar' : 'Reactivate'}
+                                </Button>
+                              )}
                              {payment.status === 'paid' && (
                                <Button size="sm" variant="outline" onClick={() => handleRefund(payment.id)} className="text-xs px-2 py-1">
                                  {t('admin.payments.refund')}
@@ -990,11 +1045,16 @@ export default function AdminPaymentsPage() {
                    <div className="flex items-center justify-between mt-2 pt-2 border-t border-gray-100">
                      <p className="text-[10px] text-gray-400">{formatDate(payment.createdAt)}</p>
                      <div className="flex items-center gap-1">
-                        {(payment.status === 'pending' || payment.status === 'pending_approval') && (
+                        {(payment.status === 'pending' || payment.status === 'pending_approval' || payment.status === 'on_hold') && (
                          <Button size="sm" onClick={() => setSelectedPayment(payment)} className="text-xs px-2.5 py-1.5 min-h-[36px]">
                            {locale === 'es' ? 'Revisar' : 'Review'}
                          </Button>
                        )}
+                        {payment.status === 'on_hold' && (
+                          <Button size="sm" variant="outline" onClick={() => handleReactivate(payment)} className="text-xs px-2.5 py-1.5 min-h-[36px]">
+                            {locale === 'es' ? 'Reactivar' : 'Reactivate'}
+                          </Button>
+                        )}
                        {payment.status === 'paid' && (
                          <Button size="sm" variant="outline" onClick={() => handleRefund(payment.id)} className="text-xs px-2.5 py-1.5 min-h-[36px]">
                            {t('admin.payments.refund')}
@@ -1040,6 +1100,7 @@ export default function AdminPaymentsPage() {
                  <option value="paid">{locale === 'es' ? 'Pagado' : 'Paid'}</option>
                  <option value="refunded">{locale === 'es' ? 'Reembolsado' : 'Refunded'}</option>
                  <option value="failed">{locale === 'es' ? 'Fallido' : 'Failed'}</option>
+                  <option value="on_hold">{locale === 'es' ? 'En Espera' : 'On Hold'}</option>
                </select>
              </div>
              <div>