From 865d38839a511116851757f02f509b93a63b6083 Mon Sep 17 00:00:00 2001
From: Ali AL OGAILI <ali.fadhil9@yahoo.com>
Date: Tue, 24 Mar 2026 14:08:39 +0100
Subject: [PATCH] feat: add Chief Analyst as PHASE-05 in PipelineStepper

---
 .../run-detail/PipelineStepper.test.tsx         | 17 ++++++++---------
 .../run-detail/components/PipelineStepper.tsx   | 15 ++++++++-------
 2 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/ui/__tests__/features/run-detail/PipelineStepper.test.tsx b/ui/__tests__/features/run-detail/PipelineStepper.test.tsx
index a7bd1ba2..e1228da8 100644
--- a/ui/__tests__/features/run-detail/PipelineStepper.test.tsx
+++ b/ui/__tests__/features/run-detail/PipelineStepper.test.tsx
@@ -9,12 +9,13 @@ function makeSteps(overrides: Partial<Record<string, StepStatus>> = {}) {
   ) as Record<string, StepStatus>
 }
 
-test('renders 4 phase labels', () => {
+test('renders 5 phase labels', () => {
   render(<PipelineStepper steps={makeSteps()} />)
-  expect(screen.getByText('Analysts')).toBeInTheDocument()
-  expect(screen.getByText('Researchers')).toBeInTheDocument()
-  expect(screen.getByText('Trader')).toBeInTheDocument()
-  expect(screen.getByText('Risk')).toBeInTheDocument()
+  expect(screen.getByText('Analysis')).toBeInTheDocument()
+  expect(screen.getByText('Research')).toBeInTheDocument()
+  expect(screen.getByText('Trade Plan')).toBeInTheDocument()
+  expect(screen.getByText('Risk Review')).toBeInTheDocument()
+  expect(screen.getByText('Chief Analyst')).toBeInTheDocument()
 })
 
 test('phase is done when all its steps are done', () => {
@@ -22,8 +23,6 @@ test('phase is done when all its steps are done', () => {
     market_analyst: 'done', news_analyst: 'done',
     fundamentals_analyst: 'done', social_analyst: 'done',
   })
-  const { container } = render(<PipelineStepper steps={steps} />)
-  // The Analysts phase dot should have done styling (text-[#adc6ff])
-  // We verify by checking the component renders without error and has 4 phases
-  expect(screen.getAllByText(/Analysts|Researchers|Trader|Risk/).length).toBeGreaterThanOrEqual(4)
+  render(<PipelineStepper steps={steps} />)
+  expect(screen.getAllByText(/Analysis|Research|Trade Plan|Risk Review|Chief Analyst/).length).toBeGreaterThanOrEqual(5)
 })
diff --git a/ui/features/run-detail/components/PipelineStepper.tsx b/ui/features/run-detail/components/PipelineStepper.tsx
index 10a05c12..1f104755 100644
--- a/ui/features/run-detail/components/PipelineStepper.tsx
+++ b/ui/features/run-detail/components/PipelineStepper.tsx
@@ -2,16 +2,17 @@ import { AGENT_STEPS, STEP_PHASE } from '@/lib/types/run'
 import type { AgentStep } from '@/lib/types/run'
 import type { StepStatus } from '@/lib/types/agents'
 
-type Phase = 'analysts' | 'researchers' | 'trader' | 'risk'
+type Phase = 'analysts' | 'researchers' | 'trader' | 'risk' | 'summary'
 type Props = { steps: Record<string, StepStatus> }
 
-const PHASES: Phase[] = ['analysts', 'researchers', 'trader', 'risk']
+const PHASES: Phase[] = ['analysts', 'researchers', 'trader', 'risk', 'summary']
 
 const PHASE_META: Record<Phase, { label: string; code: string; desc: string }> = {
-  analysts:    { label: 'Analysis',    code: 'PHASE-01', desc: 'Market data & signals'   },
-  researchers: { label: 'Research',    code: 'PHASE-02', desc: 'Bull/bear debate'         },
-  trader:      { label: 'Trade Plan',  code: 'PHASE-03', desc: 'Strategy formulation'     },
-  risk:        { label: 'Risk Review', code: 'PHASE-04', desc: 'Risk-adjusted decision'   },
+  analysts:    { label: 'Analysis',      code: 'PHASE-01', desc: 'Market data & signals'   },
+  researchers: { label: 'Research',      code: 'PHASE-02', desc: 'Bull/bear debate'         },
+  trader:      { label: 'Trade Plan',    code: 'PHASE-03', desc: 'Strategy formulation'     },
+  risk:        { label: 'Risk Review',   code: 'PHASE-04', desc: 'Risk-adjusted decision'   },
+  summary:     { label: 'Chief Analyst', code: 'PHASE-05', desc: 'Executive synthesis'      },
 }
 
 function phaseStatus(phase: Phase, steps: Record<string, StepStatus>): StepStatus {
@@ -88,7 +89,7 @@ export default function PipelineStepper({ steps }: Props) {
       </div>
 
       {/* Phase nodes */}
-      <div className="grid grid-cols-4 gap-2">
+      <div className="grid grid-cols-5 gap-2">
         {PHASES.map((phase, i) => {
           const status    = phaseStatus(phase, steps)
           const isDone    = status === 'done'