fix(web): wrap incident flow evidence on mobile
This commit is contained in:
@@ -327,6 +327,11 @@ export function IncidentCard({ incident, decision, statusChain, onApprovalChange
|
||||
? chainValue(statusChain?.next_step)
|
||||
: nextStage ? flowStageLabels[nextStage] : t('flowComplete')
|
||||
const flowSourceText = hasTruthChain ? t('flowSourceTruthChain') : t('flowSourceHeuristic')
|
||||
const flowSummaryTextStyle = {
|
||||
minWidth: 0,
|
||||
overflowWrap: 'anywhere' as const,
|
||||
wordBreak: 'break-word' as const,
|
||||
}
|
||||
const statusChainEvidenceItems = hasTruthChain ? [
|
||||
{
|
||||
key: 'mcp',
|
||||
@@ -657,27 +662,30 @@ export function IncidentCard({ incident, decision, statusChain, onApprovalChange
|
||||
flexWrap: 'wrap',
|
||||
fontSize: 11,
|
||||
color: '#555550',
|
||||
minWidth: 0,
|
||||
overflowWrap: 'anywhere',
|
||||
wordBreak: 'break-word',
|
||||
}}
|
||||
>
|
||||
<span>
|
||||
<span style={flowSummaryTextStyle}>
|
||||
{t('flowCurrentLabel')}: <strong style={{ color: sevCfg.labelColor }}>{currentStageText}</strong>
|
||||
</span>
|
||||
<span style={{ color: '#b0ad9f' }}>/</span>
|
||||
<span>
|
||||
<span style={flowSummaryTextStyle}>
|
||||
{t('flowNextLabel')}: <strong style={{ color: '#141413' }}>{nextStageText}</strong>
|
||||
</span>
|
||||
<span style={{ color: '#b0ad9f' }}>/</span>
|
||||
<span>
|
||||
<span style={flowSummaryTextStyle}>
|
||||
{t('flowSourceLabel')}: <strong style={{ color: '#555550' }}>{flowSourceText}</strong>
|
||||
</span>
|
||||
{hasTruthChain && (
|
||||
<>
|
||||
<span style={{ color: '#b0ad9f' }}>/</span>
|
||||
<span>
|
||||
<span style={flowSummaryTextStyle}>
|
||||
{t('flowVerdictLabel')}: <strong style={{ color: statusChain?.needs_human ? '#9f2f25' : '#17602a' }}>{chainValue(statusChain?.verdict)}</strong>
|
||||
</span>
|
||||
<span style={{ color: '#b0ad9f' }}>/</span>
|
||||
<span data-testid="incident-flow-evidence" style={{ display: 'flex', alignItems: 'center', gap: 5, flexWrap: 'wrap' }}>
|
||||
<span data-testid="incident-flow-evidence" style={{ display: 'flex', alignItems: 'center', gap: 5, flexWrap: 'wrap', ...flowSummaryTextStyle }}>
|
||||
{statusChainEvidenceItems.map(item => (
|
||||
<strong
|
||||
key={item.key}
|
||||
@@ -695,15 +703,15 @@ export function IncidentCard({ incident, decision, statusChain, onApprovalChange
|
||||
))}
|
||||
</span>
|
||||
<span style={{ color: '#b0ad9f' }}>/</span>
|
||||
<span data-testid="incident-mcp-evidence" style={{ color: '#555550' }}>
|
||||
<span data-testid="incident-mcp-evidence" style={{ color: '#555550', ...flowSummaryTextStyle }}>
|
||||
{statusChainMcpDetail}
|
||||
</span>
|
||||
<span style={{ color: '#b0ad9f' }}>/</span>
|
||||
<span data-testid="incident-execution-evidence" style={{ color: '#555550' }}>
|
||||
<span data-testid="incident-execution-evidence" style={{ color: '#555550', ...flowSummaryTextStyle }}>
|
||||
{statusChainExecutionDetail}
|
||||
</span>
|
||||
<span style={{ color: '#b0ad9f' }}>/</span>
|
||||
<span data-testid="incident-source-ref-evidence" style={{ color: '#555550' }}>
|
||||
<span data-testid="incident-source-ref-evidence" style={{ color: '#555550', ...flowSummaryTextStyle }}>
|
||||
{statusChainSourceRefDetail}
|
||||
</span>
|
||||
</>
|
||||
|
||||
Reference in New Issue
Block a user