fix(coding-agent): show Option key on macOS

closes #4289

packages/coding-agent/src/modes/interactive/components/keybinding-hints.ts

@@ -5,20 +5,44 @@
 import { getKeybindings, type Keybinding, type KeyId } from "@earendil-works/pi-tui";
 import { theme } from "../theme/theme.js";
 
-function formatKeys(keys: KeyId[]): string {
+export interface KeyTextFormatOptions {
+	capitalize?: boolean;
+}
+
+function formatKeyPart(part: string, options: KeyTextFormatOptions): string {
+	const displayPart = process.platform === "darwin" && part.toLowerCase() === "alt" ? "option" : part;
+	return options.capitalize ? displayPart.charAt(0).toUpperCase() + displayPart.slice(1) : displayPart;
+}
+
+export function formatKeyText(key: string, options: KeyTextFormatOptions = {}): string {
+	return key
+		.split("/")
+		.map((k) =>
+			k
+				.split("+")
+				.map((part) => formatKeyPart(part, options))
+				.join("+"),
+		)
+		.join("/");
+}
+
+function formatKeys(keys: KeyId[], options: KeyTextFormatOptions = {}): string {
 	if (keys.length === 0) return "";
-	if (keys.length === 1) return keys[0]!;
-	return keys.join("/");
+	return formatKeyText(keys.join("/"), options);
 }
 
 export function keyText(keybinding: Keybinding): string {
 	return formatKeys(getKeybindings().getKeys(keybinding));
 }
 
+export function keyDisplayText(keybinding: Keybinding): string {
+	return formatKeys(getKeybindings().getKeys(keybinding), { capitalize: true });
+}
+
 export function keyHint(keybinding: Keybinding, description: string): string {
 	return theme.fg("dim", keyText(keybinding)) + theme.fg("muted", ` ${description}`);
 }
 
 export function rawKeyHint(key: string, description: string): string {
-	return theme.fg("dim", key) + theme.fg("muted", ` ${description}`);
+	return theme.fg("dim", formatKeyText(key)) + theme.fg("muted", ` ${description}`);
 }