fix: improve lock icon visibility in API config popover (#12237)

- Replace subtle IconButton with a visible Button + text label ("Locked"/"Unlocked")
- Use text-vscode-descriptionForeground instead of opacity-60 for unlocked state
- Add StandardTooltip explaining the lock function on hover
- Ensure cursor:pointer is always present
- Add i18n keys for "locked"/"unlocked" labels in all 18 locales
- Update tests to match new styling classes

webview-ui/src/components/chat/ApiConfigSelector.tsx

@@ -232,16 +232,39 @@ export const ApiConfigSelector = ({
 								onClick={handleEditClick}
 								tooltip={false}
 							/>
-							<IconButton
-								iconClass={lockApiConfigAcrossModes ? "codicon-lock" : "codicon-unlock"}
-								title={
+							<StandardTooltip
+								content={
 									lockApiConfigAcrossModes
 										? t("chat:unlockApiConfigAcrossModes")
 										: t("chat:lockApiConfigAcrossModes")
-								}
-								className={lockApiConfigAcrossModes ? "text-vscode-focusBorder" : "opacity-60"}
-								onClick={onToggleLockApiConfig}
-							/>
+								}>
+								<Button
+									aria-label={
+										lockApiConfigAcrossModes
+											? t("chat:unlockApiConfigAcrossModes")
+											: t("chat:lockApiConfigAcrossModes")
+									}
+									className={cn(
+										"inline-flex items-center gap-1 px-1.5 py-1 h-7 rounded-md text-xs",
+										"bg-transparent border-none cursor-pointer",
+										"transition-all duration-150",
+										"hover:bg-[rgba(255,255,255,0.06)]",
+										"focus:outline-none focus-visible:ring-1 focus-visible:ring-vscode-focusBorder",
+										lockApiConfigAcrossModes
+											? "text-vscode-focusBorder opacity-100"
+											: "text-vscode-descriptionForeground opacity-90 hover:opacity-100",
+									)}
+									onClick={onToggleLockApiConfig}>
+									<span
+										className={cn(
+											"codicon",
+											lockApiConfigAcrossModes ? "codicon-lock" : "codicon-unlock",
+										)}
+										style={{ fontSize: 14 }}
+									/>
+									<span>{lockApiConfigAcrossModes ? t("chat:locked") : t("chat:unlocked")}</span>
+								</Button>
+							</StandardTooltip>
 						</div>
 
 						{/* Info icon and title on the right with matching spacing */}

webview-ui/src/components/chat/__tests__/ChatTextArea.lockApiConfig.spec.tsx

@@ -78,8 +78,8 @@ describe("ChatTextArea - lockApiConfigAcrossModes toggle", () => {
 
 			const button = openPopoverAndGetLockToggle("chat:lockApiConfigAcrossModes")
 			expect(button).toBeInTheDocument()
-			// Unlocked state has muted opacity
-			expect(button.className).toContain("opacity-60")
+			// Unlocked state has visible but muted style
+			expect(button.className).toContain("text-vscode-descriptionForeground")
 			expect(button.className).not.toContain("text-vscode-focusBorder")
 		})
 
@@ -95,7 +95,7 @@ describe("ChatTextArea - lockApiConfigAcrossModes toggle", () => {
 			expect(button).toBeInTheDocument()
 			// Locked state has the focus border highlight color
 			expect(button.className).toContain("text-vscode-focusBorder")
-			expect(button.className).not.toContain("opacity-60")
+			expect(button.className).not.toContain("text-vscode-descriptionForeground")
 		})
 
 		it("renders in unlocked state when lockApiConfigAcrossModes is undefined (default)", () => {
@@ -108,7 +108,7 @@ describe("ChatTextArea - lockApiConfigAcrossModes toggle", () => {
 			const button = openPopoverAndGetLockToggle("chat:lockApiConfigAcrossModes")
 			expect(button).toBeInTheDocument()
 			// Default (undefined/falsy) renders in unlocked style
-			expect(button.className).toContain("opacity-60")
+			expect(button.className).toContain("text-vscode-descriptionForeground")
 		})
 	})
 

webview-ui/src/i18n/locales/ca/chat.json

@@ -505,5 +505,7 @@
 		"title": "Proveïdor ja no compatible",
 		"message": "Ho sentim, aquest proveïdor ja no és compatible. Hem vist molt pocs usuaris de Roo que realment l'utilitzaven i necessitem reduir l'abast del nostre codi per poder seguir avançant ràpidament i servir bé la nostra comunitat en aquest espai. Va ser una decisió molt difícil, però ens permet centrar-nos en el que més t'importa. Ho sabem, és una llàstima.",
 		"openSettings": "Obrir configuració"
-	}
+	},
+	"locked": "Bloquejat",
+	"unlocked": "Desbloquejat"
 }

