refine: improve scope indicator display for modes

- Change all scope badges to lowercase text ('project' / 'global')
- Remove scope badge from selected mode button in chat UI for cleaner appearance
- Add scope badge to all modes (built-in and custom) in dropdown menus
- Keep scope badge visible in modes settings page for clarity
- Remove scope badge from mode name label in modes editor

These changes improve visual consistency and reduce UI clutter while
maintaining clear scope indicators where they're most useful.

Author: heyseth

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

@@ -210,13 +210,6 @@ export const ModeSelector = ({
 							: null,
 					)}>
 					<span className="truncate">{selectedMode?.name || ""}</span>
-					{selectedMode?.source && (
-						<span className="text-[10px] px-1 py-0.5 rounded bg-vscode-badge-background text-vscode-badge-foreground">
-							{selectedMode.source === "project"
-								? t("common:customModes.scope.project")
-								: t("common:customModes.scope.global")}
-						</span>
-					)}
 				</PopoverTrigger>
 			</StandardTooltip>
 			<PopoverContent
@@ -262,7 +255,6 @@ export const ModeSelector = ({
 							<div className="py-1">
 								{filteredModes.map((mode) => {
 									const isSelected = mode.slug === value
-									const isCustomMode = mode.source !== undefined
 									return (
 										<div
 											key={mode.slug}
@@ -279,13 +271,9 @@ export const ModeSelector = ({
 											<div className="flex-1 min-w-0">
 												<div className="flex items-center gap-1.5">
 													<span className="font-bold truncate">{mode.name}</span>
-													{isCustomMode && (
-														<span className="text-[10px] px-1 py-0.5 rounded bg-vscode-badge-background text-vscode-badge-foreground">
-															{mode.source === "project"
-																? t("common:scope.project")
-																: t("common:scope.global")}
-														</span>
-													)}
+													<span className="text-[10px] px-1 py-0.5 rounded bg-vscode-badge-background text-vscode-badge-foreground">
+														{mode.source === "project" ? "project" : "global"}
+													</span>
 												</div>
 												{mode.description && (
 													<div className="text-xs text-vscode-descriptionForeground truncate">

webview-ui/src/components/modes/ModesView.tsx

@@ -623,11 +623,9 @@ const ModesView = ({ onDone }: ModesViewProps) => {
 										<span className="truncate">
 											{getCurrentMode()?.name || t("prompts:modes.selectMode")}
 										</span>
-										{getCurrentMode()?.source && (
+										{getCurrentMode() && (
 											<span className="text-[10px] px-1 py-0.5 rounded bg-vscode-badge-background text-vscode-badge-foreground">
-												{getCurrentMode()?.source === "project"
-													? t("common:scope.project")
-													: t("common:scope.global")}
+												{getCurrentMode()?.source === "project" ? "project" : "global"}
 											</span>
 										)}
 									</div>
@@ -691,13 +689,9 @@ const ModesView = ({ onDone }: ModesViewProps) => {
 																	}}>
 																	{modeConfig.name}
 																</span>
-																{modeConfig.source && (
-																	<span className="text-[10px] px-1 py-0.5 rounded bg-vscode-badge-background text-vscode-badge-foreground">
-																		{modeConfig.source === "project"
-																			? t("common:scope.project")
-																			: t("common:scope.global")}
-																	</span>
-																)}
+																<span className="text-[10px] px-1 py-0.5 rounded bg-vscode-badge-background text-vscode-badge-foreground">
+																	{modeConfig.source === "project" ? "project" : "global"}
+																</span>
 															</div>
 															<span
 																className="text-foreground"
@@ -758,16 +752,7 @@ const ModesView = ({ onDone }: ModesViewProps) => {
 					{visualMode && findModeBySlug(visualMode, customModes) && (
 						<div className="flex gap-3 mb-4">
 							<div className="flex-1">
-								<div className="flex items-center gap-1.5 mb-1">
-									<span className="font-bold">{t("prompts:createModeDialog.name.label")}</span>
-									{findModeBySlug(visualMode, customModes)?.source && (
-										<span className="text-[10px] px-1 py-0.5 rounded bg-vscode-badge-background text-vscode-badge-foreground">
-											{findModeBySlug(visualMode, customModes)?.source === "project"
-												? t("common:customModes.scope.project")
-												: t("common:customModes.scope.global")}
-										</span>
-									)}
-								</div>
+								<div className="font-bold mb-1">{t("prompts:createModeDialog.name.label")}</div>
 								<div className="flex gap-2">
 									<Input
 										type="text"