Release v0.51.611 — configurable JSON/YAML code-block default view (#484)

[nesquena-hermes]

Release v0.51.611 — configurable JSON/YAML code-block default view (#484)

Ships #4788 (by @metaember). Nathan-approved (screenshots reviewed on Telegram).

What it does

Adds a Settings → Appearance control "JSON/YAML code blocks": Auto (default) / On / Off + an "Auto threshold lines" input (1–1000, default 10). The old hardcoded lineCount >= 10 tree behavior is exactly reproduced by Auto + 10, so nothing changes for existing users unless they opt in. Per-block Tree/Raw toggle unaffected. Fixes the annoyance where a modest JSON/YAML block over 10 lines balloons into a tall tree and pushes the conversation off-screen.

Gate results (all clean)

• Codex (GPT-5.5): SAFE TO SHIP — verified exact default-parity for auto+10 at the 9/10/11 boundary (no rendering change for existing users), enum/range validation + frontend sanitizers, all 13 locale blocks present, and the live re-render path clears render/session caches before rebuilding (safe with the shipped perf(#4346): recycle DOM nodes during virtual-scroll re-renders #4478 DOM-recycle).
• Full suite: 10307 passed, 0 failed.
• Visual: real-page screenshots (tree-render + the new Settings control) captured via the screenshot harness and approved by @nesquena.

Maintainer fix applied: reworded one comment whose apostrophe tripped an existing test's brace-matcher (test_smooth_text_fade) — zero behavior change, node -c clean.

Rebased onto current master (v0.51.610).

Closes #484.

[greptile-apps]

Greptile Summary

This release ships the configurable JSON/YAML code-block default view feature (#484): users can now choose Auto (tree when ≥ N lines), On (always tree), or Off (always raw) via Settings → Appearance, with the Auto + 10-line default exactly reproducing the previous hardcoded behavior.

• static/ui.js: Replaces the lineCount>=10 hardcode with three sanitized helpers (_structuredCodeMode, _structuredCodeThreshold, _structuredCodeShowTree) and a pure testable decision function covering all enum and boundary cases.
• api/config.py + static/boot.js: Adds server-side enum/range validation and client-side sanitization with identical fallbacks (auto, threshold 10), ensuring the feature is safe before settings load.
• static/panels.js: Wires the new controls into the settings lifecycle (load, autosave, profile-switch, full save), including an immediate transcript re-render on mode change and a server round-trip sync that avoids double-rendering.

Confidence Score: 4/5

Safe to merge; the default-parity guarantee is well-tested and the new code paths all have sanitization with safe fallbacks.

The core logic — the pure _structuredCodeShowTree decision function, server-side validation, client-side sanitization, and re-render gating — is correct and covered by the Node.js behavioral test. The only items worth a second glance are cosmetic: if the settings panel happens to be open during a profile switch, the dropdown and threshold input will show stale values until reopened (globals are correct and rendering is unaffected), and the {once:false} listener option is a no-op that could confuse future readers. Neither affects functionality.

static/panels.js — specifically the _applySavedSettingsUi call site where the DOM controls are not synced after a profile switch; all other files are straightforward.

Important Files Changed

Filename	Overview
static/ui.js	Replaces hardcoded lineCount>=10 with three pure helper functions and threads them into initTreeViews; each helper has its own sanitization and fallback to the original behavior.
static/panels.js	Adds UI read/apply/sync helpers and wires them into the settings lifecycle; {once:false} on addEventListener is redundant, and _syncStructuredCodeLinesEnabled is not called from _applySavedSettingsUi, leaving controls potentially stale during a profile switch.
api/config.py	Adds structured_code_default_view (enum: auto/on/off, default auto) and structured_code_auto_tree_lines (int range 1–1000, default 10) with correct backward-compatible defaults.
static/boot.js	Initializes both runtime globals in the normal and fallback paths with client-side sanitization identical to server-side validation.
static/i18n.js	Adds 6 new i18n keys across all 13 locale blocks consistently.
static/index.html	Adds the Settings → Appearance controls with correct data-i18n wiring and browser-level min/max constraints.
tests/test_issue484_json_tree_viewer.py	Replaces the hardcoded-threshold assertion with a comprehensive configurable-default test class including a Node.js-executed behavioral test covering all edge cases.
CHANGELOG.md	Adds v0.51.611 release entry for the configurable JSON/YAML code-block default view feature.

Sequence Diagram

%%{init: {'theme': 'neutral'}}%%
sequenceDiagram
    participant U as User (Settings Panel)
    participant P as panels.js
    participant G as Window Globals
    participant S as Server (api/config.py)
    participant R as Renderer (ui.js)

    U->>P: Change select to 'on'/'off'/'auto'
    P->>P: _structuredCodeViewFromUi()
    P->>G: "_applyStructuredCodeViewSettings(mode, lines, rerender=true)"
    G->>G: Update _structuredCodeDefaultView + _structuredCodeAutoTreeLines
    P->>P: _syncStructuredCodeLinesEnabled()
    P->>R: clearMessageRenderCache() + renderMessages()
    R->>R: initTreeViews() → _structuredCodeShowTree(mode, threshold, lineCount)
    P->>P: _scheduleAppearanceAutosave()
    P->>S: POST /api/settings
    S->>S: Validate enum + range (1..1000)
    S-->>P: saved settings (server-clamped)
    P->>G: "_applyStructuredCodeViewSettings(saved.mode, saved.lines, rerender=false)"
    P->>U: Sync select + input from window globals
    P->>P: _syncStructuredCodeLinesEnabled()

Loading

%%{init: {'theme': 'base', 'themeVariables': {"darkMode": true, "background": "#0d1117", "primaryColor": "#21262d", "primaryTextColor": "#e6edf3", "primaryBorderColor": "#8b949e", "lineColor": "#8b949e", "textColor": "#e6edf3", "edgeLabelBackground": "#161b22", "actorBkg": "#21262d", "actorBorder": "#8b949e", "actorTextColor": "#e6edf3", "actorLineColor": "#8b949e", "signalColor": "#8b949e", "signalTextColor": "#e6edf3", "noteBkgColor": "#373320", "noteBorderColor": "#d4a72c", "noteTextColor": "#f0e6c0", "labelBoxBkgColor": "#21262d", "labelBoxBorderColor": "#8b949e", "labelTextColor": "#e6edf3", "loopTextColor": "#e6edf3", "activationBkgColor": "#30363d", "activationBorderColor": "#8b949e"}}}%%
sequenceDiagram
    participant U as User (Settings Panel)
    participant P as panels.js
    participant G as Window Globals
    participant S as Server (api/config.py)
    participant R as Renderer (ui.js)

    U->>P: Change select to 'on'/'off'/'auto'
    P->>P: _structuredCodeViewFromUi()
    P->>G: "_applyStructuredCodeViewSettings(mode, lines, rerender=true)"
    G->>G: Update _structuredCodeDefaultView + _structuredCodeAutoTreeLines
    P->>P: _syncStructuredCodeLinesEnabled()
    P->>R: clearMessageRenderCache() + renderMessages()
    R->>R: initTreeViews() → _structuredCodeShowTree(mode, threshold, lineCount)
    P->>P: _scheduleAppearanceAutosave()
    P->>S: POST /api/settings
    S->>S: Validate enum + range (1..1000)
    S-->>P: saved settings (server-clamped)
    P->>G: "_applyStructuredCodeViewSettings(saved.mode, saved.lines, rerender=false)"
    P->>U: Sync select + input from window globals
    P->>P: _syncStructuredCodeLinesEnabled()

Loading

_{Reviews (1): Last reviewed commit: "release: stamp v0.51.611 (#484 configura..." | Re-trigger Greptile}

[greptile-apps]

The {once:false} option is the default for addEventListener and has no effect here. It can be removed to avoid confusion for future readers who might wonder if it was intentional.

Suggested change

	structuredCodeLinesField.addEventListener('change',function(){
	const cfg=_structuredCodeViewFromUi();
	structuredCodeLinesField.value=cfg.structured_code_auto_tree_lines;
	_applyStructuredCodeViewSettings(cfg.structured_code_default_view,cfg.structured_code_auto_tree_lines,cfg.structured_code_default_view==='auto');
	_scheduleAppearanceAutosave();
	},{once:false});
	structuredCodeLinesField.addEventListener('change',function(){
	const cfg=_structuredCodeViewFromUi();
	structuredCodeLinesField.value=cfg.structured_code_auto_tree_lines;
	_applyStructuredCodeViewSettings(cfg.structured_code_default_view,cfg.structured_code_auto_tree_lines,cfg.structured_code_default_view==='auto');
	_scheduleAppearanceAutosave();
	});

Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!

[greptile-apps]

Lines input disabled-state not synced on profile switch

_applySavedSettingsUi updates the globals via _applyStructuredCodeViewSettings but does not update the DOM elements (modeSel.value, linesField.value) or call _syncStructuredCodeLinesEnabled(). If the settings panel is open when a profile switch fires, the dropdown and threshold input will display the previous profile's values while the globals already reflect the new profile. The full renderMessages() at the end of _applySavedSettingsUi will render correctly (globals are up to date), but the visible controls will be stale until the panel is closed and reopened.

[cutter-sh]

🎬 Cutter preview — PR #4801

Configure default JSON/YAML block view mode — Appearance settings now let you choose the default view for JSON/YAML code blocks and set the Auto threshold.