From d57d3810e43539b57d2f6e494ef647355aa894d8 Mon Sep 17 00:00:00 2001
From: Duy Nguyen <duy@wearetopgroup.com>
Date: Sun, 17 May 2026 18:01:41 +0700
Subject: [PATCH] fix(cli-credentials): clarify agent grant env controls

---
 docs/project-changelog.md                                | 4 ++++
 .../cli-credentials/cli-credential-grant-env-section.tsx | 3 +++
 .../src/pages/cli-credentials/cli-credentials-table.tsx  | 9 ++++++++-
 3 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/docs/project-changelog.md b/docs/project-changelog.md
index 397b99ab..b4923f45 100644
--- a/docs/project-changelog.md
+++ b/docs/project-changelog.md
@@ -34,6 +34,10 @@ Significant changes, features, and fixes in reverse chronological order.
 - Removed the duplicate standalone `CLI Credentials` item from the left sidebar.
 - Added focused coverage for grant env payload semantics and routing contracts.
 
+**Fixes**
+
+- Made agent-grant environment variable controls easier to find by labeling the row action and adding a visible Environment Variables header inside the grant form.
+
 **Security**
 
 - Nested agent-grant get/update/delete/reveal routes now verify the grant belongs to the binary ID in the URL.
diff --git a/ui/web/src/pages/cli-credentials/cli-credential-grant-env-section.tsx b/ui/web/src/pages/cli-credentials/cli-credential-grant-env-section.tsx
index 8a0f48c2..ebff9a70 100644
--- a/ui/web/src/pages/cli-credentials/cli-credential-grant-env-section.tsx
+++ b/ui/web/src/pages/cli-credentials/cli-credential-grant-env-section.tsx
@@ -149,6 +149,9 @@ export function CliCredentialGrantEnvSection({
 
   return (
     <div className="grid gap-2 rounded-md border p-3">
+      <Label className="text-sm font-medium">
+        {t("grants.envVars.title")}
+      </Label>
       <div className="flex items-start gap-3">
         <Switch id="grant-env-override" checked={overrideEnabled} onCheckedChange={handleToggle} className="mt-0.5" />
         <div className="grid gap-0.5">
diff --git a/ui/web/src/pages/cli-credentials/cli-credentials-table.tsx b/ui/web/src/pages/cli-credentials/cli-credentials-table.tsx
index 0e994554..0e2a15b8 100644
--- a/ui/web/src/pages/cli-credentials/cli-credentials-table.tsx
+++ b/ui/web/src/pages/cli-credentials/cli-credentials-table.tsx
@@ -67,8 +67,15 @@ export function CliCredentialsTable({ items, onEdit, onDelete, onUserCreds, onGr
                 <td className="px-4 py-3 text-muted-foreground">{item.timeout_seconds}s</td>
                 <td className="px-4 py-3 text-right">
                   <div className="flex items-center justify-end gap-1">
-                    <Button variant="ghost" size="sm" onClick={() => onGrants(item)} title={t("grants.title", { name: item.binary_name })}>
+                    <Button
+                      variant="ghost"
+                      size="sm"
+                      onClick={() => onGrants(item)}
+                      title={t("grants.title", { name: item.binary_name })}
+                      className="gap-1"
+                    >
                       <Shield className="h-3.5 w-3.5" />
+                      {t("grants.addGrant")}
                     </Button>
                     <Button variant="ghost" size="sm" onClick={() => onUserCreds(item)} title={t("userCredentials.title")}>
                       <Users className="h-3.5 w-3.5" />