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

chore(structure): remove TimelineStore from <DocumentPaneProvider/> #8271

Merged
merged 3 commits into from
Jan 21, 2025

Conversation

pedrobonamin
Copy link
Contributor

@pedrobonamin pedrobonamin commented Jan 14, 2025

Description

We have always had only one way to represent the Timeline, it has been defined by the TimelineStore, with the addition of releases we are adding a new store that builds on the events api.
This PR updates the DocumentPaneProvider to receive the timeline through the props, allowing us to inject either this Legacy Timeline or the new Events API.
It also changes the structure export to expose the DocumentPaneProviderWrapper instead of the DocumentPaneProvider

The wrapper now only inserts the legacy Timeline, but in corel it will check the feature flag and use the events store instead.

This PR also removes the timelineMode property from the document pane, given it's not used anywhere. This is a legacy property that was used before the History UI updates

What to review

Is it ok to rename the export as done in here?
Is it ok to deprecate the TimelineMode property as this PR is doing it?

Testing

Existing tests should cover the functionalities, nothing new is added. This PR only moves things around to make it possible to inject a different timeline provider

Notes for release

fix(core): remove timelineMode from documentPaneContext and makes TimelineStore optional.
Deprecations:
useDocumentPane().timelineMode property is now deprecated, this hasn't been used since the updates to the History UI.
useDocumentPane().timelineStore possibly undefined, preparing for the introduction of the events API, this property could be undefined once [corel](https://github.com/sanity-io/sanity/tree/corel) is merged.

@pedrobonamin pedrobonamin requested review from a team as code owners January 14, 2025 16:42
@pedrobonamin pedrobonamin requested review from RitaDias and removed request for a team January 14, 2025 16:42
Copy link

vercel bot commented Jan 14, 2025

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 Jan 20, 2025 10:45am
performance-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jan 20, 2025 10:45am
test-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jan 20, 2025 10:45am
2 Skipped Deployments
Name Status Preview Comments Updated (UTC)
studio-workshop ⬜️ Ignored (Inspect) Visit Preview Jan 20, 2025 10:45am
test-next-studio ⬜️ Ignored (Inspect) Jan 20, 2025 10:45am

@pedrobonamin pedrobonamin requested a review from a team January 14, 2025 16:43
Copy link
Contributor

No changes to documentation

Copy link
Contributor

github-actions bot commented Jan 14, 2025

Component Testing Report Updated Jan 20, 2025 10:52 AM (UTC)

❌ Failed Tests (2) -- expand for details
File Status Duration Passed Skipped Failed
comments/CommentInput.spec.tsx ✅ Passed (Inspect) 1m 6s 15 0 0
formBuilder/ArrayInput.spec.tsx ✅ Passed (Inspect) 12s 3 0 0
formBuilder/inputs/PortableText/Annotations.spec.tsx ❌ Failed (Inspect) 1m 19s 5 0 1
formBuilder/inputs/PortableText/copyPaste/CopyPaste.spec.tsx ✅ Passed (Inspect) 50s 11 7 0
formBuilder/inputs/PortableText/copyPaste/CopyPasteFields.spec.tsx ✅ Passed (Inspect) 0s 0 12 0
formBuilder/inputs/PortableText/Decorators.spec.tsx ✅ Passed (Inspect) 25s 6 0 0
formBuilder/inputs/PortableText/DisableFocusAndUnset.spec.tsx ✅ Passed (Inspect) 14s 3 0 0
formBuilder/inputs/PortableText/DragAndDrop.spec.tsx ❌ Failed (Inspect) 1m 6s 5 0 1
formBuilder/inputs/PortableText/FocusTracking.spec.tsx ✅ Passed (Inspect) 1m 6s 15 0 0
formBuilder/inputs/PortableText/Input.spec.tsx ✅ Passed (Inspect) 1m 33s 21 0 0
formBuilder/inputs/PortableText/ObjectBlock.spec.tsx ✅ Passed (Inspect) 2m 1s 21 0 0
formBuilder/inputs/PortableText/PresenceCursors.spec.tsx ✅ Passed (Inspect) 13s 3 9 0
formBuilder/inputs/PortableText/Styles.spec.tsx ✅ Passed (Inspect) 26s 6 0 0
formBuilder/inputs/PortableText/Toolbar.spec.tsx ✅ Passed (Inspect) 1m 44s 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 Jan 14, 2025

⚡️ Editor Performance Report

Updated Mon, 20 Jan 2025 10:53:17 GMT

Benchmark reference
latency of sanity@latest
experiment
latency of this branch
Δ (%)
latency difference
article (title) 20.8 efps (48ms) 23.8 efps (42ms) -6ms (-12.5%)
article (body) 67.1 efps (15ms) 68.0 efps (15ms) -0ms (-/-%)
article (string inside object) 25.6 efps (39ms) 24.4 efps (41ms) +2ms (+5.1%)
article (string inside array) 22.0 efps (46ms) 22.7 efps (44ms) -2ms (-3.3%)
recipe (name) 52.6 efps (19ms) 52.6 efps (19ms) +0ms (-/-%)
recipe (description) 52.6 efps (19ms) 58.8 efps (17ms) -2ms (-10.5%)
recipe (instructions) 99.9+ efps (5ms) 99.9+ efps (5ms) +0ms (-/-%)
synthetic (title) 20.4 efps (49ms) 20.4 efps (49ms) +0ms (-/-%)
synthetic (string inside object) 19.6 efps (51ms) 19.6 efps (51ms) +0ms (-/-%)

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) 48ms 59ms 88ms 476ms 794ms 11.8s
article (body) 15ms 18ms 38ms 89ms 214ms 5.8s
article (string inside object) 39ms 41ms 42ms 49ms 0ms 6.5s
article (string inside array) 46ms 48ms 54ms 167ms 357ms 7.3s
recipe (name) 19ms 21ms 25ms 40ms 0ms 7.8s
recipe (description) 19ms 22ms 24ms 36ms 0ms 4.5s
recipe (instructions) 5ms 7ms 8ms 8ms 0ms 3.1s
synthetic (title) 49ms 50ms 51ms 67ms 191ms 11.4s
synthetic (string inside object) 51ms 53ms 60ms 293ms 637ms 8.3s

