ref(nav): use topbar slot for headeractions#112449
Conversation
Plan for migrating action buttons from Layout.HeaderActions (and styled equivalents) into TopBar.Slot name="actions" when the page frame feature flag is active. Covers 28 tasks across three patterns (actions-only, actions+FeedbackButton, actions+FeedbackButton with custom options) plus two component-level migrations (WorkflowEngineListLayout, DomainViewHeader) that cover ~10 additional callers automatically. Co-Authored-By: Claude <[email protected]>
When the page frame feature flag is active, move action buttons out of Layout.HeaderActions (and styled equivalents) and into the TopBar via the actions and feedback slots. This gives the TopBar ownership of button placement in the new page frame layout. Covers 28 sites across alerts, dashboards, discover, explore, insights, performance, profiling, preprod, releases, replays, and issue views. Component-level migrations in WorkflowEngineListLayout and DomainViewHeader cover their downstream callers automatically. Co-Authored-By: Claude <[email protected]>
Buttons inside TopBar.Slot name="actions" are wrapped by SizeProvider in the TopBar, so explicit size props are redundant. Remove them from the slot branch across all 15 affected files; the else branches (inside Layout.HeaderActions) retain their size props unchanged. Co-Authored-By: Claude <[email protected]>
The IssueViewsHeader uses a custom Flex justify="between" layout that co-locates actions (realtime toggle, star, edit menu) with the title in HeaderContent rather than in Layout.HeaderActions. When the page frame feature is active, split the two concerns: title stays in HeaderContent, actions move to TopBar.Slot name="actions". Co-Authored-By: Claude <[email protected]>
…pageframe branch Buttons in the TopBar slot already receive size via SizeProvider context. The else branch should match the same prop-less style for consistency.
…ranch The button relies on SizeProvider context from TopBar, but portal-based slots don't propagate context from the outlet's vdom position. Add explicit size prop to match IssueViewStarButton and IssueViewEditMenu until DE-1079 is resolved. Co-Authored-By: Claude Sonnet 4 <[email protected]>
Plan has been executed and is no longer needed. Co-Authored-By: Claude Sonnet 4 <[email protected]>
github-actions
bot
added
the
Scope: Frontend
JonasBa
changed the title
The no-default-exports eslint rule flagged the default export introduced in this file. Convert to a named export and update the import site. Co-Authored-By: Claude Sonnet 4 <[email protected]>
![sentry[bot]](https://avatars.githubusercontent.com/in/12637?s=60&v=4){kind=small}
| {t('Create Query')} | ||
| </LinkButton> | ||
| )} | ||
| </Grid> | ||
| </Layout.HeaderActions> | ||
| </TopBar.Slot> | ||
| ) : ( | ||
| <Layout.HeaderActions> | ||
| <Grid flow="column" align="center" gap="md"> | ||
| <FeedbackButton /> | ||
| {hasLogsFeature ? ( | ||
| <DropdownMenu |
There was a problem hiding this comment.
Bug: The <FeedbackButton> was not migrated to the new <TopBar.Slot> in the Saved Queries and Dashboards Manage views, causing it to disappear when hasPageFrameFeature is enabled.
Severity: MEDIUM
Suggested Fix
In both explore/savedQueries/index.tsx and dashboards/manage/index.tsx, wrap the existing <FeedbackButton> component within a <TopBar.Slot name="feedback"> for the code path where hasPageFrameFeature is true. This will align these views with the correct migration pattern used in other files in this pull request.
Prompt for AI Agent
Review the code at the location below. A potential bug has been identified by an AI
agent.
Verify if this is a real issue. If it is, propose a fix; if not, explain why it's not
valid.
Location: static/app/views/explore/savedQueries/index.tsx#L82-L91
Potential issue: During a refactor to replace `Layout.HeaderActions` with
`<TopBar.Slot>`, the `<FeedbackButton>` component was omitted in two views when the
`hasPageFrameFeature` is enabled: `explore/savedQueries/index.tsx` and
`dashboards/manage/index.tsx`. In the old layout, these views had an explicit
`<FeedbackButton />`. In the new layout, the button is missing, whereas other files in
the same pull request correctly migrated the button into a `<TopBar.Slot
name="feedback">`. This omission removes the user-facing feedback functionality from
these pages when the new page frame feature is active.
Did we get this right? 👍 / 👎 to inform future reviews.
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 1 potential issue.
❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.
Reviewed by Cursor Bugbot for commit 045dc29. Configure here.
| </Layout.Header> | ||
| ); | ||
| } | ||
|
|
There was a problem hiding this comment.
Realtime button lost size="sm" in non-pageframe branch
Medium Severity
The realtime toggle Button in the non-pageframe (else) branch lost its size="sm" prop. Before this PR, this button always had size="sm". The PR description notes that size="sm" was intentionally added to the pageframe branch (line 240), but the existing non-pageframe branch accidentally had it removed. This will cause the realtime toggle to render at default size while sibling components like IssueViewStarButton and IssueViewEditMenu remain sm, creating a visual inconsistency for all users without the page frame feature flag.
Reviewed by Cursor Bugbot for commit 045dc29. Configure here.
1 participant
Migrates action buttons from
Layout.HeaderActions(and inline styled equivalents) into theTopBar.Slot name="actions"slot across 28 views, so they render in the unified TopBar when the page frame feature flag is active.Changes
Layout.HeaderActions/Layout.HeaderContentaction patterns with<TopBar.Slot name="actions">across 28 viewssizeprops from buttons inside the slot (they were previously needed to override defaults; now consistent withsmcontext)IssueViewsHeaderwhich was missingsize="sm"in the pageframe branch — explicit prop required until DE-1079 (Slot API context propagation) is resolvedFixes DE-1068