Skip to content

ref(nav): use topbar slot for headeractions#112449

Open
JonasBa wants to merge 13 commits intomasterfrom
jb/ref/topbar-actions
Open

ref(nav): use topbar slot for headeractions#112449
JonasBa wants to merge 13 commits intomasterfrom
jb/ref/topbar-actions

Conversation

@JonasBa
Copy link
Copy Markdown
Member

@JonasBa JonasBa commented Apr 8, 2026

Migrates action buttons from Layout.HeaderActions (and inline styled equivalents) into the TopBar.Slot name="actions" slot across 28 views, so they render in the unified TopBar when the page frame feature flag is active.

Changes

  • Replaces Layout.HeaderActions / Layout.HeaderContent action patterns with <TopBar.Slot name="actions"> across 28 views
  • Removes size props from buttons inside the slot (they were previously needed to override defaults; now consistent with sm context)
  • Fixes the realtime toggle button in IssueViewsHeader which was missing size="sm" in the pageframe branch — explicit prop required until DE-1079 (Slot API context propagation) is resolved
  • Removes the now-executed migration plan doc

Fixes DE-1068

JonasBa and others added 7 commits April 8, 2026 06:24
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 <noreply@anthropic.com>
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 <noreply@anthropic.com>
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 <noreply@anthropic.com>
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 <noreply@anthropic.com>
…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 <noreply@example.com>
Plan has been executed and is no longer needed.

Co-Authored-By: Claude Sonnet 4 <noreply@example.com>
@linear-code
Copy link
Copy Markdown

linear-code bot commented Apr 8, 2026

@github-actions github-actions bot added the Scope: Frontend Automatically applied to PRs that change frontend components label Apr 8, 2026
@JonasBa JonasBa changed the title ref(nav): Migrate Layout.HeaderActions to TopBar actions slot ref(nav): use topbar slot for headeractions Apr 8, 2026
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 <noreply@example.com>
@JonasBa JonasBa marked this pull request as ready for review April 8, 2026 08:20
@JonasBa JonasBa requested review from a team as code owners April 8, 2026 08:20
…branch

Co-authored-by: Jonas <JonasBa@users.noreply.github.com>
Co-authored-by: Jonas <JonasBa@users.noreply.github.com>
Resolve conflicts by keeping feedback button in TopBar.Slot name="feedback"
and actions in TopBar.Slot name="actions". Adopt helper consts introduced
in master (userFeedbackFeedbackOptions, logsFeedbackOptions, issueViewsFeedbackOptions,
buildDetailsFeedbackOptions) to reduce inline duplication. Also remove
duplicate hasPageFrameFeature declarations introduced during the merge in
feedbackListPage, issueViewsList, and buildDetailsHeaderContent.

Co-Authored-By: Claude Sonnet 4 <noreply@anthropic.com>
createPortal does not propagate React context, so buttons inside
TopBar.Slot name="actions" do not inherit the SizeProvider size="sm"
wrapping the slot outlet. Add explicit size="sm" to all Button,
LinkButton, CreateAlertButton, StatusToggleButton, and NewMonitorButton
instances placed inside actions slots across affected views.

Co-Authored-By: Claude Sonnet 4.6 <noreply@example.com>
Two files had the hook called twice due to merge conflicts, causing
TS2451 redeclaration errors in the @typescript/native-preview CI check.

Co-Authored-By: Claude Sonnet 4.6 <noreply@example.com>
Copy link
Copy Markdown
Contributor

@cursor cursor bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cursor Bugbot has reviewed your changes and found 1 potential issue.

Fix All in Cursor

❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.

Reviewed by Cursor Bugbot for commit 9df0880. Configure here.

{rule.status === 'disabled' ? t('Edit to enable') : t('Edit Rule')}
</LinkButton>
</Grid>
</Layout.HeaderActions>
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Missing size="sm" on LinkButtons in TopBar slot

Medium Severity

The two LinkButton elements (Duplicate and Edit Rule) inside the TopBar.Slot branch are missing size="sm", while the non-pageframe branch correctly includes it. Because the slot uses createPortal, the SizeProvider size="sm" in the TopBar outlet does not propagate context to slotted content (the PR description itself notes this as DE-1079). These buttons will render at default md size instead of sm, which is inconsistent with every other view in this same PR where size="sm" is kept on buttons inside TopBar.Slot.

Fix in Cursor Fix in Web

Reviewed by Cursor Bugbot for commit 9df0880. Configure here.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Scope: Frontend Automatically applied to PRs that change frontend components

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants