fix: deduplicate actions, promote ViewToggle tab bar, standardize naming
Remove duplicate Update/Close actions from chat toolbars (FlowPilotPage, CockpitPage) — session lifecycle actions now live only in headers. Redesign ViewToggle as a persistent tab bar with bottom-border active indicator and ARIA attributes. Standardize all action naming: Resolve (emerald), Update (blue), Close (rose), Pause (muted). Fix IncidentHeader Resolve from orange to emerald. Delete unused FlowPilotActionBar component (227 lines). Update ConcludeSessionModal copy to use forward-facing action verbs. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
import { useState, useRef, useEffect } from 'react'
|
||||
import { Pencil, X, Check, ExternalLink, Pause, XCircle, Link2, MoreHorizontal, FileText } from 'lucide-react'
|
||||
import { Pencil, X, Check, CheckCircle2, ExternalLink, Pause, XCircle, Link2, MoreHorizontal, FileText } from 'lucide-react'
|
||||
import { cn } from '@/lib/utils'
|
||||
import { toast } from '@/lib/toast'
|
||||
import type { TriageMeta } from '@/types/ai-session'
|
||||
@@ -12,8 +12,6 @@ interface IncidentHeaderProps {
|
||||
onStatusUpdate?: () => void
|
||||
onPause?: () => void
|
||||
onClose?: () => void
|
||||
/** Extra elements rendered in the action group (e.g. ViewToggle) */
|
||||
extraActions?: React.ReactNode
|
||||
}
|
||||
|
||||
interface EditPopoverProps {
|
||||
@@ -129,14 +127,14 @@ function OverflowMenu({ onPause, onClose }: { onPause?: () => void; onClose?: ()
|
||||
{open && (
|
||||
<>
|
||||
<div className="fixed inset-0 z-40" onClick={() => setOpen(false)} />
|
||||
<div className="absolute right-0 top-full mt-1 z-50 w-44 rounded-lg border border-border bg-card py-1 shadow-xl">
|
||||
<div className="absolute right-0 top-full mt-1 z-50 w-40 rounded-lg border border-border bg-card py-1 shadow-xl">
|
||||
{onPause && (
|
||||
<button
|
||||
onClick={() => { onPause(); setOpen(false) }}
|
||||
className="w-full flex items-center gap-2 px-3 py-2 text-xs text-muted-foreground hover:text-foreground hover:bg-[rgba(255,255,255,0.06)] transition-colors text-left"
|
||||
>
|
||||
<Pause size={13} />
|
||||
Pause Case
|
||||
Pause
|
||||
</button>
|
||||
)}
|
||||
<button
|
||||
@@ -152,7 +150,7 @@ function OverflowMenu({ onPause, onClose }: { onPause?: () => void; onClose?: ()
|
||||
className="w-full flex items-center gap-2 px-3 py-2 text-xs text-muted-foreground hover:text-rose-400 hover:bg-rose-500/10 transition-colors text-left"
|
||||
>
|
||||
<XCircle size={13} />
|
||||
Close Case
|
||||
Close
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
@@ -170,7 +168,6 @@ export function IncidentHeader({
|
||||
onStatusUpdate,
|
||||
onPause,
|
||||
onClose,
|
||||
extraActions,
|
||||
}: IncidentHeaderProps) {
|
||||
return (
|
||||
<div className="bg-card border-b border-default px-4 py-2 flex items-center gap-4 flex-wrap">
|
||||
@@ -212,21 +209,21 @@ export function IncidentHeader({
|
||||
)}
|
||||
<button
|
||||
onClick={onResolve}
|
||||
className="bg-accent/15 border border-accent rounded px-3 py-1 text-xs font-medium text-accent hover:bg-accent/25 transition-colors"
|
||||
className="flex items-center gap-1.5 bg-emerald-500/10 border border-emerald-500/20 rounded-lg px-3 py-1.5 text-xs font-medium text-emerald-400 hover:bg-emerald-500/20 transition-colors"
|
||||
>
|
||||
<CheckCircle2 size={13} />
|
||||
Resolve
|
||||
</button>
|
||||
{onStatusUpdate && (
|
||||
<button
|
||||
onClick={onStatusUpdate}
|
||||
className="flex items-center gap-1.5 bg-blue-500/10 border border-blue-500/20 rounded px-3 py-1 text-xs font-medium text-blue-400 hover:bg-blue-500/20 transition-colors"
|
||||
className="flex items-center gap-1.5 bg-blue-500/10 border border-blue-500/20 rounded-lg px-3 py-1.5 text-xs font-medium text-blue-400 hover:bg-blue-500/20 transition-colors"
|
||||
>
|
||||
<FileText size={13} />
|
||||
Update
|
||||
</button>
|
||||
)}
|
||||
<OverflowMenu onPause={onPause} onClose={onClose} />
|
||||
{extraActions}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
||||
Reference in New Issue
Block a user