fix(logs): default log viewer palette to the app theme by TanbirRamim · Pull Request #1871 · skyhook-io/radar

TanbirRamim · 2026-09-23T15:10:12Z

Description

The logs panel always opened dark, and in dark app theme the web app passed forceDark, which also hid the Sun/Moon toggle (as described in #1790).

This adds a defaultDark prop to LogCore / LogsViewer / WorkloadLogsViewer: the palette the viewer starts with when the user hasn't picked one. Unlike forceDark, it leaves the toggle visible.

In the web app:

Light theme: logs start light, and the toggle can switch them to dark. That choice is saved in radar-logs-dark and wins from then on.
Dark theme: logs stay dark and the toggle is hidden (forceDark, as before). Light logs on a dark app are never what anyone wants, so dark theme doesn't offer them.
When the app switches from dark to light, the viewer goes back to the user's saved choice, or light if there isn't one.

forceDark works the same for other consumers of @skyhook-io/k8s-ui; with no hint the default stays dark.

Maintainer update: dark theme keeps logs pinned dark (product call), and the viewer re-reads the saved choice when that pin lifts.

Type of change

Bug fix (non-breaking change that fixes an issue)

How has this been tested?

Added unit tests (LogCore.theme.test.tsx: default, follows defaultDark, saved choice wins, forceDark hides toggle). The "follows defaultDark" test fails without the fix.
packages/k8s-ui: npm test passes (3889). tsc shows the same 17 existing errors as main, all in unrelated test files, and none in logs/.
web: npm run tsc, npm run lint (0 errors) and npm test (1510) pass.
Not tested against a live cluster.

Related issues

Fixes #1790

Note

Low Risk
UI-only theme behavior with backward-compatible props; forceDark semantics unchanged for other consumers.

Overview
Fixes log viewer palette always opening dark and the web app using forceDark in dark theme, which hid the Sun/Moon toggle (#1790).

Adds a defaultDark prop on LogCore (and passes it through LogsViewer / WorkloadLogsViewer) for the initial palette when there is no saved radar-logs-dark choice—unlike forceDark, the toggle stays visible. Resolution order is unchanged for overrides: forceDark → localStorage → defaultDark (still defaults to dark). A new effect updates the viewer when defaultDark changes until the user toggles explicitly.

The web wrappers now pass defaultDark={theme === 'dark'} instead of forceDark, so logs match the app theme and follow theme switches while preserving per-user toggle preference. LogCore.theme.test.tsx covers defaults, defaultDark, localStorage precedence, and forceDark hiding the toggle.

^{Reviewed by Cursor Bugbot for commit 7fbd039. Bugbot is set up for automated code reviews on this repo. Configure here.}

The log viewer always opened dark, and in dark app theme the Sun/Moon toggle was hidden because the theme was passed as forceDark. Add a defaultDark prop that seeds the palette when the user hasn't picked one, follows theme changes until they do, and keeps the toggle visible. Fixes skyhook-io#1790

Copilot

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

qodo-free-for-open-source-projects · 2026-09-23T15:11:00Z

PR Summary by Qodo

Default log viewer palette to the app theme

🐞 Bug fix 🧪 Tests 🕐 20-40 Minutes

AI Description

• Adds an app-theme default without locking the log viewer palette.
• Preserves saved user preferences and existing forceDark behavior.
• Tests theme defaults, updates, persistence precedence, and forced-theme locking.

Diagram

graph TD
  A["App Theme"] -->|"read by"| B["Web Wrappers"] -->|"pass defaultDark"| C["Shared Viewers"] -->|"forward prop"| D["LogCore"] -->|"evaluates"| E{"Theme Priority"} -->|"selects"| F["Log Palette"]
  G["Saved Choice"] -->|"overrides default"| E
  H["forceDark Prop"] -->|"locks palette"| E

High-Level Assessment

The prop-based approach is appropriate because the shared package remains independent of the web application's theme context while preserving forceDark compatibility. Reusing forceDark would continue hiding the toggle, and importing the host theme context into the shared package would create undesirable coupling.

Files changed (6) +93 / -7

Bug fix (5) +30 / -7

LogCore.tsxSupport an overridable default log palette +18/-2

Support an overridable default log palette

• Adds defaultDark as the fallback when no forced or saved palette exists. The palette follows defaultDark changes until the user stores an explicit choice, while forceDark retains priority and locks the toggle.

packages/k8s-ui/src/components/logs/LogCore.tsx

LogsViewer.tsxExpose defaultDark through the pod logs viewer +5/-1

Expose defaultDark through the pod logs viewer
• Adds the defaultDark public prop and forwards it to LogCore. Documentation now distinguishes a default palette from a forced, toggle-locking palette.
packages/k8s-ui/src/components/logs/LogsViewer.tsx

WorkloadLogsViewer.tsxExpose defaultDark through the workload logs viewer +5/-2

Expose defaultDark through the workload logs viewer
• Adds defaultDark to the workload viewer API and forwards it to LogCore while retaining existing forceDark behavior.
packages/k8s-ui/src/components/logs/WorkloadLogsViewer.tsx

LogsViewer.tsxUse the app theme as the pod logs default +1/-1

Use the app theme as the pod logs default
• Replaces conditional forceDark usage with defaultDark derived from the current application theme, keeping the palette toggle available in dark mode.
web/src/components/logs/LogsViewer.tsx

WorkloadLogsViewer.tsxUse the app theme as the workload logs default +1/-1

Use the app theme as the workload logs default
• Passes the current application theme as defaultDark instead of forcing dark mode, allowing user palette overrides and preserving the toggle.
web/src/components/logs/WorkloadLogsViewer.tsx

Tests (1) +63 / -0

LogCore.theme.test.tsxTest log palette precedence and theme-following behavior +63/-0

Test log palette precedence and theme-following behavior
• Adds jsdom tests for the dark fallback, defaultDark updates, saved user preference precedence, and forceDark toggle suppression.
packages/k8s-ui/src/components/logs/LogCore.theme.test.tsx

qodo-free-for-open-source-projects · 2026-09-23T15:12:11Z

Code Review by Qodo

🐞 Bugs (0) 📘 Rule violations (1) 📎 Requirement gaps (0) 🎨 UX issues (0) 🔗 Cross-repo conflicts (1) 📜 Skill insights (0)

1. Hub builds reject new prop 🔗 Cross-repo conflict ≡ Correctness

Description

@skyhook-io/radar-app now passes defaultDark to the shared log viewers, but its Kubernetes UI
peer dependency still permits versions from 1.14.8 that predate this prop. Radar Hub Web resolves
the two packages independently and currently pins Kubernetes UI 1.14.9, so upgrading Radar App alone
can fail TypeScript validation or silently retain the old log theme behavior.

Code

web/src/components/logs/LogsViewer.tsx[46]
+      defaultDark={theme === 'dark'}

Evidence
The PR's Radar App wrappers pass the newly introduced defaultDark prop while Radar App still
declares compatibility with Kubernetes UI versions from 1.14.8. Radar Hub Web declares separate
caret dependencies and its lockfile currently resolves Radar App 1.14.5 with Kubernetes UI 1.14.9,
demonstrating that consumers can install or retain the incompatible older UI package independently.
web/src/components/logs/LogsViewer.tsx[41-47]
web/src/components/logs/WorkloadLogsViewer.tsx[40-46]
web/package.json[37-43]
External repo: skyhook-dev/radar-hub-web, package.json [17-21]
External repo: skyhook-dev/radar-hub-web, package-lock.json [1197-1202]
External repo: skyhook-dev/radar-hub-web, package-lock.json [1232-1243]

Agent prompt

The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
Radar App now requires a Kubernetes UI version whose log viewer props include `defaultDark`, but its peer dependency still advertises compatibility with older versions. Radar Hub Web installs Radar App and Kubernetes UI independently, so an app-only upgrade can select an incompatible combination.
## Fix Focus Areas
- web/package.json[37-43]
- web/src/components/logs/LogsViewer.tsx[41-47]
- web/src/components/logs/WorkloadLogsViewer.tsx[40-46]
## Recommended Fix
Raise the `@skyhook-io/k8s-ui` peer dependency floor in Radar App to the first published version containing `defaultDark`. Coordinate the Radar Hub Web dependency and lockfile update so Radar App and Kubernetes UI are upgraded together.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

2. Theme comment repeats nearby logic 📘 Rule violation ⚙ Maintainability

Description

The comment above the second useEffect states that it follows host-theme changes until a saved
palette exists, exactly restating the dependency list and local-storage guard. Removing it leaves
the conditions clear from the effect itself and avoids requiring later changes to update both the
implementation and a prose copy of its behavior.

Code

packages/k8s-ui/src/components/logs/LogCore.tsx[184]
+  // Follow host theme changes until the user picks a palette explicitly.

Evidence
Compliance rule 3036542 prohibits comments that only restate immediately adjacent code. The comment
says the effect follows host-theme changes until a user-selected palette exists, while the following
effect directly implements those same conditions.
Rule 3036542: Avoid explanatory comments that restate obvious code behavior
packages/k8s-ui/src/components/logs/LogCore.tsx[184-190]

Agent prompt

The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
The comment above the theme synchronization effect merely restates the behavior implemented by the effect and its local-storage guard.
## Fix Focus Areas
- packages/k8s-ui/src/components/logs/LogCore.tsx[184-190]
## Recommended Fix
Remove the redundant comment at line 184 while leaving the effect unchanged.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

Tip of the day

💡 Did you know, you can copy the agent prompt from any finding and feed it to your IDE agent

More tips ↗ | Customize Qodo ↗ | Qodo docs ↗

qodo-free-for-open-source-projects · 2026-09-23T15:12:12Z

      setIsDark(forceDark)
    }
  }, [forceDark])
