Fix chat bubble image rendering
- 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>
This commit is contained in:
parent
4ff645abd0
commit
790f7a33b7
12
index.js
12
index.js
@ -197,14 +197,22 @@ function processToolCallMessages() {
|
|||||||
// Create a container for the rendered markdown
|
// Create a container for the rendered markdown
|
||||||
const renderContainer = $('<div class="sillybubble-rendered-image"></div>');
|
const renderContainer = $('<div class="sillybubble-rendered-image"></div>');
|
||||||
|
|
||||||
// Add the markdown content (render the image)
|
// 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);
|
renderContainer.html(tool.result);
|
||||||
|
}
|
||||||
|
|
||||||
// Remove any existing rendered images
|
// Remove any existing rendered images
|
||||||
$(this).find('.sillybubble-rendered-image').remove();
|
$(this).find('.sillybubble-rendered-image').remove();
|
||||||
|
|
||||||
// Add this image after the summary element
|
// Add this image after the summary element, but only if details is present
|
||||||
|
if (summaryElement.length) {
|
||||||
summaryElement.after(renderContainer);
|
summaryElement.after(renderContainer);
|
||||||
|
}
|
||||||
|
|
||||||
// Mark this message as processed
|
// Mark this message as processed
|
||||||
$(this).attr('data-sb-processed', 'true');
|
$(this).attr('data-sb-processed', 'true');
|
||||||
|
Loading…
x
Reference in New Issue
Block a user