Skip to content

Add Column Visibility Toggle for Trace ID

Allow users to show/hide the trace ID column in the events listing table.

  • Column visibility menu button in table header toolbar (columns icon)
  • Always visible: Timestamp, Event Name, Source, Severity, Status, Message
  • Toggleable: Trace ID (default: hidden)
  • Store preferences in browser localStorage (eventsTable.columnVisibility), persist across sessions
  • Column width adjusts dynamically when Trace ID shown/hidden

Example:

Column visibility menu:

┌─ Events Listing ────────────────────────────────────┐
│ [Filters...]  [⋮ Columns]                           │
│                 ┌───────────────────┐               │
│                 │ ☑ Timestamp       │               │
│                 │ ☑ Event Name      │               │
│                 │ ☑ Source          │               │
│                 │ ☑ Status          │               │
│                 │ ☐ Trace ID        │ ← toggleable  │
│                 └───────────────────┘               │
└─────────────────────────────────────────────────────┘

Table with Trace ID hidden:

│ Timestamp         | Event    | Source   | Status │
│ 2025-11-06 15:30  | emp.sync | ADP Sync | ✓      │

Table with Trace ID shown:

│ Timestamp         | Event    | Trace ID  | Source   | Status │
│ 2025-11-06 15:30  | emp.sync | 7c9e6679  | ADP Sync | ✓      │