feat(core): adjust the layout, style, and structure of the AI chat input (#12828)

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

## Summary by CodeRabbit

- **New Features**
- Added support for image uploads in the chat panel, including upload
limits and user feedback when limits are exceeded.
- Introduced a unified chat input preference menu for selecting AI
models, toggling extended thinking, and enabling web search.
- Menu buttons and menus now support test identifiers for improved
testing.

- **Improvements**
- Updated chat input UI with enhanced styling, consolidated controls,
and simplified feature toggling.
  - Improved layout and spacing for chat chips and image preview grids.
  - Chat abort icon now adapts to the current color theme.

- **Refactor**
- Replaced the separate AI model selection component with the new chat
input preference menu.
- Streamlined imports and custom element registrations for chat input
preferences.

- **Tests**
- Enhanced test utilities to support the new chat input preference menu
interactions.

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

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

@@ -23,6 +23,7 @@ export type MenuOptions = {
     placeholder?: string;
   };
   items: MenuConfig[];
+  testId?: string;
 };
 
 // Global menu open listener type
@@ -72,6 +73,9 @@ export class Menu {
       ? document.createElement('mobile-menu')
       : document.createElement('affine-menu');
     this.menuElement.menu = this;
+    if (this.options.testId) {
+      this.menuElement.dataset.testid = this.options.testId;
+    }
 
     // Call global menu open listeners
     menuOpenListeners.forEach(listener => {