Skip to content

Commit 14704d3

Browse files
fix[frontend](alerts): improved alerts table min widths and not truncated texts
1 parent f159587 commit 14704d3

2 files changed

Lines changed: 8 additions & 5 deletions

File tree

‎frontend/src/features/alerts/components/alert-row.tsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -130,14 +130,16 @@ export function AlertRow({
130130
onCreateRule={() => onCreateRule(a)}
131131
/>
132132
</td>
133-
<td className={`${TD} font-mono mx-auto text-[11px] text-muted-foreground`} title={a.technique}>
134-
{a.technique || '—'}
133+
<td className={`${TD} overflow-hidden font-mono text-[11px] text-muted-foreground`} title={a.technique}>
134+
<span className="block truncate">{a.technique || '—'}</span>
135135
</td>
136136
<td className={TD}>
137137
<EndpointMini ep={a.target} />
138138
</td>
139139
<td className={TD}>
140-
<EndpointMini ep={a.adversary} accent />
140+
<div className="block truncate">
141+
<EndpointMini ep={a.adversary} accent />
142+
</div>
141143
</td>
142144
<td className={`${TD} text-center`}>
143145
<span

‎frontend/src/features/alerts/components/alerts-table-header.tsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,9 @@ import type { ColSize, useResizableColumns } from '@/shared/hooks/useResizableCo
55
const TH = 'whitespace-nowrap px-3 py-2.5 text-left align-middle font-medium'
66
export const ALERTS_TABLE_COLS = [6, 36, 38, 38, 360, 130, 180, 160, 160, 90, 90, 160]
77
// Icon/checkbox tracks (indices 0-3) keep their exact width as min; label
8-
// tracks get a floor sized to keep the uppercase heading readable at ~11px.
9-
export const ALERTS_TABLE_MINS = [6, 36, 38, 38, 140, 90, 110, 90, 110, 90, 80, 100]
8+
// tracks get a floor sized to keep both the uppercase heading and the row
9+
// content (alert name, mitre code, endpoint pill, timestamp) legible.
10+
export const ALERTS_TABLE_MINS = [6, 36, 38, 38, 220, 120, 160, 140, 140, 120, 120, 130]
1011

1112
export function AlertsTableHeader({
1213
allChecked,

0 commit comments

Comments
 (0)