refactor: batch api

libs/components/editor-blocks/src/blocks/text/TextView.tsx

@@ -83,8 +83,8 @@ export const TextView = ({
         return true;
     };
 
-    const onBackspace: TextProps['handleBackSpace'] = async props => {
+    const onBackspace: TextProps['handleBackSpace'] = editor.withBatch(
-        return await editor.withSuspend(async () => {
+        async props => {
             const { isCollAndStart } = props;
             if (!isCollAndStart) {
                 return false;
@@ -114,7 +114,6 @@ export const TextView = ({
                 // TODO: abstract this part of code
                 if (preNode) {
                     if (supportChildren(preNode)) {
-                        editor.suspend(true);
                         await editor.selectionManager.activePreviousNode(
                             block.id,
                             'end'
@@ -133,7 +132,6 @@ export const TextView = ({
                         }
                         await preNode.append(...children);
                         await block.remove();
-                        editor.suspend(false);
                     } else {
                         // TODO: point does not clear
                         await editor.selectionManager.activePreviousNode(
@@ -200,8 +198,9 @@ export const TextView = ({
                 );
             }
             return true;
-        });
+        }
-    };
+    );
+
     const handleConvert = async (
         toType: string,
         options?: Record<string, unknown>

libs/components/editor-core/src/editor/editor.ts

@@ -2,40 +2,40 @@
 import HotKeys from 'hotkeys-js';
 import LRUCache from 'lru-cache';
 
-import { services } from '@toeverything/datasource/db-service';
+import type { PatchNode } from '@toeverything/components/ui';
 import type {
     BlockFlavors,
     ReturnEditorBlock,
     UpdateEditorBlock,
 } from '@toeverything/datasource/db-service';
-import type { PatchNode } from '@toeverything/components/ui';
+import { services } from '@toeverything/datasource/db-service';
 
-import { AsyncBlock } from './block';
-import type { WorkspaceAndBlockId } from './block';
-import type { BaseView } from './views/base-view';
-import { SelectionManager } from './selection';
-import { Hooks, PluginManager } from './plugin';
-import { EditorCommands } from './commands';
-import {
-    Virgo,
-    HooksRunner,
-    PluginHooks,
-    PluginCreator,
-    StorageManager,
-    VirgoSelection,
-    PluginManagerInterface,
-} from './types';
-import { KeyboardManager } from './keyboard';
-import { MouseManager } from './mouse';
-import { ScrollManager } from './scroll';
-import assert from 'assert';
-import { domToRect, last, Point, sleep } from '@toeverything/utils';
 import { Commands } from '@toeverything/datasource/commands';
+import { domToRect, last, Point, sleep } from '@toeverything/utils';
+import assert from 'assert';
+import type { WorkspaceAndBlockId } from './block';
+import { AsyncBlock } from './block';
+import { BlockHelper } from './block/block-helper';
 import { BrowserClipboard } from './clipboard/browser-clipboard';
 import { ClipboardPopulator } from './clipboard/clipboard-populator';
-import { BlockHelper } from './block/block-helper';
+import { EditorCommands } from './commands';
-import { DragDropManager } from './drag-drop';
 import { EditorConfig } from './config';
+import { DragDropManager } from './drag-drop';
+import { KeyboardManager } from './keyboard';
+import { MouseManager } from './mouse';
+import { Hooks, PluginManager } from './plugin';
+import { ScrollManager } from './scroll';
+import { SelectionManager } from './selection';
+import {
+    HooksRunner,
+    PluginCreator,
+    PluginHooks,
+    PluginManagerInterface,
+    StorageManager,
+    Virgo,
+    VirgoSelection,
+} from './types';
+import type { BaseView } from './views/base-view';
 
 export interface EditorCtorProps {
     workspace: string;
@@ -148,18 +148,41 @@ export class Editor implements Virgo {
     public get container() {
         return this.ui_container;
     }
-    // preference to use withSuspend
+
+    /**
+     * Use it discreetly.
+     * Preference to use {@link withBatch}
+     */
     public suspend(flag: boolean) {
         services.api.editorBlock.suspend(this.workspace, flag);
     }
 
-    public async withSuspend<T extends (...args: any[]) => any>(
+    // TODO support suspend recursion
+    private _isSuspend = false;
+    public withBatch<T extends (...args: any[]) => Promise<any>>(fn: T): T {
+        return (async (...args) => {
+            if (this._isSuspend) {
+                console.warn(
+                    'The editor currently has suspend! Please do not call batch method repeatedly!'
+                );
+            }
+            this._isSuspend = true;
+            services.api.editorBlock.suspend(this.workspace, true);
+            const result = await fn(...args);
+            services.api.editorBlock.suspend(this.workspace, false);
+            this._isSuspend = false;
+            return result;
+        }) as T;
+    }
+
+    /**
+     * Use it discreetly.
+     * Preference to use {@link withBatch}
+     */
+    public async batch<T extends (...args: any[]) => any>(
         fn: T
     ): Promise<Awaited<ReturnType<T>>> {
-        services.api.editorBlock.suspend(this.workspace, true);
+        return this.withBatch(fn)();
-        const result = await fn();
-        services.api.editorBlock.suspend(this.workspace, false);
-        return result;
     }
 
     public setReactRenderRoot(props: {