Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: tooltip position in announcements popup #8092

Merged
merged 1 commit into from
Dec 18, 2024
Merged

Conversation

EoinFalconer
Copy link
Contributor

Description

Here is a video of what was happening before this change, you can see that the Close tooltip is rendering at the end of the announcements dialog. I noticed also that now that we have more announcements and scroll that this is causing some layout shift.

3b5c375808a6c000d40d557e529829ec.mp4

It seems as though the container for the button component should have an extra position: relative in the container to stop the tooltip from flying around, what I have done to remedy this is to just add a container around the button in the dialog.

What to review

Whether this is something that should be tackled in @sanity/ui or whether we are ok to proceed with this approach.

Testing

n/a

Notes for release

n/a

@EoinFalconer EoinFalconer requested a review from a team as a code owner December 17, 2024 14:32
@EoinFalconer EoinFalconer requested review from cngonzalez and removed request for a team December 17, 2024 14:32
Copy link

vercel bot commented Dec 17, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
page-building-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Dec 17, 2024 2:42pm
performance-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Dec 17, 2024 2:42pm
test-next-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Dec 17, 2024 2:42pm
test-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Dec 17, 2024 2:42pm
1 Skipped Deployment
Name Status Preview Comments Updated (UTC)
studio-workshop ⬜️ Ignored (Inspect) Dec 17, 2024 2:42pm

Copy link
Contributor

No changes to documentation

Copy link
Contributor

Component Testing Report Updated Dec 17, 2024 2:39 PM (UTC)

✅ All Tests Passed -- expand for details
File Status Duration Passed Skipped Failed
comments/CommentInput.spec.tsx ✅ Passed (Inspect) 1m 12s 15 0 0
formBuilder/ArrayInput.spec.tsx ✅ Passed (Inspect) 13s 3 0 0
formBuilder/inputs/PortableText/Annotations.spec.tsx ✅ Passed (Inspect) 40s 6 0 0
formBuilder/inputs/PortableText/copyPaste/CopyPaste.spec.tsx ✅ Passed (Inspect) 56s 11 7 0
formBuilder/inputs/PortableText/copyPaste/CopyPasteFields.spec.tsx ✅ Passed (Inspect) 0s 0 12 0
formBuilder/inputs/PortableText/Decorators.spec.tsx ✅ Passed (Inspect) 28s 6 0 0
formBuilder/inputs/PortableText/DisableFocusAndUnset.spec.tsx ✅ Passed (Inspect) 15s 3 0 0
formBuilder/inputs/PortableText/DragAndDrop.spec.tsx ✅ Passed (Inspect) 29s 6 0 0
formBuilder/inputs/PortableText/FocusTracking.spec.tsx ✅ Passed (Inspect) 1m 13s 15 0 0
formBuilder/inputs/PortableText/Input.spec.tsx ✅ Passed (Inspect) 2m 48s 21 0 0
formBuilder/inputs/PortableText/ObjectBlock.spec.tsx ✅ Passed (Inspect) 1m 49s 18 0 0
formBuilder/inputs/PortableText/PresenceCursors.spec.tsx ✅ Passed (Inspect) 14s 3 9 0
formBuilder/inputs/PortableText/Styles.spec.tsx ✅ Passed (Inspect) 29s 6 0 0
formBuilder/inputs/PortableText/Toolbar.spec.tsx ✅ Passed (Inspect) 1m 54s 21 0 0
formBuilder/tree-editing/TreeEditing.spec.tsx ✅ Passed (Inspect) 0s 0 3 0
formBuilder/tree-editing/TreeEditingNestedObjects.spec.tsx ✅ Passed (Inspect) 0s 0 3 0

Copy link
Contributor

github-actions bot commented Dec 17, 2024

⚡️ Editor Performance Report

Updated Tue, 17 Dec 2024 16:23:48 GMT

Benchmark reference
latency of sanity@latest
experiment
latency of this branch
Δ (%)
latency difference
article (title) 23.3 efps (43ms) 22.5 efps (45ms) +2ms (+3.5%)
article (body) 72.5 efps (14ms) 77.2 efps (13ms) -1ms (-/-%)
article (string inside object) 26.3 efps (38ms) 27.0 efps (37ms) -1ms (-2.6%)
article (string inside array) 23.5 efps (43ms) 23.3 efps (43ms) +1ms (+1.2%)
recipe (name) 50.0 efps (20ms) 52.6 efps (19ms) -1ms (-5.0%)
recipe (description) 55.6 efps (18ms) 55.6 efps (18ms) +0ms (-/-%)
recipe (instructions) 99.9+ efps (6ms) 99.9+ efps (6ms) +1ms (-/-%)
synthetic (title) 19.2 efps (52ms) 20.0 efps (50ms) -2ms (-3.8%)
synthetic (string inside object) 18.9 efps (53ms) 19.2 efps (52ms) -1ms (-1.9%)

efps — editor "frames per second". The number of updates assumed to be possible within a second.

