AI screen UI gets new icons, timelines, and shortcuts
The AI Prompts and Metrics pages in the webapp now feature custom icons, horizontal timeline displays for span durations, copiable metadata fields, and keyboard shortcuts for filters — significantly improving navigation and usability.
The AI screens in the webapp were feeling inconsistent and lacked some essential features. Navigation icons used generic SVG shapes instead of purpose-built ones, and users had no way to see span durations at a glance in the detail views.
New custom icons — AIPromptsIcon and AIMetricsIcon — now appear in the sidebar with distinct blue and green colors for visual clarity. A new SpanHorizontalTimeline component displays start and finish times compactly in a horizontal format, making it easy to scan generation lists. Users can now copy metadata fields directly from the UI.
The metrics view got a cleanup with better spacing and layout. The versions list is now cleaner and easier to read. Shortcut keys were added to missing filters (the time filter now responds to keyboard input), and several shortcut conflicts were resolved — the models filter shortcut changed from 'm' to 'l' and providers from 'v' to 'r' to avoid clashes.
All of this lives in the webapp's prompts and AI inspection pages, accessible from the side navigation.