diff --git a/src/app/(authenticated)/usage/TaskDrawer.tsx b/src/app/(authenticated)/usage/TaskDrawer.tsx
index ea07a0df23..5e6dd99802 100644
--- a/src/app/(authenticated)/usage/TaskDrawer.tsx
+++ b/src/app/(authenticated)/usage/TaskDrawer.tsx
@@ -67,7 +67,59 @@ export const TaskDrawer = ({ task, onClose }: TaskDrawerProps) => (
+
+
Conversation
+
+ {conversation.map((message) => (
+
+
+ {message.role.charAt(0).toUpperCase() + message.role.slice(1)} •
+ {message.timestamp.toLocaleTimeString()}
+
+
{message.content}
+
+ ))}
+
);
+
+const conversation = [
+ {
+ id: 'msg1',
+ role: 'user',
+ content:
+ 'Create a React component that displays a list of items with pagination.',
+ timestamp: new Date('2025-05-01T10:00:00'),
+ },
+ {
+ id: 'msg2',
+ role: 'assistant',
+ content:
+ "I'll create a React component for displaying a paginated list. Here's how we can implement it...",
+ timestamp: new Date('2025-05-01T10:00:30'),
+ },
+ {
+ id: 'msg3',
+ role: 'user',
+ content: 'Can you add sorting functionality as well?',
+ timestamp: new Date('2025-05-01T10:02:00'),
+ },
+ {
+ id: 'msg4',
+ role: 'assistant',
+ content:
+ "Certainly! I'll add sorting functionality to the component. Here's the updated implementation...",
+ timestamp: new Date('2025-05-01T10:02:30'),
+ },
+];