From 1d7cff22cb80429cd545fa131c970dc7ef6d2862 Mon Sep 17 00:00:00 2001
From: Ryan Crabbe <rcrabbe@berkeley.edu>
Date: Thu, 19 Mar 2026 08:57:10 -0700
Subject: [PATCH] feat(ui): add click-to-copy icon on User ID in internal users
 table

Add a CopyOutlined icon next to the truncated User ID that copies
the full UUID to clipboard on click. Follows the existing pattern
used in model_hub_table_columns.tsx.
---
 .../src/components/view_users/columns.tsx     | 22 +++++++++++++++----
 1 file changed, 18 insertions(+), 4 deletions(-)

diff --git a/ui/litellm-dashboard/src/components/view_users/columns.tsx b/ui/litellm-dashboard/src/components/view_users/columns.tsx
index 73750d7a48..4b9fad8f23 100644
--- a/ui/litellm-dashboard/src/components/view_users/columns.tsx
+++ b/ui/litellm-dashboard/src/components/view_users/columns.tsx
@@ -3,7 +3,8 @@ import { Badge, Grid, Icon } from "@tremor/react";
 import { Tooltip, Checkbox } from "antd";
 import { UserInfo } from "./types";
 import { PencilAltIcon, TrashIcon, InformationCircleIcon, RefreshIcon } from "@heroicons/react/outline";
-import { formatNumberWithCommas } from "@/utils/dataUtils";
+import { CopyOutlined } from "@ant-design/icons";
+import { formatNumberWithCommas, copyToClipboard } from "@/utils/dataUtils";
 
 interface SelectionOptions {
   selectedUsers: UserInfo[];
@@ -29,9 +30,22 @@ export const columns = (
       accessorKey: "user_id",
       enableSorting: true,
       cell: ({ row }) => (
-        <Tooltip title={row.original.user_id}>
-          <span className="text-xs">{row.original.user_id ? `${row.original.user_id.slice(0, 7)}...` : "-"}</span>
-        </Tooltip>
+        <div className="flex items-center space-x-2">
+          <Tooltip title={row.original.user_id}>
+            <span className="text-xs">{row.original.user_id ? `${row.original.user_id.slice(0, 7)}...` : "-"}</span>
+          </Tooltip>
+          {row.original.user_id && (
+            <Tooltip title="Copy User ID">
+              <CopyOutlined
+                onClick={(e) => {
+                  e.stopPropagation();
+                  copyToClipboard(row.original.user_id, "User ID copied to clipboard");
+                }}
+                className="cursor-pointer text-gray-500 hover:text-blue-500 text-xs"
+              />
+            </Tooltip>
+          )}
+        </div>
       ),
     },
     {