refactor(portable-text-editor): refactor mutation and patch handling

This will make the change events 'patch', 'throttle' and 'mutation' work more correctly together.
There could be rare situations where mutations would not be sent in how this was set up before.

packages/@sanity/portable-text-editor/src/editor/PortableTextEditor.tsx

@@ -248,19 +248,17 @@ export class PortableTextEditor extends React.Component<PortableTextEditorProps,
     const finalPatches = compactPatches(this.pendingPatches)
     if (finalPatches.length > 0) {
       onChange({type: 'mutation', patches: finalPatches})
+      this.pendingPatches = []
+      debug('Flushing', finalPatches)
     }
-    this.pendingPatches = []
   }
 
   private onEditorChange = (next: EditorChange): void => {
     const {onChange} = this.props
     switch (next.type) {
-      case 'mutation':
-        if (this.isThrottling) {
-          this.pendingPatches = [...this.pendingPatches, ...next.patches]
-        } else {
-          this.flush()
-        }
+      case 'patch':
+        this.pendingPatches.push(next.patch)
+        onChange(next)
         break
       case 'throttle':
         if (next.throttle !== this.isThrottling) {
@@ -270,9 +268,7 @@ export class PortableTextEditor extends React.Component<PortableTextEditorProps,
           this.isThrottling = true
         } else {
           this.isThrottling = false
-          if (this.pendingPatches.length > 0) {
-            this.flush()
-          }
+          this.flush()
         }
         break
       case 'selection':

packages/@sanity/portable-text-editor/src/editor/plugins/createWithPatches.ts

@@ -109,8 +109,8 @@ export function createWithPatches(
     PATCHING.set(editor, true)
     previousChildren = editor.children
 
-    // This will cancel the throttle when the user is not producing anything for a short time
-    const cancelThrottle = debounce(() => {
+    // This will cancel the throttle when the user is not producing any patches for a short time
+    const cancelThrottleDebounced = debounce(() => {
       change$.next({type: 'throttle', throttle: false})
     }, THROTTLE_EDITOR_MS)
 
@@ -198,20 +198,14 @@ export function createWithPatches(
       if (patches.length > 0) {
         // Signal throttling
         change$.next({type: 'throttle', throttle: true})
-        // Emit all patches immediately
+        // Emit all patches
         patches.forEach((patch) => {
           change$.next({
             type: 'patch',
             patch,
           })
         })
-
-        // Emit mutation after user is done typing (we show only local state as that happens)
-        change$.next({
-          type: 'mutation',
-          patches: patches,
-        })
-        cancelThrottle()
+        cancelThrottleDebounced()
       }
       return editor
     }