🔒 Aisle Security Analysis

We found 1 potential security issue(s) in this PR:

1. 🔵 Sensitive config values exposed in config change diff panel (no redaction)

Description

The config UI’s diff panel (shown in Form mode when there are pending changes) renders before/after values using renderDiffValue(), which currently does not apply any sensitive-field redaction.

As a result, if a user edits any secret-like config value (e.g. *.token, *.password, *.secret, *.apiKey, etc.), the diff panel will display the secret in cleartext (only truncated), even though other parts of the UI implement sensitive detection/redaction (e.g. countSensitiveConfigValues, REDACTED_PLACEHOLDER).

This risk becomes more likely as new sections such as secrets, acp, and mcp are surfaced in the UI navigation/categories.

Vulnerable code:

function renderDiffValue(path: string, value: unknown, _uiHints: ConfigUiHints): string {
  return truncateValue(value);
}

Data flow:

• Input: user-provided config values (including secrets) in props.formValue / form edits
• Detection exists but unused here: isSensitiveConfigPath() / hintForPath(...).sensitive
• Sink: diff panel HTML rendering of ${renderDiffValue(change.path, change.to, props.uiHints)}

Recommendation

Apply the existing sensitive detection to diff rendering and substitute a placeholder unless the user explicitly reveals that path.

Example fix:

import { isSensitiveConfigPath, hintForPath, REDACTED_PLACEHOLDER } from "./config-form.shared";

function renderDiffValue(path: string, value: unknown, uiHints: ConfigUiHints): string {
  const hint = uiHints ? uiHints[path] : undefined; // or derive via hintForPath using a parsed path array
  const sensitive = (hint?.sensitive ?? false) || isSensitiveConfigPath(path);
  if (sensitive && value != null && String(value).trim() !== "") {
    return REDACTED_PLACEHOLDER;
  }
  return truncateValue(value);
}

Optionally, support per-field reveal (similar to the raw editor and env peek) so users can consciously display secrets when needed.

Analyzed PR: #53272 at commit 9512348

_{Last updated on: 2026-03-24T02:00:23Z}

Greptile Summary

This PR continues a UI clarity pass across theme tokens, button primitives, and configuration/usage surfaces. It refines the Knot theme to a black-and-red palette, consolidates one-off button styles into reusable btn--xs, btn--icon, and btn--ghost variants, and adds icons/metadata for new config sections (Diagnostics, CLI, Secrets, ACP, MCP).

• Theme: openknot (dark) and openknot-light tokens fully rewritten to a crimson-red palette with inline WCAG contrast rationale; a --focus override is present in the dark variant but not the light variant (minor, does not affect the focus ring visuals since --focus-ring resolves via var(--ring)).
• Button consolidation: btn--icon, btn--ghost, and btn--xs moved to components.css; all usage of the old btn-ghost / btn-sm (single-hyphen) class names has been updated consistently across templates and CSS.
• Config UI: Form/Raw mode toggle relocated from .config-top-tabs__right (removed) into .config-actions__left; tabs scroller switched to horizontal overflow instead of wrapping.
• Minor style issue: The sidebar labels for the new shorthand sections use title-case ("Cli", "Acp", "Mcp") while their SECTION_META counterparts in config-form.render.ts already use the conventional all-caps forms — a one-line fix per entry.

Confidence Score: 5/5

• This PR is safe to merge; changes are purely visual/stylistic with no logic, data, or security implications.
• All changes are CSS and UI template updates. The button-naming refactor is complete and consistent across every template file. The only non-trivial finding is a label casing inconsistency ("Cli"/"Acp"/"Mcp" vs "CLI"/"ACP"/"MCP") which is cosmetic and does not affect functionality. No regressions in interactivity, accessibility (WCAG audit is documented inline), or data handling are introduced.
• ui/src/ui/views/config.ts — sidebar label casing for the three new shorthand sections

This is a comment left during a code review.
Path: ui/src/ui/views/config.ts
Line: 904-914

Comment:
**Inconsistent acronym casing in sidebar labels**

The new sidebar entries for the abbreviations (cli, acp, mcp) are labelled with title-case (`"Cli"`, `"Acp"`, `"Mcp"`) while the corresponding `SECTION_META` entries in `config-form.render.ts` use all-caps labels. This causes a visual inconsistency between the sidebar and the form view. Consider updating the labels to use uppercase for these abbreviations to match the metadata definitions.

How can I resolve this? If you propose a fix, please make it concise.

_{Reviews (1): Last reviewed commit: "style: refactor roundness settings UI an..." | Re-trigger Greptile}

Squash-merged to main as 21ac4b9 ✨

• Signed squash commit with changelog entry
• All gates passed (format, typecheck, lint, UI tests 511/511, UI build clean)
• Co-authored-by: @BunsDev + Nova

Security finding from Aisle (sensitive data exposure in config diff panel) addressed in follow-up commit 9dd0530:

• renderDiffValue() now checks isSensitiveConfigPath() and displays [redacted - click reveal to view] instead of raw values for token/password/secret/apiKey paths
• Uses the same redaction helpers already used by the config form view
• UI build clean, 511/511 tests pass