Open JohnGemstone opened 3 weeks ago
When using useOptimistic to update draggable array components, items are no longer set as draggable in the overlay. This only occurs in a production build, in dev it works as expected.
useOptimistic
To Reproduce
Expected behavior Draggable items with client-side updates in production
Screen Recordings Dev server (with useOptimistic): ✅
https://github.com/user-attachments/assets/b2df820b-9bd1-4a4a-8f00-620dac0815b1
Prod server (with useOptimistic): ❌
https://github.com/user-attachments/assets/22899037-b14a-46ff-ac5f-1bb642e6bb4e
Prod server (without useOptimistic): ✅
https://github.com/user-attachments/assets/e092c065-8365-4690-a24a-562dbe1830d6
Note: ignore the repeated fading to black related to https://github.com/sanity-io/visual-editing/issues/2087
Which versions of Sanity are you using?
@sanity/cli (global) 3.62.3 (up to date) @sanity/assist 3.0.8 (up to date) @sanity/icons 3.4.0 (up to date) @sanity/image-url 1.1.0 (up to date) @sanity/mutate 0.10.1 (up to date) @sanity/presentation 1.17.7 (up to date) @sanity/preview-url-secret 2.0.0 (up to date) @sanity/util 3.62.3 (up to date) @sanity/vision 3.62.3 (up to date) @sanity/visual-editing 2.4.2 (up to date) sanity 3.62.3 (up to date)
What operating system are you using? OSX + Chrome
Which versions of Node.js / npm are you running? v22.0.0
Additional context
When testing I found that the useOptimistic hook is somehow messing with useOptimisticActorReady in production since optimisticActorReady gets set to false when it's used: https://github.com/sanity-io/visual-editing/blob/f1d04b396abbba1879c1f1f0b605269e94f4400f/packages/visual-editing/src/ui/Overlays.tsx#L329
useOptimisticActorReady
optimisticActorReady
When using
useOptimistic
to update draggable array components, items are no longer set as draggable in the overlay. This only occurs in a production build, in dev it works as expected.To Reproduce
useOptimistic
Expected behavior Draggable items with client-side updates in production
Screen Recordings Dev server (with useOptimistic): ✅
https://github.com/user-attachments/assets/b2df820b-9bd1-4a4a-8f00-620dac0815b1
Prod server (with useOptimistic): ❌
https://github.com/user-attachments/assets/22899037-b14a-46ff-ac5f-1bb642e6bb4e
Prod server (without useOptimistic): ✅
https://github.com/user-attachments/assets/e092c065-8365-4690-a24a-562dbe1830d6
Note: ignore the repeated fading to black related to https://github.com/sanity-io/visual-editing/issues/2087
Which versions of Sanity are you using?
What operating system are you using? OSX + Chrome
Which versions of Node.js / npm are you running? v22.0.0
Additional context
When testing I found that the useOptimistic hook is somehow messing with
useOptimisticActorReady
in production sinceoptimisticActorReady
gets set to false when it's used: https://github.com/sanity-io/visual-editing/blob/f1d04b396abbba1879c1f1f0b605269e94f4400f/packages/visual-editing/src/ui/Overlays.tsx#L329