webview-ui/src/i18n/locales/de/chat.json

@@ -505,5 +505,7 @@
 		"title": "Anbieter wird nicht mehr unterstützt",
 		"message": "Leider wird dieser Anbieter nicht mehr unterstützt. Wir haben festgestellt, dass nur sehr wenige Roo-Nutzer ihn tatsächlich verwendet haben, und wir müssen den Umfang unserer Codebasis reduzieren, damit wir weiterhin schnell liefern und unserer Community in diesem Bereich gut dienen können. Es war eine wirklich schwere Entscheidung, aber sie ermöglicht uns, uns auf das zu konzentrieren, was dir am wichtigsten ist. Es ist ärgerlich, das wissen wir.",
 		"openSettings": "Einstellungen öffnen"
-	}
+	},
+	"locked": "Gesperrt",
+	"unlocked": "Entsperrt"
 }

webview-ui/src/i18n/locales/en/chat.json

@@ -493,5 +493,7 @@
 		"title": "Provider no longer supported",
 		"message": "Sorry, this provider is no longer supported. We saw very few Roo users actually using it and we need to reduce the surface area of our codebase so we can keep shipping fast and serving our community well in this space. It was a really hard decision but it lets us focus on what matters most to you. It sucks, we know.",
 		"openSettings": "Open Settings"
-	}
+	},
+	"locked": "Locked",
+	"unlocked": "Unlocked"
 }

webview-ui/src/i18n/locales/es/chat.json

@@ -505,5 +505,7 @@
 		"title": "Proveedor ya no compatible",
 		"message": "Lo sentimos, este proveedor ya no es compatible. Vimos que muy pocos usuarios de Roo lo usaban realmente y necesitamos reducir el alcance de nuestro código para poder seguir avanzando rápido y servir bien a nuestra comunidad en este espacio. Fue una decisión muy difícil, pero nos permite enfocarnos en lo que más te importa. Lo sabemos, es una lástima.",
 		"openSettings": "Abrir configuración"
-	}
+	},
+	"locked": "Bloqueado",
+	"unlocked": "Desbloqueado"
 }

webview-ui/src/i18n/locales/fr/chat.json

@@ -505,5 +505,7 @@
 		"title": "Fournisseur plus pris en charge",
 		"message": "Désolé, ce fournisseur n'est plus pris en charge. Nous avons constaté que très peu d'utilisateurs de Roo l'utilisaient réellement et nous devons réduire la portée de notre code pour continuer à avancer rapidement et bien servir notre communauté. C'était une décision vraiment difficile, mais elle nous permet de nous concentrer sur ce qui compte le plus pour toi. C'est rageant, on le sait.",
 		"openSettings": "Ouvrir les paramètres"
-	}
+	},
+	"locked": "Verrouillé",
+	"unlocked": "Déverrouillé"
 }

webview-ui/src/i18n/locales/hi/chat.json

@@ -505,5 +505,7 @@
 		"title": "प्रदाता अब समर्थित नहीं है",
 		"message": "क्षमा करें, यह प्रदाता अब समर्थित नहीं है। हमने देखा कि बहुत कम Roo उपयोगकर्ता वास्तव में इसका उपयोग कर रहे थे और हमें अपने कोडबेस का दायरा कम करने की आवश्यकता है ताकि हम तेज़ी से काम करना और अपने समुदाय की अच्छी सेवा करना जारी रख सकें। यह वाकई एक कठिन निर्णय था, लेकिन इससे हम उस पर ध्यान केंद्रित कर सकते हैं जो तुम्हारे लिए सबसे ज़्यादा मायने रखता है। हम जानते हैं, यह बुरा लगता है।",
 		"openSettings": "सेटिंग्स खोलें"
-	}
+	},
+	"locked": "लॉक",
+	"unlocked": "अनलॉक"
 }

