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: create integration copy + layout updates #7787

Merged
merged 4 commits into from
Nov 11, 2024

Conversation

robinpyon
Copy link
Contributor

@robinpyon robinpyon commented Nov 11, 2024

Description

This PR introduces some very minor copy and layout updates to the existing Studio → Create integration. All changes are purely cosmetic.

What to review

  • All copy changes should read naturally (these have been pre-vetted)
  • All dialog buttons (the "Start in Sanity Create" document action and "Unlink" button) should now look more 'native', as they're now correctly passed to the dialog-specific footer prop (as opposed to rendering these within the dialog body)

Testing

N/A – copy and minor layout tweaks only

Notes for release

Not required

Copy link

vercel bot commented Nov 11, 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 Nov 11, 2024 10:37am
performance-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 11, 2024 10:37am
test-compiled-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 11, 2024 10:37am
test-next-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 11, 2024 10:37am
test-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 11, 2024 10:37am
1 Skipped Deployment
Name Status Preview Comments Updated (UTC)
studio-workshop ⬜️ Ignored (Inspect) Nov 11, 2024 10:37am

@@ -61,9 +61,7 @@ export function CreateLinkedDocumentBannerContent(props: CreateLinkedDocumentBan
</Flex>
<Stack space={4}>
<Heading size={2}>{t('create-link-info-popover.header')}</Heading>
<Text size={1}>
<Translate t={t} i18nKey={'create-link-info-popover.text'} />
Copy link
Contributor Author

Choose a reason for hiding this comment

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

No longer using the Translate component as the create-link-info-popover.text resource no longer contains markup

Copy link
Contributor

No changes to documentation

@@ -96,7 +96,8 @@ export function CreateLinkedDocumentBannerContent(props: CreateLinkedDocumentBan
icon={InfoOutlineIcon}
mode="bleed"
onClick={toggleOpen}
style={{marginBottom: '-1em', marginTop: '-1em'}}
// Negative margins added to prevent the button from blowing out banner height
style={{marginBottom: '-0.5em', marginTop: '-0.5em'}}
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Incredibly minor tweak which just ensures the button is the correct size on hover.

Comment on lines -44 to -57

<Flex flex={1} justify="flex-end" gap={2}>
<Button
mode="bleed"
text={t('unlink-from-create-dialog.cancel.text')}
onClick={onClose}
/>
<Button
tone="primary"
text={t('unlink-from-create-dialog.unlink.text')}
onClick={unlink}
disabled={unlinking}
/>
</Flex>
Copy link
Contributor Author

Choose a reason for hiding this comment

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

We now defer layout rendering to the component itself

<StartInCreateDialog
content: <StartInCreateActionContent />,
footer: (
<StartInCreateActionFooter
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Similarly, we separate document action content and footer to ensure it renders a little more closely to what you see in the studio elsewhere

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Similar to above, these Create specific data attrs are no longer needed

Copy link
Contributor

Component Testing Report Updated Nov 11, 2024 10:37 AM (UTC)

✅ All Tests Passed -- expand for details
File Status Duration Passed Skipped Failed
comments/CommentInput.spec.tsx ✅ Passed (Inspect) 47s 15 0 0
formBuilder/ArrayInput.spec.tsx ✅ Passed (Inspect) 9s 3 0 0
formBuilder/inputs/PortableText/Annotations.spec.tsx ✅ Passed (Inspect) 32s 6 0 0
formBuilder/inputs/PortableText/copyPaste/CopyPaste.spec.tsx ✅ Passed (Inspect) 39s 11 7 0
formBuilder/inputs/PortableText/copyPaste/CopyPasteFields.spec.tsx ✅ Passed (Inspect) 0s 0 12 0
formBuilder/inputs/PortableText/Decorators.spec.tsx ✅ Passed (Inspect) 18s 6 0 0
formBuilder/inputs/PortableText/DisableFocusAndUnset.spec.tsx ✅ Passed (Inspect) 11s 3 0 0
formBuilder/inputs/PortableText/DragAndDrop.spec.tsx ✅ Passed (Inspect) 3m 0s 0 0 0
formBuilder/inputs/PortableText/FocusTracking.spec.tsx ✅ Passed (Inspect) 45s 15 0 0
formBuilder/inputs/PortableText/Input.spec.tsx ✅ Passed (Inspect) 1m 44s 21 0 0
formBuilder/inputs/PortableText/ObjectBlock.spec.tsx ✅ Passed (Inspect) 1m 18s 18 0 0
formBuilder/inputs/PortableText/PresenceCursors.spec.tsx ✅ Passed (Inspect) 9s 3 9 0
formBuilder/inputs/PortableText/RangeDecoration.spec.tsx ✅ Passed (Inspect) 27s 9 0 0
formBuilder/inputs/PortableText/Styles.spec.tsx ✅ Passed (Inspect) 19s 6 0 0
formBuilder/inputs/PortableText/Toolbar.spec.tsx ✅ Passed (Inspect) 38s 12 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

⚡️ Editor Performance Report

Updated Mon, 11 Nov 2024 10:43:09 GMT

Benchmark reference
latency of sanity@latest
experiment
latency of this branch
Δ (%)
latency difference
article (title) 13.9 efps (72ms) 14.4 efps (70ms) -3ms (-3.5%)
article (body) 48.1 efps (21ms) 50.6 efps (20ms) -1ms (-5.0%)
article (string inside object) 15.4 efps (65ms) 15.3 efps (66ms) +1ms (+0.8%)
article (string inside array) 13.0 efps (77ms) 13.5 efps (74ms) -3ms (-3.9%)
recipe (name) 27.4 efps (37ms) 27.8 efps (36ms) -1ms (-1.4%)
recipe (description) 30.3 efps (33ms) 30.3 efps (33ms) +0ms (-/-%)
recipe (instructions) 99.9+ efps (7ms) 99.9+ efps (7ms) +0ms (-/-%)
synthetic (title) 15.2 efps (66ms) 14.3 efps (70ms) +4ms (+6.1%)
synthetic (string inside object) 14.5 efps (69ms) 15.4 efps (65ms) -4ms (-5.8%)

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) 72ms 83ms 94ms 204ms 940ms 16.2s
article (body) 21ms 29ms 59ms 128ms 482ms 7.6s
article (string inside object) 65ms 70ms 81ms 352ms 720ms 9.7s
article (string inside array) 77ms 82ms 91ms 201ms 1189ms 10.3s
recipe (name) 37ms 38ms 61ms 99ms 26ms 10.4s
recipe (description) 33ms 35ms 58ms 97ms 9ms 6.3s
recipe (instructions) 7ms 9ms 10ms 17ms 1ms 3.4s
synthetic (title) 66ms 70ms 75ms 213ms 1337ms 15.4s
synthetic (string inside object) 69ms 73ms 84ms 455ms 1723ms 9.9s

🧪 Experiment result

The performance result of this branch

Benchmark latency p75 p90 p99 blocking time test duration
article (title) 70ms 76ms 114ms 293ms 829ms 16.3s
article (body) 20ms 27ms 84ms 154ms 241ms 7.0s
article (string inside object) 66ms 68ms 77ms 312ms 709ms 9.7s
article (string inside array) 74ms 79ms 91ms 365ms 1193ms 10.1s
recipe (name) 36ms 40ms 51ms 99ms 0ms 10.7s
recipe (description) 33ms 35ms 40ms 72ms 0ms 6.2s
recipe (instructions) 7ms 9ms 10ms 36ms 4ms 3.5s
synthetic (title) 70ms 78ms 86ms 425ms 1597ms 15.3s
synthetic (string inside object) 65ms 71ms 75ms 482ms 1630ms 10.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.

@robinpyon robinpyon marked this pull request as ready for review November 11, 2024 10:43
@robinpyon robinpyon requested a review from a team as a code owner November 11, 2024 10:43
@robinpyon robinpyon requested review from EoinFalconer and removed request for a team November 11, 2024 10:43
@RitaDias RitaDias self-requested a review November 11, 2024 11:05
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, thanks for this 🙏

@robinpyon robinpyon added this pull request to the merge queue Nov 11, 2024
Merged via the queue into next with commit 4807d52 Nov 11, 2024
61 checks passed
@robinpyon robinpyon deleted the fix/create-integration-updates branch November 11, 2024 11:45
bjoerge added a commit that referenced this pull request Nov 11, 2024
* next:
  fix: create integration copy + layout updates (#7787)
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.

2 participants