Skip to content

fix(logs): adjust back-to-top containers to window width resize#112374

Merged
JoshuaKGoldberg merged 2 commits intomasterfrom
logs-table-back-to-top-window-resize
Apr 8, 2026
Merged

fix(logs): adjust back-to-top containers to window width resize#112374
JoshuaKGoldberg merged 2 commits intomasterfrom
logs-table-back-to-top-window-resize

Conversation

@JoshuaKGoldberg
Copy link
Copy Markdown
Member

@JoshuaKGoldberg JoshuaKGoldberg commented Apr 7, 2026

I would have preferred to get rid of JavaScript tableWidth altogether and use a pure CSS approach. But:

  • These are siblings of a table, which makes it tricky without adding additional DOM elements and mucking around with the layout
  • CSS anchor positioning would help us but Firefox only landed it as stable in 147. We support the last 10 Firefox versions; 146 will expire in September 2026 or so.

I'm separately asking around internally about how/whether we track "once browser support gets there" things like this.

Fixes LOGS-672

@github-actions github-actions bot added the Scope: Frontend Automatically applied to PRs that change frontend components label Apr 7, 2026
@linear-code
Copy link
Copy Markdown

linear-code bot commented Apr 7, 2026

@JoshuaKGoldberg JoshuaKGoldberg marked this pull request as ready for review April 7, 2026 18:41
@JoshuaKGoldberg JoshuaKGoldberg requested review from a team as code owners April 7, 2026 18:41
Comment thread static/app/utils/useElementWidth.tsx Outdated
Copy link
Copy Markdown
Contributor

@nsdeschenes nsdeschenes left a comment

Choose a reason for hiding this comment

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

I see you're using getBoundingClientRect, is there any chance that clientWidth would work?

We do have a useDimensions hook already 👀

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 2 potential issues.

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 edb8184. Configure here.

Comment thread static/app/utils/useElementWidth.tsx Outdated
Comment thread static/app/utils/useElementWidth.tsx Outdated
Comment thread static/app/utils/useElementWidth.tsx Outdated
Comment thread static/app/utils/useElementWidth.tsx Outdated
@JoshuaKGoldberg JoshuaKGoldberg merged commit c640119 into master Apr 8, 2026
67 checks passed
@JoshuaKGoldberg JoshuaKGoldberg deleted the logs-table-back-to-top-window-resize branch April 8, 2026 13:11
JoshuaKGoldberg added a commit that referenced this pull request Apr 9, 2026
…112460)

Following up on #112374, I noted two things that could be simplified
with `useDimensions`:

* ~Runtime: it takes in an options object, but there's only one
property. This means every call creates a new JS object. This is a
little papercut for performance (almost certainly not impactful on its
own, but they add up).~ This is intentional and preferred; reverted.
* Types: its type parameter is unnecessary, and only bypasses
[`@typescript-eslint/no-unnecessary-type-parameters`](https://typescript-eslint.io/rules/no-unnecessary-type-parameters)
because it forwards the type parameter to `RefObject`
(https://typescript-eslint.io/rules/no-unnecessary-type-parameters/#limitations)
george-sentry pushed a commit that referenced this pull request Apr 9, 2026
)

I would have preferred to get rid of JavaScript `tableWidth` altogether
and use a pure CSS approach. But:

* These are siblings of a table, which makes it tricky without adding
additional DOM elements and mucking around with the layout
* [CSS anchor
positioning](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Anchor_positioning)
_would_ help us but Firefox only landed it as stable in 147. We support
the last 10 Firefox versions; 146 will expire in September 2026 or so.

I'm separately asking around internally about how/whether we track
_"once browser support gets there"_ things like this.

Fixes LOGS-672
george-sentry pushed a commit that referenced this pull request Apr 9, 2026
…112460)

Following up on #112374, I noted two things that could be simplified
with `useDimensions`:

* ~Runtime: it takes in an options object, but there's only one
property. This means every call creates a new JS object. This is a
little papercut for performance (almost certainly not impactful on its
own, but they add up).~ This is intentional and preferred; reverted.
* Types: its type parameter is unnecessary, and only bypasses
[`@typescript-eslint/no-unnecessary-type-parameters`](https://typescript-eslint.io/rules/no-unnecessary-type-parameters)
because it forwards the type parameter to `RefObject`
(https://typescript-eslint.io/rules/no-unnecessary-type-parameters/#limitations)
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