feat: unify Image/RawMessages topic bar; bump to v1.7.0#23
Merged
Conversation
…essages Both panels already reused the same TopicQuickPicker dropdown, but each hand-rolled its own header container with different padding: Image's had none (compact, ~33px), RawMessages' added `py-1` (~41px). Extract a shared PanelTopicBar (framework/PanelTopicBar.tsx) that standardizes the box model (flex items-center, horizontal-only padding, height driven by the picker's own h-8) while still letting each panel override colors/borders via className, and use it in both panels. RawMessages now matches Image panel's shorter topic-bar height, which is the reference experience going forward. Image panel's own styling (permanently-dark chrome) is unchanged. Plot/Audio/JointStatePlot keep their own bespoke header rows for now (different layout needs), but can adopt PanelTopicBar later with no API changes required.
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.
Summary
TopicQuickPickerdropdown, but each hand-rolled its own header container with different padding, so the Raw panel's topic bar was visibly taller (~41px) than the Image panel's (~33px).PanelTopicBar(src/features/panels/framework/PanelTopicBar.tsx) that standardizes the box model (horizontal-only padding, height driven purely by the picker's ownh-8), while still letting each panel override colors/borders viaclassName. Both panels now use it; RawMessages' topic bar now matches the Image panel's shorter height (confirmed both measure exactly 33px). Image panel's own dark chrome styling is unchanged.PanelTopicBarlater with no API changes required.package.jsonversion to1.7.0(not tagged yet).Includes
.github/workflows/ci.ymlfrom the already-merged #22 (mcap CLI is local-only, not installed in CI) as part of this branch's base — no further CI changes here.Test plan
npm run lintnpm run typechecknpm test(573 unit tests, incl. newPanelTopicBar.test.tsx)npm run build(SPA) andnpm run build:libnpm run gen:e2e:fixtures && npm run test:e2e(35 Playwright tests)Do not merge yet — holding for manual confirmation before merging and tagging
v1.7.0.