Commit e84774dbca7f

Vincent Demeester <vincent@sbr.pm>
2026-02-18 14:00:54
feat(dots): show mode with color in custom footer
Mode name now appears in the footer between git branch and provider/model with per-mode colors: fast (green), code-work (yellow), custom (dim). Hidden when in default mode. Removed pre-formatted status from prompt-editor, footer handles styling.
1 parent 45ca1e3
Changed files (2)
dots
dots/pi/agent/extensions/custom-footer.ts
@@ -223,6 +223,22 @@ function getThinkingInfo(pi: any): { emoji: string; level: string } | null {
 	};
 }
 
+// =============================================================================
+// Mode Display
+// =============================================================================
+
+/** Color token for each mode name. Falls back to "dim" for unknown modes. */
+const MODE_COLORS: Record<string, string> = {
+	"fast": "success",
+	"code-work": "warning",
+	"custom": "dim",
+};
+
+function getModeText(modeName: string, theme: any): string {
+	const color = MODE_COLORS[modeName] || "accent";
+	return theme.fg(color, `[${modeName}]`);
+}
+
 // =============================================================================
 // Context Usage
 // =============================================================================
@@ -333,7 +349,15 @@ export default function (pi: ExtensionAPI) {
 					// Extension statuses (from setStatus calls)
 					// getExtensionStatuses() returns ReadonlyMap<string, string>
 					const extensionStatuses = footerData.getExtensionStatuses?.() || new Map();
-					const statusTexts = Array.from(extensionStatuses.values()).filter(Boolean);
+					
+					// Extract mode separately for custom positioning and coloring
+					const modeRaw = extensionStatuses.get("mode");
+					const modeText = modeRaw ? getModeText(modeRaw, theme) : "";
+					
+					// Remaining statuses (exclude mode)
+					const statusTexts = Array.from(extensionStatuses.entries())
+						.filter(([key, val]: [string, string]) => key !== "mode" && Boolean(val))
+						.map(([, val]: [string, string]) => val);
 
 					// Combine components with separators
 					// Format: 16:10  🖥️ kyushu  ~/s/home  main  google-vertex/sonnet-4.5  🧠 ext  R11M W313k $5.289  76.2%/200k (auto)  [extension statuses]
@@ -342,6 +366,7 @@ export default function (pi: ExtensionAPI) {
 						`${hostIcon} ${hostText}`,
 						folderText,
 						gitBranch,
+						modeText,
 						providerModel,
 						thinkingText,
 						tokenStats,
@@ -420,6 +445,13 @@ export default function (pi: ExtensionAPI) {
 					// Context usage: 76.2%/200k (auto)
 					const contextText = contextInfo ? theme.fg("dim", contextInfo) : "";
 
+					// Extension statuses
+					const extensionStatuses = footerData.getExtensionStatuses?.() || new Map();
+					const modeRaw = extensionStatuses.get("mode");
+					const modeText = modeRaw ? getModeText(modeRaw, theme) : "";
+					const statusTexts = Array.from(extensionStatuses.entries())
+						.filter(([key, val]: [string, string]) => key !== "mode" && Boolean(val))
+						.map(([, val]: [string, string]) => val);
 					// Combine components with separators
 					// Format: 16:10  🖥️ kyushu  ~/s/home  main  google-vertex/sonnet-4.5  🧠 ext  R11M W313k $5.289  76.2%/200k (auto)
 					const components = [
@@ -427,10 +459,12 @@ export default function (pi: ExtensionAPI) {
 						`${hostIcon} ${hostText}`,
 						folderText,
 						gitBranch,
+						modeText,
 						providerModel,
 						thinkingText,
 						tokenStats,
 						contextText,
+						...statusTexts,
 					].filter(Boolean);
 
 					const separator = theme.fg("dim", "  ");
dots/pi/agent/extensions/prompt-editor.ts
@@ -448,11 +448,12 @@ const runtime: ModeRuntime = {
 let requestEditorRender: (() => void) | undefined;
 
 // Update the mode status in the footer via ctx.ui.setStatus
+// Sets raw mode name — custom-footer handles formatting and color
 function updateModeStatus(ctx: ExtensionContext): void {
 	if (!ctx.hasUI) return;
 	const mode = runtime.currentMode;
 	if (mode && mode !== "default") {
-		ctx.ui.setStatus("mode", ctx.ui.theme.fg("dim", `[${mode}]`));
+		ctx.ui.setStatus("mode", mode);
 	} else {
 		ctx.ui.setStatus("mode", undefined);
 	}