Chat Interface
The Vidura chat interface at /vidura provides a full-page conversational UI for querying the Vidura AI agent. Users can ask natural language questions about AWS costs, Redshift performance, and FinOps optimization opportunities.
Layout
The chat page uses a three-zone layout:
| Zone | Description |
|---|---|
| Left Sidebar | Session list with create, rename, and delete controls. Sessions persist in localStorage. New session button at the top. |
| Message Thread | Scrollable thread showing user messages (right-aligned) and Vidura responses (left-aligned). Auto-scrolls to the latest message on update. |
| Input Bar | Fixed at the bottom. Textarea for query input (Shift+Enter for newline, Enter to send). Send button with loading state during agent processing. |
Message Rendering
Vidura's responses are rendered with react-markdown and the remark-gfm plugin, supporting:
- Tables (GFM table syntax)
- Fenced code blocks with syntax highlighting
- Bold, italic, and strikethrough formatting
- Headers (h1–h3)
- Ordered and unordered lists
- Inline code
Code blocks inside responses include a copy button that copies the code to the clipboard. A three-dot loading animation is shown while the agent is processing.
Session Management
Sessions are stored in localStorage and persist across browser refreshes. Each session stores:
- Session ID (UUID generated on creation)
- Session name (defaults to "Session 1", user-editable)
- Created timestamp
- Message array (user + assistant messages in order)
Sessions are independent — context is not shared between sessions. Each session maintains its own conversation history.
Ask Vidura Sheet (Floating Drawer)
Every page in the Quper dashboard includes a floating "Ask Vidura" button in the bottom-right corner. Clicking it opens a slide-in drawer panel (the "Ask Vidura Sheet") without navigating away from the current page.
The drawer provides:
- A compact version of the chat interface with full markdown rendering
- Access to all Vidura capabilities (CID analysis, Redshift diagnostics)
- The current page URL is included in the context sent to the agent, so Vidura can provide page-aware responses (e.g., if you're on the Redshift Query Analysis page, the agent knows you're investigating query performance)
Session Persistence
localStorage — they persist across browser refreshes but are tied to the browser/device. Clearing browser storage removes all session history. Future versions will sync sessions to the backend for cross-device access.Sample Queries
Effective questions to ask Vidura in the chat interface:
- "What are my top 5 most expensive EC2 instances this month?"
- "Which Redshift tables need vacuuming the most urgently?"
- "What's our current Savings Plan coverage rate and how can we improve it?"
- "Show me queries that are causing disk spill in the last 7 days"
- "Which S3 buckets could be moved to Glacier storage class?"
- "Explain what a Redshift NL join alert means and how to fix it"