sanity
sanity copied to clipboard
fix(core): portable text annotations slow to show
Description
Adding an annotation inside the PTE editor is perceived as slow, this is mainly because the annotation needs the annotation value to exist in the form value before being able to show the Popover for it. Also:
- The Add comment button reappears in place of the annotation after clicking "add annotation."
- The annotation edit/discard toolbar appears before the annotation popover renders.
- The annotation in PTE changes its style before the annotation popover renders.
- The popover takes about 1 second to render after clicking and doesn't focus.
Comments Input:
- Added a
blurred
state to track when the editor loses focus, preventing immediate comment input display upon regaining focus (CommentsPortableTextInput.tsx
).
Annotation:
- Introduced
isReady
state to ensure the annotation toolbar popover is only rendered when children are present , this means that the member exists. (Annotation.tsx
).
Focus in Popover Modal:
- Implemented an effect to automatically focus the first input element when the popover modal content is rendered (
PopoverModal.tsx
).
[!NOTE]
Upcoming changes: The portable text editor package will be update to not debounce theaddAnnotation
action
https://github.com/user-attachments/assets/7eadd32a-08a7-4306-8fb9-a5d5666a0c89
What to review
Are this changes correct? Is there any oversight to fix?
Testing
Visit a PTE field in the studio, add an annotation, the toolbar and comments button should not show. The first input should be focused once annotations render. https://test-next-studio-git-pte-annotations.sanity.dev/test/structure/input-standard;portable-text;pt_allTheBellsAndWhistles;834d6ed4-7cb1-47b9-a533-a734e0f78693
Notes for release
Update annotations creations in portable text, autofocus on the first input.