From 59b0684ea16b0cd6447e8e9fea7a038f2318eafa Mon Sep 17 00:00:00 2001
From: kang <kangdeng28@gmail.com>
Date: Wed, 3 Jun 2026 11:33:03 +0800
Subject: [PATCH] refactor(agents-console): enhance UI styling and remove
 unused delegation content

Updated the styling of agent tree nodes for improved visual feedback on selection and hover states. Removed deprecated delegation management UI components to streamline the agents console. This refactor enhances user experience and maintains a cleaner codebase.
---
 src/modules/agents/agents-console.tsx | 89 ++++++---------------------
 1 file changed, 19 insertions(+), 70 deletions(-)

diff --git a/src/modules/agents/agents-console.tsx b/src/modules/agents/agents-console.tsx
index 42cfa5c..71abc51 100644
--- a/src/modules/agents/agents-console.tsx
+++ b/src/modules/agents/agents-console.tsx
@@ -148,8 +148,10 @@ function AgentTreeNodes({
         <li key={node.id}>
           <div
             className={cn(
-              "group flex items-center gap-1 rounded-md pr-2",
-              selectedId === node.id ? "bg-primary/5 ring-1 ring-primary/20" : "hover:bg-muted/60",
+              "group flex items-center gap-1 rounded-md pr-2 transition-colors",
+              selectedId === node.id 
+                ? "bg-primary text-primary-foreground shadow-sm" 
+                : "hover:bg-muted/60 text-muted-foreground",
             )}
           >
             {node.children && node.children.length > 0 ? (
@@ -157,7 +159,12 @@ function AgentTreeNodes({
                 type="button"
                 aria-label="toggle children"
                 onClick={() => onToggleExpand(node.id)}
-                className="ml-1 rounded-sm p-0.5 text-muted-foreground hover:bg-muted"
+                className={cn(
+                  "ml-1 rounded-sm p-0.5 transition-colors",
+                  selectedId === node.id 
+                    ? "text-primary-foreground/80 hover:bg-primary-foreground/20 hover:text-primary-foreground" 
+                    : "text-muted-foreground hover:bg-muted hover:text-foreground"
+                )}
               >
                 <ChevronRight
                   className={cn(
@@ -174,11 +181,16 @@ function AgentTreeNodes({
               onClick={() => onSelect(node)}
               className={cn(
                 "flex min-w-0 flex-1 items-center gap-1 rounded-md py-1.5 text-left text-sm",
-                selectedId === node.id && "font-medium text-foreground",
+                selectedId === node.id ? "font-medium" : "text-foreground",
               )}
             >
               <span className="truncate">{node.name}</span>
-              <span className="ml-auto font-mono text-[11px] text-muted-foreground">{node.code}</span>
+              <span className={cn(
+                "ml-auto font-mono text-[11px]",
+                selectedId === node.id ? "text-primary-foreground/70" : "text-muted-foreground"
+              )}>
+                {node.code}
+              </span>
             </button>
           </div>
           {node.children && node.children.length > 0 && expandedIds.has(node.id) ? (
@@ -603,13 +615,6 @@ export function AgentsConsole(): React.ReactElement {
           </Select>
         ) : null}
       </div>
-      <div className="rounded-xl border bg-muted/20 px-3 py-2 text-xs text-muted-foreground">
-        {t("modelGuide", {
-          defaultValue:
-            "代理层负责数据范围（Scope）与授权上限（Ceiling），账号权限请通过角色分配。",
-        })}
-      </div>
-
       {err ? <p className="text-sm text-destructive">{err}</p> : null}
 
       <div className="grid gap-4 lg:grid-cols-[minmax(220px,280px)_1fr]">
@@ -704,9 +709,7 @@ export function AgentsConsole(): React.ReactElement {
                 <TabsList>
                   {canViewRoles ? <TabsTrigger value="roles">{t("tabs.roles")}</TabsTrigger> : null}
                   {canViewUsers ? <TabsTrigger value="users">{t("tabs.users")}</TabsTrigger> : null}
-                  {canManageDelegation ? (
-                    <TabsTrigger value="delegation">{t("tabs.delegation")}</TabsTrigger>
-                  ) : null}
+
                 </TabsList>
                 {canManageNode && !selected.is_root ? (
                   <Button type="button" size="sm" variant="outline" onClick={openEditNode}>
@@ -944,61 +947,7 @@ export function AgentsConsole(): React.ReactElement {
                 </TabsContent>
               ) : null}
 
-              {canManageDelegation ? (
-                <TabsContent value="delegation">
-                  <p className="mb-3 text-sm text-muted-foreground">{t("delegation.hint")}</p>
-                  {delegationGrants.length === 0 ? (
-                    <p className="text-sm text-muted-foreground">{t("delegation.empty")}</p>
-                  ) : (
-                    <div className="rounded-xl border">
-                      <Table>
-                        <TableHeader>
-                          <TableRow>
-                            <TableHead>{t("delegation.permission")}</TableHead>
-                            <TableHead className="w-[140px]">{t("delegation.canDelegate")}</TableHead>
-                          </TableRow>
-                        </TableHeader>
-                        <TableBody>
-                          {delegationGrants.map((grant) => (
-                            <TableRow key={grant.menu_action_id}>
-                              <TableCell>
-                                <div className="font-medium">{grant.name}</div>
-                                <div className="font-mono text-xs text-muted-foreground">
-                                  {grant.permission_code}
-                                </div>
-                              </TableCell>
-                              <TableCell>
-                                <Checkbox
-                                  checked={grant.can_delegate}
-                                  onCheckedChange={(checked) => {
-                                    setDelegationGrants((prev) =>
-                                      prev.map((row) =>
-                                        row.menu_action_id === grant.menu_action_id
-                                          ? { ...row, can_delegate: checked === true }
-                                          : row,
-                                      ),
-                                    );
-                                  }}
-                                />
-                              </TableCell>
-                            </TableRow>
-                          ))}
-                        </TableBody>
-                      </Table>
-                    </div>
-                  )}
-                  <div className="mt-4 flex justify-end">
-                    <Button
-                      type="button"
-                      size="sm"
-                      disabled={delegationSaving || delegationGrants.length === 0}
-                      onClick={() => void saveDelegation()}
-                    >
-                      {t("delegation.save")}
-                    </Button>
-                  </div>
-                </TabsContent>
-              ) : null}
+
             </Tabs>
           )}
         </AdminPageCard>