hotfix: IntervalHeatmap null-payload render crash (#150 regression)#166
Merged
Conversation
The #150 refactor onto useIntervalPayload + IntervalWidgetBody left the heatmap's chart subtree dereferencing payload!.grid / payload!.rowLabels. React evaluates the children passed to IntervalWidgetBody eagerly, BEFORE the wrapper decides to render the loading skeleton, so during the initial loading tick (payload === null) this threw an unguarded render-time TypeError that took the whole dashboard down ("Application error: a client-side exception has occurred"), not just the widget. Wrap the populated subtree in {payload && ( ... )} and drop the non-null assertions so payload is dereferenced only when present; while loading/ error/empty, children is falsy and IntervalWidgetBody shows its skeleton/empty as intended. Behavior otherwise identical. Audited the two sibling widgets the #150 refactor touched: IntervalLoadShape dereferences payload only inside guarded derivations (!state || 'error' in state) so its eager children are safe; IntervalHistory keeps its own SWR state and was not moved onto the hook, also safe.
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
1 participant
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.
Production hotfix for a client-side crash introduced by #150 (batch 3, v0.40.2).
Problem
IntervalHeatmap.tsxpassed a chart subtree to<IntervalWidgetBody>that dereferencedpayload!.grid/payload!.rowLabels. React evaluateschildreneagerly when the component renders — beforeIntervalWidgetBodyshort-circuits to the loading skeleton. During the initial loading tickuseIntervalPayloadreturnspayload === null, sopayload!.gridthrewTypeError: Cannot read properties of null (reading 'grid')at render time, taking down the entire dashboard ("Application error: a client-side exception has occurred").It only manifests when the heatmap widget is actually mounted (a fresh/default layout, or a saved layout that includes it — the operator's prod layout did). Unit tests + a happy-path staging screenshot missed it because staging's saved layout didn't include the heatmap. Reproduced on staging by clearing the saved layout (→ default layout mounts the interval widgets) → same crash.
Fix
Gate the populated subtree on
{payload && (…)}and drop the!assertions, sochildrenis falsy during loading andIntervalWidgetBodyrenders its skeleton.useIntervalPayload+IntervalWidgetBodyunchanged. Siblings audited:IntervalLoadShape+IntervalHistoryguard their payload inuseMemo(if (!state || 'error' in state) return []) and are safe — no change.Verification
Prod was rolled back to v0.40.1 to restore service; this ships as v0.40.3.