Keep workload pane loader centered when host height chain collapses - #1157
Draft
nadaverell wants to merge 1 commit into
Draft
Keep workload pane loader centered when host height chain collapses#1157nadaverell wants to merge 1 commit into
nadaverell wants to merge 1 commit into
Conversation
Full-pane fetch states (Overview/YAML/drawer loading, error, not-found) and the Topology pane used bare h-full, which collapses to content height when an embedding host lets the page scroll (auto-height ancestors) — pinning the radar loader to the top of the pane, as seen on mobile. Add a 60dvh min-height floor so these states keep a band to center in; the floor is a no-op when the pane resolves to a real viewport-bound height. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01CS93k2c3jsTwuyyQZ62L9L
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
On the hosted app-detail workload view (mobile), the Overview tab's loading radar sat pinned to the top of the pane instead of centering.
Root cause: the full-pane fetch states in
WorkloadView(OverviewInfoTab, YAML pane, drawer body — loader / error / not-found viaFetchResult) and the Topology pane wrapper all rely on bareh-full. That centers correctly when the ancestor height chain terminates in a viewport-bound frame (standalone Radar'sh-screen), but embedded hosts useh-full min-h-0all the way up — if the host page scrolls (auto-height ancestors, as on mobile),h-fullcollapses to content height and the loader hugs the top. The Topology pane'sabsolute inset-0loader collapses to zero height in the same scenario.Fix: introduce a shared
FULL_PANE_FETCH_STATEclass (h-full min-h-[60dvh]) for the threeFetchResultcall sites and give the Topology pane wrapper the samemin-h-[60dvh]floor. The floor is a no-op when the pane resolves to a real height (any pane ≥ 60dvh), and gives the loader a viewport-relative band to center in when the chain collapses.Type of change
How has this been tested?
make tscpasses.No unit tests cover this component; the change is a pure CSS min-height floor. The collapsed-chain scenario can't reproduce in standalone Radar (its
h-screenframe keeps the chain intact), so behavior there is unchanged by construction; verification of the embedded-host mobile case needs a Radar Hub deploy consuming this@skyhook-io/k8s-uichange.Tested locally with minikube/kind
Tested against a remote cluster
Added/updated unit tests
Checklist
Related issues
N/A — reported via mobile screenshot of the hosted app detail view.
🤖 Generated with Claude Code
https://claude.ai/code/session_01CS93k2c3jsTwuyyQZ62L9L
Generated by Claude Code