2e:null 2f:["$","title",null,{"children":"Convert Claude JSON to Markdown | Simon Willison | Observable"}] 34:T9da,markdown = { if (!parsed.chat_messages) { return ""; } const bits = []; bits.push(`# ${parsed.name}`); parsed.chat_messages.forEach((message) => { console.log({ message }); bits.push( `**${message.sender}** (${new Date(message.created_at).toLocaleString( "en-US", { month: "short", day: "numeric", year: "numeric", hour: "2-digit", minute: "2-digit" } )})` ); message.content.forEach((content) => { if (content.type == "tool_use") { if (content.name == "repl") { bits.push( "**Analysis**\n```" + `javascript\n${content.input.code.trim()}` + "\n```" ); } else if (content.name == "artifacts") { let lang = content.input.language || typeLookup[content.input.type] || ""; // It's an artifact, but is it a create/rewrite/update? const input = content.input; if (input.command == "create" || input.command == "rewrite") { bits.push( `#### ${input.command} ${ content.input.title || "Untitled" }\n\n\`\`\`${lang}\n${content.input.content}\n\`\`\`` ); } else if (input.command == "update") { bits.push( `#### update ${content.input.id}\n\nFind this:\n\`\`\`\n${content.input.old_str}\n\`\`\`\nReplace with this:\n\`\`\`\n${content.input.new_str}\n\`\`\`` ); } } } else if (content.type == "tool_result") { if (content.name != "artifacts") { let logs = JSON.parse(content.content[0].text).logs; bits.push( `**Result**\n

\n${logs.join(
              "\n"
            )}\n

` ); } } else { if (content.text) { bits.push( replaceArtifactTags( content.text.replace(/<\/antArtifact>/g, "\n```") ) ); } else { bits.push(JSON.stringify(content)); } } }); const backtick = String.fromCharCode(96); message.attachments.forEach((attachment) => { bits.push(`

${attachment.file_name}

`); bits.push("\n\n"); bits.push(backtick.repeat(5)); bits.push(attachment.extracted_content); bits.push(backtick.repeat(5)); bits.push("

"); }); }); return bits.join("\n\n"); }35:[] 32:{"id":"1869620979c780ec","slug":"convert-claude-json-to-markdown","title":"Convert Claude JSON to Markdown","thumbnail":"2582bcbbd76934c5bb838e2e6e60f4fef4d8e32979630470e8b04ea4d4293cfc","access_level":"public","create_time":"$D2024-08-08T19:27:07.604Z","update_time":"$D2025-02-08T04:40:09.727Z","view_time":null,"first_public_time":"$D2024-08-08T19:46:32.063Z","has_unpublished_edits":null,"fork":false,"stars":13,"starred":false,"owner":{"type":"team","id":"3b974c2db4452cfc","login":"simonw","name":"Simon Willison","avatar_url":"https://avatars-next.observableusercontent.com/78a40181b372a172b86abe69479cab717df036b9cdcbaab5a197e45a76ffb4f3","tier":"starter_2024"},"version":127,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"dc026342127b807b","login":"simonw","name":"Simon Willison","avatar_url":"https://avatars-next.observableusercontent.com/78a40181b372a172b86abe69479cab717df036b9cdcbaab5a197e45a76ffb4f3","tier":null}],"members":[{"type":"individual","id":"dc026342127b807b","login":"simonw","name":"Simon Willison","avatar_url":"https://avatars-next.observableusercontent.com/78a40181b372a172b86abe69479cab717df036b9cdcbaab5a197e45a76ffb4f3","tier":null,"role":"editor"},{"type":"team","id":"3b974c2db4452cfc","login":"simonw","name":"Simon Willison","avatar_url":"https://avatars-next.observableusercontent.com/78a40181b372a172b86abe69479cab717df036b9cdcbaab5a197e45a76ffb4f3","tier":"starter_2024","role":"viewer"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":30,"collection":null,"type":"notebook","body":{"title":"Convert Claude JSON to Markdown","cells":[{"id":0,"value":"# Convert Claude JSON to Markdown\n\nTo use this tool, open a conversation in the Claude web interface while running your browser DevTools. Then, in the network panel, filter fetched URLs by `chat_conversations/` - right click on the matching URL and select \"copy response\" to get the JSON, then paste it in the box.\n\nI suggest sharing these by pasting them into [a Gist](https://gist.github.com) with a filename ending in `.md`\n\n $\"Animated$ \n\n[Background on this project](https://simonwillison.net/2024/Aug/8/convert-claude-json-to-markdown/) from my blog. This code is licensed [Apache 2.0](https://www.apache.org/licenses/LICENSE-2.0.txt).","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"viewof input = Inputs.textarea({ label: \"Paste in Claude JSON\" })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"html`${\n (markdown &&\n '

Markdown conversion

\") ||\n \"\"\n}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"md`${markdown}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"parsed = {\n try {\n return JSON.parse(input);\n } catch {\n return {};\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"$34","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":50,"value":"function escapeHtml(str) {\n return str.replace(/[&<>\"']/g, function (match) {\n const entityMap = {\n \"&\": \"&\",\n \"<\": \"<\",\n \">\": \">\",\n '\"': \""\",\n \"'\": \"'\"\n };\n return entityMap[match];\n });\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":59,"value":"function replaceArtifactTags(input) {\n // Regular expression to match tags\n const regex = /]*>/g;\n\n // Function to extract attributes from a tag string\n function extractAttributes(tag) {\n const attributes = {};\n const attrRegex = /(\\w+)=(\"([^\"]*)\"|'([^']*)')/g;\n let match;\n while ((match = attrRegex.exec(tag)) !== null) {\n const key = match[1];\n const value = match[3] || match[4]; // Use either double or single quotes\n attributes[key] = value;\n }\n return attributes;\n }\n\n return input.replace(regex, (match) => {\n const attributes = extractAttributes(match);\n // Determine language based on 'language' attribute, otherwise fallback logic\n const lang = attributes.language || typeLookup[attributes.type] || \"\";\n\n // Return the Markdown formatted string\n return `### ${attributes.title || \"Untitled\"}\\n\\n\\`\\`\\`${lang}`;\n });\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":110,"value":"typeLookup = ({\n \"application/vnd.ant.react\": \"jsx\",\n \"text/html\": \"html\"\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}} 33:"$32:body"