From 1f57577c54375a9f5b47f2467972ad8e1a888b47 Mon Sep 17 00:00:00 2001
From: Dotta <bippadotta@protonmail.com>
Date: Thu, 5 Mar 2026 06:04:42 -0600
Subject: [PATCH] Add green 'Recommended' badge to Claude Code and Codex in
 onboarding wizard

Shows a green pill badge on the Claude Code and Codex adapter cards
during CEO agent configuration in the onboarding flow.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 ui/src/components/OnboardingWizard.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/ui/src/components/OnboardingWizard.tsx b/ui/src/components/OnboardingWizard.tsx
index a299bb9e..b54de49b 100644
--- a/ui/src/components/OnboardingWizard.tsx
+++ b/ui/src/components/OnboardingWizard.tsx
@@ -571,13 +571,15 @@ export function OnboardingWizard() {
                           value: "claude_local" as const,
                           label: "Claude Code",
                           icon: Sparkles,
-                          desc: "Local Claude agent"
+                          desc: "Local Claude agent",
+                          recommended: true
                         },
                         {
                           value: "codex_local" as const,
                           label: "Codex",
                           icon: Code,
-                          desc: "Local Codex agent"
+                          desc: "Local Codex agent",
+                          recommended: true
                         },
                         {
                           value: "opencode_local" as const,
@@ -636,6 +638,11 @@ export function OnboardingWizard() {
                             }
                           }}
                         >
+                          {opt.recommended && (
+                            <span className="absolute -top-1.5 -right-1.5 bg-green-500 text-white text-[9px] font-semibold px-1.5 py-0.5 rounded-full leading-none">
+                              Recommended
+                            </span>
+                          )}
                           <opt.icon className="h-4 w-4" />
                           <span className="font-medium">{opt.label}</span>
                           <span className="text-muted-foreground text-[10px]">