From 5d60f4661764b75754576beb0d0dbb86e0f5d5b9 Mon Sep 17 00:00:00 2001
From: Christopher Tso <christso@gmail.com>
Date: Thu, 9 Apr 2026 13:09:48 +0000
Subject: [PATCH] fix(studio): use PassRatePill in targets tab for consistency

Replaces ScoreBar (percentage beside the bar) with PassRatePill
(percentage inside the pill) on the Targets screen, matching the
component used in Recent Runs and Experiments screens.

Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
---
 apps/studio/src/components/TargetsTab.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/apps/studio/src/components/TargetsTab.tsx b/apps/studio/src/components/TargetsTab.tsx
index 4a171d5eb..18c24ca19 100644
--- a/apps/studio/src/components/TargetsTab.tsx
+++ b/apps/studio/src/components/TargetsTab.tsx
@@ -9,7 +9,7 @@
 import { useTargets } from '~/lib/api';
 import type { TargetSummary } from '~/lib/types';
 
-import { ScoreBar } from './ScoreBar';
+import { PassRatePill } from './PassRatePill';
 
 export function TargetsTab() {
   const { data, isLoading } = useTargets();
@@ -39,7 +39,7 @@ export function TargetsTab() {
             <th className="px-4 py-3 font-medium text-gray-400">Target</th>
             <th className="px-4 py-3 text-right font-medium text-gray-400">Runs</th>
             <th className="px-4 py-3 text-right font-medium text-gray-400">Experiments</th>
-            <th className="w-48 px-4 py-3 font-medium text-gray-400">Pass Rate</th>
+            <th className="px-4 py-3 font-medium text-gray-400">Pass Rate</th>
             <th className="px-4 py-3 text-right font-medium text-gray-400">Evals</th>
           </tr>
         </thead>
@@ -54,7 +54,7 @@ export function TargetsTab() {
                 {target.experiment_count}
               </td>
               <td className="px-4 py-3">
-                <ScoreBar score={target.pass_rate} />
+                <PassRatePill rate={target.pass_rate} />
               </td>
               <td className="px-4 py-3 text-right tabular-nums text-gray-400">
                 <span className="text-emerald-400">{target.passed_count}</span>