Derived from input latency. efps = 1000 / input_latency

Detailed information

🏠 Reference result

The performance result of sanity@latest

Benchmark latency p75 p90 p99 blocking time test duration
article (title) 43ms 52ms 79ms 321ms 372ms 10.6s
article (body) 14ms 16ms 18ms 77ms 67ms 4.9s
article (string inside object) 38ms 42ms 48ms 78ms 142ms 6.8s
article (string inside array) 43ms 45ms 74ms 173ms 143ms 7.1s
recipe (name) 20ms 21ms 22ms 39ms 0ms 6.8s
recipe (description) 18ms 20ms 23ms 39ms 0ms 4.6s
recipe (instructions) 6ms 7ms 8ms 31ms 0ms 3.2s
synthetic (title) 52ms 56ms 61ms 88ms 245ms 12.7s
synthetic (string inside object) 53ms 54ms 58ms 112ms 308ms 7.9s

🧪 Experiment result

The performance result of this branch

Benchmark latency p75 p90 p99 blocking time test duration
article (title) 45ms 50ms 69ms 552ms 1005ms 11.1s
article (body) 13ms 15ms 18ms 91ms 59ms 4.6s
article (string inside object) 37ms 38ms 47ms 97ms 149ms 6.6s
article (string inside array) 43ms 48ms 62ms 86ms 364ms 7.6s
recipe (name) 19ms 21ms 25ms 37ms 0ms 6.8s
recipe (description) 18ms 20ms 24ms 44ms 0ms 4.6s
recipe (instructions) 6ms 7ms 8ms 34ms 0ms 3.1s
synthetic (title) 50ms 53ms 61ms 275ms 464ms 13.6s
synthetic (string inside object) 52ms 54ms 85ms 406ms 846ms 8.4s

📚 Glossary

column definitions

  • benchmark — the name of the test, e.g. "article", followed by the label of the field being measured, e.g. "(title)".
  • latency — the time between when a key was pressed and when it was rendered. derived from a set of samples. the median (p50) is shown to show the most common latency.
  • p75 — the 75th percentile of the input latency in the test run. 75% of the sampled inputs in this benchmark were processed faster than this value. this provides insight into the upper range of typical performance.
  • p90 — the 90th percentile of the input latency in the test run. 90% of the sampled inputs were faster than this. this metric helps identify slower interactions that occurred less frequently during the benchmark.
  • p99 — the 99th percentile of the input latency in the test run. only 1% of sampled inputs were slower than this. this represents the worst-case scenarios encountered during the benchmark, useful for identifying potential performance outliers.
  • blocking time — the total time during which the main thread was blocked, preventing user input and UI updates. this metric helps identify performance bottlenecks that may cause the interface to feel unresponsive.
  • test duration — how long the test run took to complete.

Copy link
Member

@cngonzalez cngonzalez left a comment

Choose a reason for hiding this comment

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

looks reasonable to me! i'll defer to @RostiMelk since it's his original work but I don't see an issue.

@RostiMelk
Copy link
Member

looks reasonable to me! i'll defer to @RostiMelk since it's his original work but I don't see an issue.

Sorry, I had nothing to do with this feature 😅 I think @pedrobonamin did the implementation.

Copy link
Member

@RostiMelk RostiMelk left a comment

Choose a reason for hiding this comment

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

This looks good to me 👍

@EoinFalconer EoinFalconer added this pull request to the merge queue Dec 18, 2024
Merged via the queue into next with commit 21c9fab Dec 18, 2024
57 checks passed
@EoinFalconer EoinFalconer deleted the eoin/SAPP-1938 branch December 18, 2024 12:40
bjoerge added a commit that referenced this pull request Dec 19, 2024
* next: (68 commits)
  fix(deps): update dependency @sanity/icons to ^3.5.5 (#8105)
  fix(deps): update dependency @sanity/ui to ^2.10.12 (#8108)
  fix(deps): update dependency react-rx to ^4.1.10 (#8109)
  chore(deps): update dependency @sanity/tsdoc to v1.0.153 (#8107)
  chore(deps): update typescript-tooling (#8104)
  fix(deps): update dependency @sanity/icons to ^3.5.5 (#8106)
  feat(typegen): add support for astro (#8098)
  chore(deps): update dependency turbo to ^2.3.3 (#8099)
  fix(deps): Update dev-non-major (#8100)
  fix: `WebSocket is closed before the connection is established` warning (#8042)
  v3.68.1
  fix(deps): update dependency @sanity/presentation to v1.19.13 (#8102)
  v3.68.0
  fix: use consistent `framer-motion` semver range (#8094)
  refactor(core): replace `PortableTextEditor` with `EditorProvider` (#8040)
  fix: improve `SanityDefaultPreview` memoization (#8049)
  fix: tooltip position in announcements popup (#8092)
  fix: replace useMemo with useState (#8095)
  fix: replace unsafe `useMemo` with `useState` (#8047)
  fix: replace `React.createElement` with jsx runtime (#8043)
  ...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants