Repository navigation
[UX-1535] fix partition tab crash in topic view - #2665
Merged
Merged
Conversation
The Partitions tab crashes the topic page with React error #310 when it mounts before the partitions request finishes. TopicPartitions returns a skeleton before it calls useDataTable, so the render after the data arrives calls one more hook than the first render. The load-transition test mounts the tab with no partitions in the store, then adds them. It fails with "Rendered more hooks than during the previous render" until the hook order is fixed. The other tests cover the no-permission case and the leaderless and under-replicated badges.
Opening a topic on the Partitions tab before its partitions load replaced the whole page with React error #310. TopicPartitions returned a skeleton before it called useDataTable, so the render after the data arrived called one more hook than the first render. This happens on any topic when the tab is the remembered tab or is opened from the #partitions hash. The columns and useDataTable now run before the loading and no-permission returns, with an empty array as data until the partitions arrive. The returns only choose what to render.
r-vasquez
changed the title
r-vasquez
requested review from
jvorcak and
malinskibeniamin
and removed request for
malinskibeniamin
October 5, 2026 21:18
Contributor
✅ Clean — no registry drift, off-token colours, or ad-hoc classesApp:
Generated by lookout audit-changes. |
There was a problem hiding this comment.
Copilot review overview
🟢 Approval recommended
The hook-ordering defect is correctly resolved and covered by focused tests.
Review effort: Balanced
Findings: None
What changed in this PR
Fixes the Topic Partitions tab crash caused by inconsistent React hook ordering during asynchronous loading.
Changes:
- Runs table hooks consistently before early returns.
- Uses stable empty partition data while loading.
- Adds regression tests for loading, permissions, and health indicators.
| File | Description |
|---|---|
frontend/src/components/pages/topics/tab-partitions.tsx |
Stabilizes hook ordering during partition loading. |
frontend/src/components/pages/topics/tab-partitions.test.tsx |
Adds regression and rendering coverage. |
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
Mateoc
approved these changes
Oct 5, 2026
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
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.
What and why
Fixes UX-1535.
The topic page crashed with React error #310 when the Partitions tab mounted before its partitions loaded.
TopicPartitionsreturned early before it calleduseDataTable, so the next render called one more hook.This PR moves the columns and
useDataTableabove the early returns. The table uses an empty array until the partitions arrive.It also adds
tab-partitions.test.tsxas a reproducer. The test fails on the first commit and passes on the second.Examples
Before: open a topic, click Partitions, go back, and open a different topic. The page shows "Rendered more hooks than during the previous render".
After: the same steps show the partitions table.
