fix(core): should invoke cleanup fn when ai sub item list is removed (#10685)

Closes: [BS-2755](https://linear.app/affine-design/issue/BS-2755/ai-translate-死循环报错)

packages/frontend/core/src/blocksuite/ai/components/ai-item/ai-item-list.ts

@@ -92,7 +92,7 @@ export class AIItemList extends WithDisposable(LitElement) {
         .onClick=${this.onClick}
         .abortController=${this._abortController}
       ></ai-sub-item-list>`,
-      positionStrategy: 'fixed',
+      positionStrategy: 'absolute',
       computePosition: {
         referenceElement: aiItemContainer,
         placement: 'right-start',
@@ -104,6 +104,11 @@ export class AIItemList extends WithDisposable(LitElement) {
     });
   };
 
+  override disconnectedCallback() {
+    super.disconnectedCallback();
+    this._closeSubMenu();
+  }
+
   override render() {
     return html`${repeat(this.groups, group => {
       return html`
@@ -114,15 +119,14 @@ export class AIItemList extends WithDisposable(LitElement) {
           : nothing}
         ${repeat(
           group.items,
+          item => item.name,
           item =>
             html`<ai-item
               .onClick=${this.onClick}
               .item=${item}
               .host=${this.host}
               class=${this._itemClassName(item)}
-              @mouseover=${() => {
-                this._openSubMenu(item);
-              }}
+              @mouseenter=${() => this._openSubMenu(item)}
             ></ai-item>`
         )}
       `;

packages/frontend/core/src/blocksuite/ai/components/ai-item/ai-sub-item-list.ts

@@ -3,11 +3,12 @@ import {
   PropTypes,
   requiredProperties,
 } from '@blocksuite/affine/block-std';
-import { EnterIcon } from '@blocksuite/affine/blocks';
+import { EnterIcon, stopPropagation } from '@blocksuite/affine/blocks';
 import { WithDisposable } from '@blocksuite/affine/global/lit';
 import { baseTheme } from '@toeverything/theme';
 import { css, html, LitElement, nothing, unsafeCSS } from 'lit';
 import { property } from 'lit/decorators.js';
+import { repeat } from 'lit/directives/repeat.js';
 
 import { menuItemStyles } from './styles';
 import type { AIItemConfig, AISubItemConfig } from './types';
@@ -54,10 +55,18 @@ export class AISubItemList extends WithDisposable(LitElement) {
     this.abortController.abort();
   };
 
+  override connectedCallback() {
+    super.connectedCallback();
+
+    this.disposables.addFromEvent(this, 'pointerdown', stopPropagation);
+  }
+
   override render() {
     if (!this.item.subItem || this.item.subItem.length <= 0) return nothing;
     return html`<div class="ai-sub-menu">
-      ${this.item.subItem?.map(
+      ${repeat(
+        this.item.subItem,
+        subItem => subItem.type,
         subItem =>
           html`<div
             class="menu-item"