feat: add shortcut of zooming to selection (#9447)

### Changed
- change edgeless shortcut `cmd + 0`, `cmd + 1` to `alt + 0`, `alt + 1`
- add new shortcut `alt + 2` to zoom to currently selected elements

blocksuite/tests-legacy/edgeless/shortcut.spec.ts

@@ -15,9 +15,11 @@ import {
   zoomInByKeyboard,
   zoomOutByKeyboard,
   zoomResetByKeyboard,
+  zoomToSelection,
 } from '../utils/actions/edgeless.js';
 import {
   clickView,
+  dragBetweenCoords,
   enterPlaygroundRoom,
   focusRichText,
   initEmptyEdgelessState,
@@ -236,6 +238,45 @@ test.describe('zooming', () => {
     zoom = await getZoomLevel(page);
     expect(zoom).toBe(150);
   });
+
+  test('zoom to selection', async ({ page }) => {
+    await enterPlaygroundRoom(page);
+    await initEmptyEdgelessState(page);
+    await switchEditorMode(page);
+    await zoomToSelection(page);
+
+    const start = { x: 0, y: 0 };
+    const end = { x: 900, y: 200 };
+    await addBasicRectShapeElement(page, start, end);
+    await page.keyboard.down('Space');
+    await dragBetweenCoords(
+      page,
+      {
+        x: 200,
+        y: 200,
+      },
+      {
+        x: 200 - 50,
+        y: 200 - 50,
+      }
+    );
+    await page.keyboard.up('Space');
+
+    await zoomFitByKeyboard(page);
+    const shapeContained = await page.evaluate(() => {
+      const edgelessBlock = document.querySelector('affine-edgeless-root');
+      if (!edgelessBlock) {
+        throw new Error('edgeless block not found');
+      }
+
+      const gfx = edgelessBlock.gfx;
+      const element = gfx.selection.selectedElements[0];
+
+      return gfx.viewport.viewportBounds.contains(element.elementBound);
+    });
+
+    expect(shapeContained).toBe(true);
+  });
 });
 
 test('cmd + A should select all elements by default', async ({ page }) => {

blocksuite/tests-legacy/utils/actions/edgeless.ts

@@ -928,7 +928,7 @@ export async function multiTouchUp(page: Page, points: Point[]) {
 }
 
 export async function zoomFitByKeyboard(page: Page) {
-  await page.keyboard.press(`${SHORT_KEY}+1`, { delay: 100 });
+  await page.keyboard.press(`Alt+1`, { delay: 100 });
   await waitNextFrame(page, 300);
 }
 
@@ -938,7 +938,13 @@ export async function zoomOutByKeyboard(page: Page) {
 }
 
 export async function zoomResetByKeyboard(page: Page) {
-  await page.keyboard.press(`${SHORT_KEY}+0`, { delay: 50 });
+  await page.keyboard.press(`Alt+0`, { delay: 50 });
+  // Wait for animation
+  await waitNextFrame(page, 300);
+}
+
+export async function zoomToSelection(page: Page) {
+  await page.keyboard.press(`Alt+2`, { delay: 50 });
   // Wait for animation
   await waitNextFrame(page, 300);
 }