webview-ui/src/i18n/locales/id/chat.json

@@ -511,5 +511,7 @@
 		"title": "Penyedia tidak lagi didukung",
 		"message": "Maaf, penyedia ini tidak lagi didukung. Kami melihat sangat sedikit pengguna Roo yang benar-benar menggunakannya dan kami perlu mengurangi cakupan kode kami agar bisa terus bergerak cepat dan melayani komunitas kami dengan baik. Ini adalah keputusan yang sangat sulit, tapi ini memungkinkan kami fokus pada apa yang paling penting bagimu. Memang menyebalkan, kami tahu.",
 		"openSettings": "Buka Pengaturan"
-	}
+	},
+	"locked": "Terkunci",
+	"unlocked": "Tidak terkunci"
 }

webview-ui/src/i18n/locales/it/chat.json

@@ -505,5 +505,7 @@
 		"title": "Provider non più supportato",
 		"message": "Ci dispiace, questo provider non è più supportato. Abbiamo visto che pochissimi utenti di Roo lo utilizzavano effettivamente e dobbiamo ridurre la portata del nostro codice per continuare a procedere velocemente e servire bene la nostra community. È stata una decisione davvero difficile, ma ci permette di concentrarci su ciò che conta di più per te. Lo sappiamo, è una seccatura.",
 		"openSettings": "Apri impostazioni"
-	}
+	},
+	"locked": "Bloccato",
+	"unlocked": "Sbloccato"
 }

webview-ui/src/i18n/locales/ja/chat.json

@@ -505,5 +505,7 @@
 		"title": "プロバイダーのサポート終了",
 		"message": "申し訳ございませんが、このプロバイダーはサポートを終了しました。実際に利用しているRooユーザーが非常に少なく、コードベースの範囲を縮小して、迅速な開発とコミュニティへの貢献を続ける必要がありました。本当に難しい決断でしたが、あなたにとって最も重要なことに集中するためです。残念ですが、ご理解ください。",
 		"openSettings": "設定を開く"
-	}
+	},
+	"locked": "ロック中",
+	"unlocked": "ロック解除"
 }

webview-ui/src/i18n/locales/ko/chat.json

@@ -505,5 +505,7 @@
 		"title": "공급자 지원 종료",
 		"message": "죄송합니다. 이 공급자는 더 이상 지원되지 않습니다. 실제로 사용하는 Roo 사용자가 매우 적었고, 빠르게 개발하고 커뮤니티에 잘 봉사하기 위해 코드베이스의 범위를 줄여야 했습니다. 정말 어려운 결정이었지만, 당신에게 가장 중요한 것에 집중할 수 있게 해줍니다. 불편을 드려 죄송합니다.",
 		"openSettings": "설정 열기"
-	}
+	},
+	"locked": "잠김",
+	"unlocked": "잠금 해제"
 }

webview-ui/src/i18n/locales/nl/chat.json

@@ -505,5 +505,7 @@
 		"title": "Provider wordt niet meer ondersteund",
 		"message": "Sorry, deze provider wordt niet meer ondersteund. We zagen dat heel weinig Roo-gebruikers het daadwerkelijk gebruikten en we moeten de omvang van onze codebase verkleinen zodat we snel kunnen blijven leveren en onze community goed kunnen blijven bedienen. Het was een heel moeilijke beslissing, maar het stelt ons in staat om ons te richten op wat het belangrijkst voor je is. Het is vervelend, dat weten we.",
 		"openSettings": "Instellingen openen"
-	}
+	},
+	"locked": "Vergrendeld",
+	"unlocked": "Ontgrendeld"
 }

webview-ui/src/i18n/locales/pl/chat.json

@@ -505,5 +505,7 @@
 		"title": "Dostawca nie jest już obsługiwany",
 		"message": "Przepraszamy, ten dostawca nie jest już obsługiwany. Zauważyliśmy, że bardzo niewielu użytkowników Roo faktycznie z niego korzystało, a my musimy zmniejszyć zakres naszego kodu, aby móc dalej szybko dostarczać i dobrze służyć naszej społeczności. To była naprawdę trudna decyzja, ale pozwala nam skupić się na tym, co jest dla ciebie najważniejsze. Wiemy, że to frustrujące.",
 		"openSettings": "Otwórz ustawienia"
