[Bug] Clicking config-health "Show details" crashes the renderer to a white screen

Author: sojo-negaiCreated Sep 14, 2026Updated Sep 14, 2026

Bug description

Clicking Show details in the config-health warning banner causes the entire Hermes Desktop renderer to become a blank white screen.

This is reproducible in local mode, so it is not specific to SSH or remote gateway connectivity.

Related to #803, which mentions the same blank details view as part of a larger SSH/API-key report. This issue isolates the renderer crash and its apparent callback-wiring cause.

Environment

  • Hermes Desktop / Hermes One: 0.7.7
  • OS: Windows 11
  • Connection mode: Local
  • Warning displayed: API Server Key not set — chat will fail.

Steps to reproduce

  1. Start Hermes Desktop with API_SERVER_KEY unset.
  2. Wait for the config-health banner to appear at the top of Chat.
  3. Click Show details.
  4. The application content disappears and the renderer becomes a blank white screen.

Expected behavior

Settings should open to the Diagnose/config-health section and display the reported configuration issue.

Actual behavior

The renderer crashes and the window becomes completely white. Restarting the application is required to recover.

Apparent root cause

ConfigHealthBanner passes onOpenDiagnose directly to React as the click handler:

typescript
<button
  className="config-health-banner-link"
  type="button"
  onClick={onOpenDiagnose}
>
  {t("diagnose.banner.showDetails")}
</button>

React therefore calls it with the click event.

The parent forwards the received argument as a Settings section:

typescript
onOpenDiagnose={(section?: string) =>
  openSettings(section, { profile: run.profile })
}

SettingsModal.resolveSection() then assumes the value is a string:

typescript
function resolveSection(name?: string): SettingsSection {
  const key = (name || "").trim().toLowerCase();
  // ...
}

At runtime, name is the React click event rather than a section name, leading to an error equivalent to:

TypeError: (name || "").trim is not a function

This uncaught render error leaves the application window blank.

Additional navigation issue

The intended destination appears to be Settings → Diagnose, but SETTINGS_NAV does not currently include a diagnose entry, even though a ConfigHealth screen exists.

Therefore, merely preventing the event from being forwarded may avoid the crash, but it may still open the fallback appearance section rather than the configuration details.

Suggested fix

Pass an explicit section string instead of forwarding the React event:

typescript
onClick={() => onOpenDiagnose?.("diagnose")}

Update the prop type accordingly:

typescript
interface ConfigHealthBannerProps {
  profile?: string;
  onOpenDiagnose?: (section?: string) => void;
}

Also add/restore the Diagnose section in SETTINGS_NAV and render the ConfigHealth pane for that section.

As defensive hardening, resolveSection() could reject non-string input:

typescript
function resolveSection(name?: unknown): SettingsSection {
  const key = typeof name === "string" ? name.trim().toLowerCase() : "";
  // ...
}

Regression test suggestions

  1. Render ConfigHealthBanner with a mocked onOpenDiagnose.
  2. Click Show details.
  3. Assert that the callback receives "diagnose", not a click event.
  4. Open Settings with initialSection="diagnose".
  5. Assert that the config-health details pane is rendered.
  6. Assert that clicking the banner does not trigger the application error boundary or blank the renderer.