From aa8fbd1e23c9ee503b871d0de945eee5d4af4d2c Mon Sep 17 00:00:00 2001
From: Fringg <egor.andrianovv@gmail.com>
Date: Wed, 18 Mar 2026 23:30:18 +0300
Subject: [PATCH] feat: clickable user link to user card in admin payments

---
 src/pages/AdminPayments.tsx | 54 ++++++++++++++++++++++++++++++-------
 src/types/index.ts          |  1 +
 2 files changed, 46 insertions(+), 9 deletions(-)

diff --git a/src/pages/AdminPayments.tsx b/src/pages/AdminPayments.tsx
index eea7686..174435d 100644
--- a/src/pages/AdminPayments.tsx
+++ b/src/pages/AdminPayments.tsx
@@ -478,17 +478,53 @@ export default function AdminPayments() {
                       </div>
 
                       {/* User info */}
-                      {(payment.user_username || payment.user_telegram_id) && (
+                      {(payment.user_username ||
+                        payment.user_telegram_id ||
+                        payment.user_email) && (
                         <div className="mt-2 text-sm text-dark-400">
                           <span className="text-dark-500">{t('admin.payments.user')}:</span>{' '}
-                          {payment.user_username && (
-                            <span className="text-dark-200">@{payment.user_username}</span>
-                          )}
-                          {payment.user_username && payment.user_telegram_id && (
-                            <span className="text-dark-500"> &middot; </span>
-                          )}
-                          {payment.user_telegram_id && (
-                            <span className="text-dark-300">TG: {payment.user_telegram_id}</span>
+                          {payment.user_id ? (
+                            <button
+                              onClick={(e) => {
+                                e.stopPropagation();
+                                navigate(`/admin/users/${payment.user_id}`);
+                              }}
+                              className="inline-flex items-center gap-1 transition-colors hover:underline"
+                            >
+                              {payment.user_username && (
+                                <span className="text-accent-400">@{payment.user_username}</span>
+                              )}
+                              {payment.user_username &&
+                                (payment.user_telegram_id || payment.user_email) && (
+                                  <span className="text-dark-500"> &middot; </span>
+                                )}
+                              {payment.user_telegram_id && (
+                                <span className="text-accent-300">
+                                  TG: {payment.user_telegram_id}
+                                </span>
+                              )}
+                              {!payment.user_telegram_id && payment.user_email && (
+                                <span className="text-accent-300">{payment.user_email}</span>
+                              )}
+                            </button>
+                          ) : (
+                            <>
+                              {payment.user_username && (
+                                <span className="text-dark-200">@{payment.user_username}</span>
+                              )}
+                              {payment.user_username &&
+                                (payment.user_telegram_id || payment.user_email) && (
+                                  <span className="text-dark-500"> &middot; </span>
+                                )}
+                              {payment.user_telegram_id && (
+                                <span className="text-dark-300">
+                                  TG: {payment.user_telegram_id}
+                                </span>
+                              )}
+                              {!payment.user_telegram_id && payment.user_email && (
+                                <span className="text-dark-300">{payment.user_email}</span>
+                              )}
+                            </>
                           )}
                         </div>
                       )}
diff --git a/src/types/index.ts b/src/types/index.ts
index 5c8d509..ad61a5e 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -567,6 +567,7 @@ export interface PendingPayment {
   user_id?: number;
   user_telegram_id?: number;
   user_username?: string | null;
+  user_email?: string | null;
 }
 
 export interface ManualCheckResponse {