feat(ui): add views for Responses (#2293)

# What does this PR do?
* Add responses list and detail views
* Refactored components to be shared as much as possible between chat
completions and responses

## Test Plan
<img width="2014" alt="image"
src="https://github.com/user-attachments/assets/6dee12ea-8876-4351-a6eb-2338058466ef"
/>
<img width="2021" alt="image"
src="https://github.com/user-attachments/assets/6c7c71b8-25b7-4199-9c57-6960be5580c8"
/>

added tests

llama_stack/ui/components/chat-completions/chat-completions-table.tsx

@@ -0,0 +1,43 @@
+"use client";
+
+import { ChatCompletion } from "@/lib/types";
+import { LogsTable, LogTableRow } from "@/components/logs/logs-table";
+import {
+  extractTextFromContentPart,
+  extractDisplayableText,
+} from "@/lib/format-message-content";
+
+interface ChatCompletionsTableProps {
+  data: ChatCompletion[];
+  isLoading: boolean;
+  error: Error | null;
+}
+
+function formatChatCompletionToRow(completion: ChatCompletion): LogTableRow {
+  return {
+    id: completion.id,
+    input: extractTextFromContentPart(completion.input_messages?.[0]?.content),
+    output: extractDisplayableText(completion.choices?.[0]?.message),
+    model: completion.model,
+    createdTime: new Date(completion.created * 1000).toLocaleString(),
+    detailPath: `/logs/chat-completions/${completion.id}`,
+  };
+}
+
+export function ChatCompletionsTable({
+  data,
+  isLoading,
+  error,
+}: ChatCompletionsTableProps) {
+  const formattedData = data.map(formatChatCompletionToRow);
+
+  return (
+    <LogsTable
+      data={formattedData}
+      isLoading={isLoading}
+      error={error}
+      caption="A list of your recent chat completions."
+      emptyMessage="No chat completions found."
+    />
+  );
+}