From 790f7a33b72d9ec4463ac66bc53638330c2e880c Mon Sep 17 00:00:00 2001
From: Sven Olderaan <s.olderaan@jdi.nl>
Date: Sun, 16 Mar 2025 11:55:03 +0100
Subject: [PATCH] Fix chat bubble image rendering
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Convert markdown to actual HTML img tags

- Properly handle image placement in DOM

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 index.js | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/index.js b/index.js
index aed6db1..78880bc 100644
--- a/index.js
+++ b/index.js
@@ -197,14 +197,22 @@ function processToolCallMessages() {
                   // Create a container for the rendered markdown
                   const renderContainer = $('<div class="sillybubble-rendered-image"></div>');
                   
-                  // Add the markdown content (render the image)
-                  renderContainer.html(tool.result);
+                  // Convert markdown to actual HTML img tag
+                  const markdownImgRegex = /!\[\]\(([^)]+)\)/;
+                  const match = tool.result.match(markdownImgRegex);
+                  if (match && match[1]) {
+                    renderContainer.html(`<img src="${match[1]}" alt="Chat Bubble">`);
+                  } else {
+                    renderContainer.html(tool.result);
+                  }
                   
                   // Remove any existing rendered images
                   $(this).find('.sillybubble-rendered-image').remove();
                   
-                  // Add this image after the summary element
-                  summaryElement.after(renderContainer);
+                  // Add this image after the summary element, but only if details is present
+                  if (summaryElement.length) {
+                    summaryElement.after(renderContainer);
+                  }
                   
                   // Mark this message as processed
                   $(this).attr('data-sb-processed', 'true');