Skip to content

fix(dashboards): Stop widget header action clicks from bubbling#116096

Open
skaasten wants to merge 2 commits into
masterfrom
shaunkaasten/dain-1684-close-widget-on-open-sidedrawer
Open

fix(dashboards): Stop widget header action clicks from bubbling#116096
skaasten wants to merge 2 commits into
masterfrom
shaunkaasten/dain-1684-close-widget-on-open-sidedrawer

Conversation

@skaasten
Copy link
Copy Markdown
Contributor

@skaasten skaasten commented May 22, 2026

Stop click events from bubbling out of widget header action buttons (full-screen view, copy URL).

On prebuilt dashboards like Web Vitals that wire a slideout drawer to the wrapper's onClick, the bubble caused the full-screen modal and the slideout drawer to open from a single click and overlap.

Root cause

The header buttons in widgetFrame.tsx didn't e.stopPropagation(), so a click on the expand icon fired the button's onFullScreenViewClick and bubbled up to GridWidgetWrapper's onClick in sortableWidget.tsx, which opens the slideout. Same bubble exists for the Copy URL button and any single custom action.

Fix

Each header action button now stops propagation before invoking its handler. The wrapper's click target stays the widget body, so the slideout only opens when the user actually clicks into the widget body — not when they interact with a header button.

Fixes DAIN-1684

…awer

On prebuilt dashboards (e.g. Web Vitals), widgets that expose a
slideout drawer also rendered the full-screen view button. Clicking
the expand icon opened the widget viewer modal while the same click
bubbled to the widget wrapper and opened the slideout drawer,
leaving both visible at once.

Pass `disableFullscreen: hasSlideout` to `WidgetCard` so the expand
icon is omitted when a slideout drawer is configured, leaving the
drawer as the only entry point.

Fixes DAIN-1684
@linear-code
Copy link
Copy Markdown

linear-code Bot commented May 22, 2026

DAIN-1684

@github-actions github-actions Bot added the Scope: Frontend Automatically applied to PRs that change frontend components label May 22, 2026
@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented May 22, 2026

📊 Type Coverage Diff

✅ No new type safety issues introduced. Coverage: 93.63%

@skaasten skaasten marked this pull request as ready for review May 22, 2026 14:43
@skaasten skaasten requested a review from a team as a code owner May 22, 2026 14:43
The widget header action buttons (full-screen view, copy URL, single
custom action) did not stop click event propagation, so clicking them
also fired the parent wrapper's onClick. On prebuilt dashboards like
Web Vitals that use the wrapper click to open a slideout drawer, this
caused the full-screen modal and the slideout drawer to open
simultaneously and overlap.

Stop propagation on each header button so the wrapper's click target
remains the widget body. Revert the previous `disableFullscreen`
workaround now that the root cause is addressed.

Fixes DAIN-1684
@skaasten skaasten changed the title fix(dashboards): Hide full-screen view for widgets with a slideout drawer fix(dashboards): Stop widget header action clicks from bubbling May 22, 2026
@skaasten skaasten requested a review from nikkikapadia May 22, 2026 17:35
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.

3 participants