fix(editor): memory leak caused by missing unsubscription from autoUpdate (#13205)

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Bug Fixes**
* Improved resource cleanup for floating UI elements and popups to
prevent potential memory leaks and ensure proper disposal when
components are removed or updated.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

blocksuite/affine/components/src/context-menu/sub-menu.ts

@@ -85,6 +85,8 @@ export class MenuSubMenu extends MenuFocusable {
         .catch(err => console.error(err));
     });
     this.menu.openSubMenu(menu);
+    // in case that the menu is not closed, but the component is removed,
+    this.disposables.add(unsub);
   }
 
   protected override render(): unknown {

blocksuite/affine/gfx/template/src/toolbar/template-tool-button.ts

@@ -116,6 +116,7 @@ export class EdgelessTemplateButton extends EdgelessToolbarToolMixin(
   `;
 
   private _cleanup: (() => void) | null = null;
+  private _autoUpdateCleanup: (() => void) | null = null;
 
   private _prevTool: ToolOptionWithType | null = null;
 
@@ -128,6 +129,11 @@ export class EdgelessTemplateButton extends EdgelessToolbarToolMixin(
     return [TemplateCard1[theme], TemplateCard2[theme], TemplateCard3[theme]];
   }
 
+  override connectedCallback() {
+    super.connectedCallback();
+    this.disposables.add(() => this._autoUpdateCleanup?.());
+  }
+
   private _closePanel() {
     if (this._openedPanel) {
       this._openedPanel.remove();
@@ -175,8 +181,8 @@ export class EdgelessTemplateButton extends EdgelessToolbarToolMixin(
 
     requestAnimationFrame(() => {
       const arrowEl = panel.renderRoot.querySelector('.arrow') as HTMLElement;
-
-      autoUpdate(this, panel, () => {
+      this._autoUpdateCleanup?.();
+      this._autoUpdateCleanup = autoUpdate(this, panel, () => {
         computePosition(this, panel, {
           placement: 'top',
           middleware: [offset(20), arrow({ element: arrowEl }), shift()],