+  // Follow host theme changes until the user picks a palette explicitly.


2. Theme comment repeats nearby logic 📘 Rule violation ⚙ Maintainability

Rule: Rule 3036542: Avoid explanatory comments that restate obvious code behavior

The comment above the second useEffect states that it follows host-theme changes until a saved palette exists, exactly restating the dependency list and local-storage guard. Removing it leaves the conditions clear from the effect itself and avoids requiring later changes to update both the implementation and a prose copy of its behavior.

Agent Prompt

## Issue description The comment above the theme synchronization effect merely restates the behavior implemented by the effect and its local-storage guard. ## Fix Focus Areas - packages/k8s-ui/src/components/logs/LogCore.tsx[184-190] ## Recommended Fix Remove the redundant comment at line 184 while leaving the effect unchanged.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

qodo-free-for-open-source-projects · 2026-09-23T15:12:12Z

      createStream={makeStream}
      overrideDownload={desktopDownload}
-      forceDark={theme === 'dark' ? true : undefined}
+      defaultDark={theme === 'dark'}


1. Hub builds reject new prop 🔗 Cross-repo conflict ≡ Correctness

@skyhook-io/radar-app now passes defaultDark to the shared log viewers, but its Kubernetes UI peer dependency still permits versions from 1.14.8 that predate this prop. Radar Hub Web resolves the two packages independently and currently pins Kubernetes UI 1.14.9, so upgrading Radar App alone can fail TypeScript validation or silently retain the old log theme behavior.

