d8dfun/claude-code-chat
1
0
Fork 0
mirror of https://github.com/andrepimenta/claude-code-chat.git synced 2025-12-09 19:09:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix expand

Browse Source
This commit is contained in:
andrepimenta
2025-07-12 00:10:10 +01:00
parent 1681bea37f
commit 5c33bc94c1
1 changed files with 41 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
src/ui.ts
View File

@@ -971,7 +971,7 @@ const html = `<!DOCTYPE html>
} else if (valueStr.length > 100) {
const truncated = valueStr.substring(0, 97) + '...';
const escapedValue = valueStr.replace(/"/g, '&quot;').replace(/'/g, '&#39;');
result += '<strong>' + key + ':</strong> ' + truncated + ' <span class="expand-btn" data-key="' + key + '" data-value="' + escapedValue + '" onclick="toggleExpand(this)">expand</span>';
result += '<span class="expandable-item"><strong>' + key + ':</strong> ' + truncated + ' <span class="expand-btn" data-key="' + key + '" data-value="' + escapedValue + '" onclick="toggleExpand(this)">expand</span></span>';
} else {
result += '<strong>' + key + ':</strong> ' + valueStr;
}
@@ -1282,6 +1282,46 @@ const html = `<!DOCTYPE html>
}
}
function toggleExpand(button) {
const key = button.getAttribute('data-key');
const value = button.getAttribute('data-value');
// Find the container that holds just this key-value pair
let container = button.parentNode;
while (container && !container.classList.contains('expandable-item')) {
container = container.parentNode;
}
if (!container) {
// Fallback: create a wrapper around the current line
const parent = button.parentNode;
const wrapper = document.createElement('div');
wrapper.className = 'expandable-item';
parent.insertBefore(wrapper, button.previousSibling || button);
// Move the key, value text, and button into the wrapper
let currentNode = wrapper.nextSibling;
const nodesToMove = [];
while (currentNode && currentNode !== button.nextSibling) {
nodesToMove.push(currentNode);
currentNode = currentNode.nextSibling;
}
nodesToMove.forEach(node => wrapper.appendChild(node));
container = wrapper;
}
if (button.textContent === 'expand') {
// Show full content
const decodedValue = value.replace(/&quot;/g, '"').replace(/&#39;/g, "'");
container.innerHTML = '<strong>' + key + ':</strong> ' + decodedValue + ' <span class="expand-btn" data-key="' + key + '" data-value="' + value + '" onclick="toggleExpand(this)">collapse</span>';
} else {
// Show truncated content
const decodedValue = value.replace(/&quot;/g, '"').replace(/&#39;/g, "'");
const truncated = decodedValue.substring(0, 97) + '...';
container.innerHTML = '<strong>' + key + ':</strong> ' + truncated + ' <span class="expand-btn" data-key="' + key + '" data-value="' + value + '" onclick="toggleExpand(this)">expand</span>';
}
}
function sendMessage() {
const text = messageInput.value.trim();
if (text) {