added feature: Export Chat Transcript (Download as Markdown / JSON) #114
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,150 @@ | ||
| /** | ||
| * Chat Export Utilities | ||
| * Handles exporting chat messages to Markdown and JSON formats | ||
| */ | ||
|
|
||
| export interface ExportMessage { | ||
| role: "user" | "assistant"; | ||
| content: string; | ||
| timestamp?: Date; | ||
| } | ||
|
|
||
| /** | ||
| * Format messages for Markdown export | ||
| */ | ||
| export function exportToMarkdown(messages: any[]): string { | ||
| if (messages.length === 0) { | ||
| return "# Chat Transcript\n\nNo messages to export."; | ||
| } | ||
|
|
||
| const timestamp = new Date().toLocaleString(); | ||
| let markdown = `# Chat Transcript\n\n`; | ||
| markdown += `**Exported on:** ${timestamp}\n\n`; | ||
| markdown += `---\n\n`; | ||
|
|
||
| messages.forEach((msg, index) => { | ||
| const rawParts: any[] = (msg as any).parts ?? []; | ||
| const textParts = rawParts.filter((p: any) => p.type === "text"); | ||
| const textContent: string = ( | ||
| textParts.map((p: any) => p.text).join("") || | ||
| (msg as any).content || | ||
| "" | ||
| ); | ||
|
|
||
| // Skip synthetic messages | ||
| if (msg.role === "user" && textParts.length === 0) { | ||
| return; | ||
| } | ||
|
|
||
| const roleLabel = msg.role === "user" ? "👤 You" : "🤖 Assistant"; | ||
| const msgTime = msg.createdAt | ||
| ? new Date(msg.createdAt).toLocaleTimeString() | ||
| : ""; | ||
|
|
||
| markdown += `## ${roleLabel}`; | ||
| if (msgTime) { | ||
| markdown += ` *(${msgTime})*`; | ||
| } | ||
| markdown += `\n\n`; | ||
| markdown += `${textContent}\n\n`; | ||
| markdown += `---\n\n`; | ||
| }); | ||
|
|
||
| return markdown; | ||
| } | ||
|
|
||
| /** | ||
| * Format messages for JSON export | ||
| */ | ||
| export function exportToJSON(messages: any[]): string { | ||
| const exportData = { | ||
| version: "1.0", | ||
| exportedAt: new Date().toISOString(), | ||
| messageCount: messages.length, | ||
| messages: messages | ||
|
Comment on lines
+63
to
+64
There was a problem hiding this comment.
Line 63 uses the original array length, but Line 94 removes entries. Metadata can disagree with Suggested fix export function exportToJSON(messages: any[]): string {
+ const exportedMessages = messages
+ .map((msg) => {
+ // ...existing mapping logic
+ })
+ .filter(Boolean);
+
const exportData = {
version: "1.0",
exportedAt: new Date().toISOString(),
- messageCount: messages.length,
- messages: messages
- .map((msg) => {
- // ...
- })
- .filter(Boolean),
+ messageCount: exportedMessages.length,
+ messages: exportedMessages,
};Also applies to: 94-94 🤖 Prompt for AI Agents |
||
| .map((msg) => { | ||
| const rawParts: any[] = (msg as any).parts ?? []; | ||
| const textParts = rawParts.filter((p: any) => p.type === "text"); | ||
| const textContent: string = ( | ||
| textParts.map((p: any) => p.text).join("") || | ||
| (msg as any).content || | ||
| "" | ||
| ); | ||
|
|
||
| // Skip synthetic messages | ||
| if (msg.role === "user" && textParts.length === 0) { | ||
| return null; | ||
| } | ||
|
|
||
| return { | ||
| id: msg.id, | ||
| role: msg.role, | ||
| content: textContent, | ||
| timestamp: msg.createdAt ? new Date(msg.createdAt).toISOString() : null, | ||
| toolInvocations: rawParts | ||
| .filter((p: any) => p.type?.startsWith("tool-") || p.type === "tool-invocation") | ||
| .map((ti: any) => ({ | ||
| toolName: ti.toolName ?? ti.type?.split("-").slice(1).join("-"), | ||
| toolCallId: ti.toolCallId, | ||
| input: ti.input, | ||
| state: ti.state, | ||
| })), | ||
|
Comment on lines
+84
to
+91
There was a problem hiding this comment. Avoid exporting non-visible tool inputs by default. Line 89 serializes Suggested fix return {
id: msg.id,
role: msg.role,
content: textContent,
timestamp: msg.createdAt ? new Date(msg.createdAt).toISOString() : null,
toolInvocations: rawParts
.filter((p: any) => p.type?.startsWith("tool-") || p.type === "tool-invocation")
.map((ti: any) => ({
toolName: ti.toolName ?? ti.type?.split("-").slice(1).join("-"),
toolCallId: ti.toolCallId,
- input: ti.input,
state: ti.state,
})),
};🤖 Prompt for AI Agents |
||
| }; | ||
| }) | ||
| .filter(Boolean), | ||
| }; | ||
|
|
||
| return JSON.stringify(exportData, null, 2); | ||
| } | ||
|
|
||
| /** | ||
| * Generate filename with timestamp | ||
| */ | ||
| export function generateFilename(format: "md" | "json"): string { | ||
| const now = new Date(); | ||
| const year = now.getFullYear(); | ||
| const month = String(now.getMonth() + 1).padStart(2, "0"); | ||
| const date = String(now.getDate()).padStart(2, "0"); | ||
| const hours = String(now.getHours()).padStart(2, "0"); | ||
| const minutes = String(now.getMinutes()).padStart(2, "0"); | ||
|
|
||
| const timestamp = `${year}${month}${date}-${hours}${minutes}`; | ||
| const ext = format === "md" ? "md" : "json"; | ||
|
|
||
| return `chat-${timestamp}.${ext}`; | ||
| } | ||
|
|
||
| /** | ||
| * Trigger file download in browser | ||
| */ | ||
| export function downloadFile(content: string, filename: string): void { | ||
| const blob = new Blob([content], { | ||
| type: filename.endsWith(".json") ? "application/json" : "text/markdown" | ||
| }); | ||
| const url = URL.createObjectURL(blob); | ||
| const link = document.createElement("a"); | ||
| link.href = url; | ||
| link.download = filename; | ||
| document.body.appendChild(link); | ||
| link.click(); | ||
| document.body.removeChild(link); | ||
| URL.revokeObjectURL(url); | ||
| } | ||
|
|
||
| /** | ||
| * Export chat messages to Markdown file | ||
| */ | ||
| export function exportChatAsMarkdown(messages: any[]): void { | ||
| const markdown = exportToMarkdown(messages); | ||
| const filename = generateFilename("md"); | ||
| downloadFile(markdown, filename); | ||
| } | ||
|
|
||
| /** | ||
| * Export chat messages to JSON file | ||
| */ | ||
| export function exportChatAsJSON(messages: any[]): void { | ||
| const json = exportToJSON(messages); | ||
| const filename = generateFilename("json"); | ||
| downloadFile(json, filename); | ||
| } | ||
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Add explicit
aria-labelto icon-only action buttons.These controls currently rely on
title; screen-reader support fortitleis inconsistent. Addaria-labelfor reliable accessibility.Suggested fix
<Button size="icon" variant="ghost" className="h-8 w-8 text-muted-foreground hover:text-foreground hover:bg-muted/50 transition-colors" title="Export chat" + aria-label="Export chat" disabled={messages.length === 0} > <Download className="h-4 w-4" /> </Button> ... - <Button size="icon" variant="ghost" className="h-8 w-8 text-muted-foreground hover:text-destructive hover:bg-destructive/10 transition-colors" onClick={clearChat} title="Clear chat"> + <Button size="icon" variant="ghost" className="h-8 w-8 text-muted-foreground hover:text-destructive hover:bg-destructive/10 transition-colors" onClick={clearChat} title="Clear chat" aria-label="Clear chat"> <Trash2 className="h-4 w-4" /> </Button>Also applies to: 380-382
🤖 Prompt for AI Agents