Improve debug tab layout

This commit is contained in:
Jordan Wages 2025-07-19 21:58:37 -05:00
commit bcac4ad017
2 changed files with 29 additions and 8 deletions

View file

@ -154,6 +154,11 @@
<input type="checkbox" id="token-reduction"> Aggressive token reduction
</label>
</div>
<div class="field">
<label class="checkbox">
<input type="checkbox" id="show-debug-tab"> Show debug information
</label>
</div>
<div class="field">
<label class="label" for="max_tokens">Max tokens</label>
<div class="control">
@ -220,11 +225,6 @@
<input class="input" type="number" step="0.01" id="tfs">
</div>
</div>
<div class="field">
<label class="checkbox">
<input type="checkbox" id="show-debug-tab"> Advanced Options
</label>
</div>
</div>
</div>
@ -290,7 +290,10 @@
<span>Debug</span>
</h2>
<pre id="payload-display"></pre>
<div id="diff-display" class="mt-4"></div>
<div id="diff-container" class="mt-4 is-hidden">
<label class="label">Prompt diff</label>
<div id="diff-display" class="box content is-family-monospace"></div>
</div>
</div>
</div>
</section>

View file

@ -70,6 +70,7 @@ document.addEventListener('DOMContentLoaded', async () => {
await applyTheme(themeSelect.value);
const payloadDisplay = document.getElementById('payload-display');
const diffDisplay = document.getElementById('diff-display');
const diffContainer = document.getElementById('diff-container');
let lastFullText = defaults.lastFullText || '';
let lastPromptText = defaults.lastPromptText || '';
@ -83,7 +84,16 @@ document.addEventListener('DOMContentLoaded', async () => {
dmp.Diff_EditCost = 4;
const diffs = dmp.diff_main(lastFullText, lastPromptText);
dmp.diff_cleanupEfficiency(diffs);
diffDisplay.innerHTML = dmp.diff_prettyHtml(diffs);
const hasDiff = diffs.some(d => d[0] !== 0);
if (hasDiff) {
diffDisplay.innerHTML = dmp.diff_prettyHtml(diffs);
diffContainer.classList.remove('is-hidden');
} else {
diffDisplay.innerHTML = '';
diffContainer.classList.add('is-hidden');
}
} else {
diffContainer.classList.add('is-hidden');
}
themeSelect.addEventListener('change', async () => {
markDirty();
@ -751,9 +761,17 @@ document.addEventListener('DOMContentLoaded', async () => {
dmp.Diff_EditCost = 4;
const diffs = dmp.diff_main(lastFullText, lastPromptText);
dmp.diff_cleanupEfficiency(diffs);
diffDisplay.innerHTML = dmp.diff_prettyHtml(diffs);
const hasDiff = diffs.some(d => d[0] !== 0);
if (hasDiff) {
diffDisplay.innerHTML = dmp.diff_prettyHtml(diffs);
diffContainer.classList.remove('is-hidden');
} else {
diffDisplay.innerHTML = '';
diffContainer.classList.add('is-hidden');
}
} else {
diffDisplay.innerHTML = '';
diffContainer.classList.add('is-hidden');
}
}
}