Agent Prompt

## Issue description Radar App now requires a Kubernetes UI version whose log viewer props include `defaultDark`, but its peer dependency still advertises compatibility with older versions. Radar Hub Web installs Radar App and Kubernetes UI independently, so an app-only upgrade can select an incompatible combination. ## Fix Focus Areas - web/package.json[37-43] - web/src/components/logs/LogsViewer.tsx[41-47] - web/src/components/logs/WorkloadLogsViewer.tsx[40-46] ## Recommended Fix Raise the `@skyhook-io/k8s-ui` peer dependency floor in Radar App to the first published version containing `defaultDark`. Coordinate the Radar Hub Web dependency and lockfile update so Radar App and Kubernetes UI are upgraded together.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

Light logs on a dark app are never wanted, so dark theme pins the palette and hides the toggle. Light theme starts light and keeps the toggle, so dark logs on a light app stay one click away. When a pin is lifted the viewer now re-reads the saved choice instead of keeping the pinned palette, and ignores saved values that aren't a palette choice.

nadaverell

Thanks, this fixes #1790. I pushed one change on top: in dark theme the logs stay dark and the toggle stays hidden (light logs on a dark app aren't something we want to offer); light theme gets your behaviour, starting light with the toggle available. I also made the viewer go back to the saved choice when switching from dark to light theme, with a test. Merging once CI is green.

TanbirRamim requested review from hisco and nadaverell as code owners September 23, 2026 15:10

Copilot AI lite review requested due to automatic review settings September 23, 2026 15:10

Copilot AI reviewed Sep 23, 2026

qodo-free-for-open-source-projects Bot reviewed Sep 23, 2026

View reviewed changes

nadaverell approved these changes Oct 3, 2026

View reviewed changes

nadaverell merged commit 3102ae7 into skyhook-io:main Oct 3, 2026
10 checks passed

Navigation Menu

Repository navigation

fix(logs): default log viewer palette to the app theme - #1871

fix(logs): default log viewer palette to the app theme#1871
nadaverell merged 2 commits into
skyhook-io:mainfrom
TanbirRamim:fix/logs-follow-app-theme

TanbirRamim commented Sep 23, 2026 •

edited by nadaverell

Loading

Uh oh!

Copilot AI left a comment

Uh oh!

qodo-free-for-open-source-projects Bot commented Sep 23, 2026

Uh oh!

qodo-free-for-open-source-projects Bot commented Sep 23, 2026 •

edited

Loading

Uh oh!

qodo-free-for-open-source-projects Bot Sep 23, 2026

Uh oh!

qodo-free-for-open-source-projects Bot Sep 23, 2026

Uh oh!

nadaverell left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Conversation

TanbirRamim commented Sep 23, 2026 • edited by nadaverell Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Type of change

How has this been tested?

Related issues

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Uh oh!

qodo-free-for-open-source-projects Bot commented Sep 23, 2026

PR Summary by Qodo

Uh oh!

qodo-free-for-open-source-projects Bot commented Sep 23, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Code Review by Qodo

Uh oh!

qodo-free-for-open-source-projects Bot Sep 23, 2026

Choose a reason for hiding this comment

Uh oh!

qodo-free-for-open-source-projects Bot Sep 23, 2026

Choose a reason for hiding this comment

Uh oh!

nadaverell left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

TanbirRamim commented Sep 23, 2026 •

edited by nadaverell

Loading

qodo-free-for-open-source-projects Bot commented Sep 23, 2026 •

edited

Loading