-	}
+	},
+	"locked": "Zablokowane",
+	"unlocked": "Odblokowane"
 }

webview-ui/src/i18n/locales/pt-BR/chat.json

@@ -505,5 +505,7 @@
 		"title": "Provedor não é mais suportado",
 		"message": "Desculpe, este provedor não é mais suportado. Percebemos que muito poucos usuários do Roo realmente o utilizavam e precisamos reduzir o escopo do nosso código para continuar entregando rápido e servindo bem nossa comunidade. Foi uma decisão muito difícil, mas nos permite focar no que mais importa para você. Sabemos que é chato.",
 		"openSettings": "Abrir configurações"
-	}
+	},
+	"locked": "Bloqueado",
+	"unlocked": "Desbloqueado"
 }

webview-ui/src/i18n/locales/ru/chat.json

@@ -506,5 +506,7 @@
 		"title": "Провайдер больше не поддерживается",
 		"message": "К сожалению, этот провайдер больше не поддерживается. Мы заметили, что очень немногие пользователи Roo действительно им пользовались, и нам нужно сократить объём кодовой базы, чтобы продолжать быстро развиваться и хорошо служить нашему сообществу. Это было очень непростое решение, но оно позволяет нам сосредоточиться на том, что для тебя важнее всего. Мы знаем, что это неприятно.",
 		"openSettings": "Открыть настройки"
-	}
+	},
+	"locked": "Заблокировано",
+	"unlocked": "Разблокировано"
 }

webview-ui/src/i18n/locales/tr/chat.json

@@ -506,5 +506,7 @@
 		"title": "Sağlayıcı artık desteklenmiyor",
 		"message": "Üzgünüz, bu sağlayıcı artık desteklenmiyor. Çok az Roo kullanıcısının bunu gerçekten kullandığını gördük ve hızlı gelişmeye devam edip topluluğumuza iyi hizmet verebilmek için kod tabanımızın kapsamını daraltmamız gerekiyor. Gerçekten zor bir karardı ama senin için en önemli olana odaklanmamızı sağlıyor. Bunun can sıkıcı olduğunu biliyoruz.",
 		"openSettings": "Ayarları aç"
-	}
+	},
+	"locked": "Kilitli",
+	"unlocked": "Kilitsiz"
 }

webview-ui/src/i18n/locales/vi/chat.json

@@ -506,5 +506,7 @@
 		"title": "Nhà cung cấp không còn được hỗ trợ",
 		"message": "Xin lỗi, nhà cung cấp này không còn được hỗ trợ. Chúng tôi nhận thấy rất ít người dùng Roo thực sự sử dụng nó và chúng tôi cần thu hẹp phạm vi mã nguồn để tiếp tục phát triển nhanh và phục vụ tốt cộng đồng. Đây là một quyết định thực sự khó khăn nhưng nó cho phép chúng tôi tập trung vào điều quan trọng nhất với bạn. Chúng tôi biết điều này thật phiền, xin thông cảm.",
 		"openSettings": "Mở cài đặt"
-	}
+	},
+	"locked": "Đã khóa",
+	"unlocked": "Đã mở khóa"
 }

webview-ui/src/i18n/locales/zh-CN/chat.json

@@ -506,5 +506,7 @@
 		"title": "供应商不再受支持",
 		"message": "抱歉，此供应商已不再受支持。我们发现实际使用它的 Roo 用户非常少，我们需要缩减代码库的范围，以便继续快速交付并更好地服务社区。这是一个非常艰难的决定，但它能让我们专注于对你最重要的事情。我们知道这很遗憾。",
 		"openSettings": "打开设置"
-	}
+	},
+	"locked": "已锁定",
+	"unlocked": "未锁定"
 }

webview-ui/src/i18n/locales/zh-TW/chat.json

@@ -496,5 +496,7 @@
 		"title": "供應商不再受支援",
 		"message": "抱歉，此供應商已不再受支援。我們發現實際使用它的 Roo 使用者非常少，我們需要縮減程式碼庫的範圍，以便繼續快速交付並更好地服務社群。這是一個非常艱難的決定，但它能讓我們專注於對你最重要的事情。我們知道這很遺憾。",
 		"openSettings": "開啟設定"
-	}
+	},
+	"locked": "已鎖定",
+	"unlocked": "未鎖定"
 }