🧪 Experiment result

The performance result of this branch

Benchmark latency p75 p90 p99 blocking time test duration
article (title) 42ms 54ms 65ms 469ms 784ms 11.1s
article (body) 15ms 16ms 19ms 59ms 115ms 5.2s
article (string inside object) 41ms 45ms 49ms 213ms 194ms 7.4s
article (string inside array) 44ms 47ms 54ms 161ms 170ms 7.1s
recipe (name) 19ms 20ms 23ms 39ms 0ms 7.2s
recipe (description) 17ms 18ms 19ms 30ms 0ms 4.3s
recipe (instructions) 5ms 7ms 9ms 9ms 0ms 3.1s
synthetic (title) 49ms 51ms 54ms 68ms 225ms 11.6s
synthetic (string inside object) 51ms 54ms 67ms 304ms 700ms 8.0s

📚 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
Contributor

@RitaDias RitaDias left a comment

Choose a reason for hiding this comment

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

Great work! I just a couple of questions. :)
Also, I just want to get one more pair of eyes on this beyond my own since I do feel that we might need to add something extra in the changelog about potential breaking changes? But I might be exaggerating that aspect, just want another opinion 🙏

I tagged you @bjoerge but let me know if you are swamped and I'll round robin someone else into the conversation 👍

@@ -9,9 +9,14 @@ import {type TimelineState, type TimelineStore} from './useTimelineStore'
* @internal
*/
export function useTimelineSelector<ReturnValue>(
timelineStore: TimelineStore,
timelineStore: TimelineStore | undefined,
Copy link
Contributor

Choose a reason for hiding this comment

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

A tad concerned about this change, this will be a breaking change since users so far haven't had to be concerned about potentially sending an undefined through here.

Though the more I think about it might be fine? Since overall the users might need to make some extra changes? We do still keep the legacy components 🤔

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Very valid concern, I'm not sure how we should handle this type of changes. However I highly doubt that any customer is using this, and if they are using it they are probably depending on the useTimelineSelector which is updated to match this new possibly undefined type.

This won't be undefined yet, it will be once we merge corel and we enable the eventsAPI.

We also have the option here to not expose this as undefined just yet and do that change as part of corel

packages/sanity/src/structure/panes/document/types.ts Outdated Show resolved Hide resolved
Comment on lines +70 to +74
setTimelineMode?: undefined
/**
* @deprecated not used anymore
* */
timelineMode?: undefined
Copy link
Contributor

Choose a reason for hiding this comment

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

I don't know what's our current go to approach for deprecating properties. I think the way we've been doing it is first putting the @deprecated label, leaving it to simmer for a bit as a warning for folks not to use it and only later removing it instead of changing the type now since this will cause an immediate breaking change

I'm not sure who to tag so let's say @bjoerge , do you have thoughts?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

It has been unused by us since we merged the History UI updates and it hasn't made much sense since then.
Would like to understand how to properly handle this deprecations.

This was previously used to determine which Timeline Selection menu was open, when we had the option to select the document from the document header, with the new this is not needed.

Copy link
Contributor

Choose a reason for hiding this comment

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

huh, if this is the case I would almost prefer to remove it (ripping off the bandaid) which is certainly more extreme but I feel it would be preferrable vs a middle ground like this. Though maybe the approach should be as I mentioned above, I'm not sure

We should probably overall clarify how do we want to handle these cases.

Copy link
Member

Choose a reason for hiding this comment

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

Seems unlikely that anyone would rely on this? If it's no longer in use, it should be fine to remove it.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Yeah, I have the same feeling, and if they are depending on it they should update it because it's not respected by us anymore.

@pedrobonamin
Copy link
Contributor Author

Great work! I just a couple of questions. :) Also, I just want to get one more pair of eyes on this beyond my own since I do feel that we might need to add something extra in the changelog about potential breaking changes? But I might be exaggerating that aspect, just want another opinion 🙏

I tagged you @bjoerge but let me know if you are swamped and I'll round robin someone else into the conversation 👍

Thanks for reviewing @RitaDias , just updated the notes for release to reflect this two deprecations.

Copy link
Member

@bjoerge bjoerge left a comment

Choose a reason for hiding this comment

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

LGTM! (as in Looks Great To Me)

@pedrobonamin pedrobonamin added this pull request to the merge queue Jan 21, 2025
Merged via the queue into next with commit 84dd2ba Jan 21, 2025
57 checks passed
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