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'), + }, +];