chore(core): update tooltip of mode switcher (#9711)

Close [BS-2325](https://linear.app/affine-design/issue/BS-2325/tooltips-显示)

https://github.com/user-attachments/assets/bd4c6045-8de1-4e72-87ab-2d1d3262e6b7

packages/frontend/core/src/components/blocksuite/block-suite-mode-switch/index.tsx

@@ -1,4 +1,4 @@
-import { RadioGroup, type RadioItem, Tooltip } from '@affine/component';
+import { RadioGroup, type RadioItem } from '@affine/component';
 import { registerAffineCommand } from '@affine/core/commands';
 import { EditorService } from '@affine/core/modules/editor';
 import { ViewService, WorkbenchService } from '@affine/core/modules/workbench';
@@ -92,21 +92,12 @@ export const EditorModeSwitch = () => {
   }, [currentMode, isActiveView, isSharedMode, onModeChange, t, trash]);
 
   return (
-    <Tooltip
-      content={t['Switch']()}
-      shortcut={['$alt', 'S']}
-      side="bottom"
-      options={{ hidden: trash || isSharedMode }}
-    >
-      <div>
-        <PureEditorModeSwitch
-          mode={currentMode}
-          setMode={onModeChange}
-          hidePage={shouldHide('page')}
-          hideEdgeless={shouldHide('edgeless')}
-        />
-      </div>
-    </Tooltip>
+    <PureEditorModeSwitch
+      mode={currentMode}
+      setMode={onModeChange}
+      hidePage={shouldHide('page')}
+      hideEdgeless={shouldHide('edgeless')}
+    />
   );
 };
 

packages/frontend/core/src/components/blocksuite/block-suite-mode-switch/switch-items.tsx

@@ -1,7 +1,9 @@
+import { Tooltip } from '@affine/component';
 import {
   type CustomLottieProps,
   InternalLottie,
 } from '@affine/component/internal-lottie';
+import { useI18n } from '@affine/i18n';
 import type { HTMLAttributes } from 'react';
 import type React from 'react';
 import { cloneElement, useState } from 'react';
@@ -58,19 +60,33 @@ const edgelessLottieOptions = {
 export const PageSwitchItem = (
   props: Omit<HoverAnimateControllerProps, 'children'>
 ) => {
+  const t = useI18n();
   return (
-    <HoverAnimateController {...props}>
-      <InternalLottie options={pageLottieOptions} />
-    </HoverAnimateController>
+    <Tooltip
+      content={t['com.affine.header.mode-switch.page']()}
+      shortcut={['$alt', 'S']}
+      side="bottom"
+    >
+      <HoverAnimateController {...props}>
+        <InternalLottie options={pageLottieOptions} />
+      </HoverAnimateController>
+    </Tooltip>
   );
 };
 
 export const EdgelessSwitchItem = (
   props: Omit<HoverAnimateControllerProps, 'children'>
 ) => {
+  const t = useI18n();
   return (
-    <HoverAnimateController {...props}>
-      <InternalLottie options={edgelessLottieOptions} />
-    </HoverAnimateController>
+    <Tooltip
+      content={t['com.affine.header.mode-switch.edgeless']()}
+      shortcut={['$alt', 'S']}
+      side="bottom"
+    >
+      <HoverAnimateController {...props}>
+        <InternalLottie options={edgelessLottieOptions} />
+      </HoverAnimateController>
+    </Tooltip>
   );
 };