diff --git a/frontend/src/components/VerdictBadge.tsx b/frontend/src/components/VerdictBadge.tsx index 0655d7ff..f61a72cf 100644 --- a/frontend/src/components/VerdictBadge.tsx +++ b/frontend/src/components/VerdictBadge.tsx @@ -49,7 +49,6 @@ export function VerdictBadge({ verdict, compact = false }: VerdictBadgeProps) { const { status } = verdict; const label = STATUS_LABELS[status] ?? status; const tooltip = verdictTooltip(verdict); - const flame = status === 'Confirmed' ? '🔥 ' : ''; return ( - {flame} {compact ? status.charAt(0) : label} ); diff --git a/frontend/src/components/icons/Icons.tsx b/frontend/src/components/icons/Icons.tsx index 54c25b4a..309419bd 100644 --- a/frontend/src/components/icons/Icons.tsx +++ b/frontend/src/components/icons/Icons.tsx @@ -153,6 +153,14 @@ export function CloseIcon({ className, size = 14 }: IconProps) { ); } +export function CheckIcon({ className, size = 14 }: IconProps) { + return ( + + + + ); +} + export function SunIcon({ className, size = 16 }: IconProps) { return ( @@ -199,4 +207,5 @@ export const ICONS: Record> = { debug: DebugIcon, folder: FolderIcon, tag: TagIcon, + check: CheckIcon, }; diff --git a/frontend/src/components/ui/Dropdown.tsx b/frontend/src/components/ui/Dropdown.tsx index ddc0b967..fc9c2b2b 100644 --- a/frontend/src/components/ui/Dropdown.tsx +++ b/frontend/src/components/ui/Dropdown.tsx @@ -5,6 +5,7 @@ import { useState, type ReactNode, } from 'react'; +import { CheckIcon } from '../icons/Icons'; interface DropdownProps { trigger: (opts: { open: boolean }) => ReactNode; @@ -94,7 +95,7 @@ export function DropdownItem({ onClick={onClick} > - {checked ? '✓' : ''} + {checked && } {children} {hint && {hint}} diff --git a/frontend/src/test/components/verdictBadge.test.tsx b/frontend/src/test/components/verdictBadge.test.tsx index d1874c9e..4dfd8f10 100644 --- a/frontend/src/test/components/verdictBadge.test.tsx +++ b/frontend/src/test/components/verdictBadge.test.tsx @@ -21,7 +21,7 @@ describe('VerdictBadge', () => { expect(screen.getByText('-')).toBeInTheDocument(); }); - it('renders Confirmed badge with flame and correct class', () => { + it('renders Confirmed badge with correct class', () => { render( { const badge = screen.getByTestId('verdict-badge-confirmed'); expect(badge).toBeInTheDocument(); expect(badge.className).toContain('badge-dyn-confirmed'); - expect(badge.textContent).toContain('🔥'); + expect(badge.textContent).toBe('Confirmed'); }); - it('renders PartiallyConfirmed badge with amber class and no flame', () => { + it('renders PartiallyConfirmed badge with amber class', () => { render( { const badge = screen.getByTestId('verdict-badge-partiallyconfirmed'); expect(badge).toBeInTheDocument(); expect(badge.className).toContain('badge-dyn-partiallyconfirmed'); - expect(badge.textContent).not.toContain('🔥'); expect(badge.getAttribute('title')).toContain('sink reached'); }); @@ -56,7 +55,6 @@ describe('VerdictBadge', () => { const badge = screen.getByTestId('verdict-badge-notconfirmed'); expect(badge).toBeInTheDocument(); expect(badge.className).toContain('badge-dyn-notconfirmed'); - expect(badge.textContent).not.toContain('🔥'); }); it('renders when attempts are omitted by the API', () => { @@ -119,8 +117,7 @@ describe('VerdictBadge', () => { it('compact mode renders single character', () => { render(); const badge = screen.getByTestId('verdict-badge-confirmed'); - // Compact: first char of status + flame emoji - expect(badge.textContent?.replace('🔥 ', '')).toBe('C'); + expect(badge.textContent).toBe('C'); }); it('renders all five VerifyStatus variants without crashing', () => {