fix: unify sidebar switch (#2616)

packages/component/src/components/app-sidebar/sidebar-header/sidebar-switch.tsx

@@ -0,0 +1,31 @@
+import { IconButton, Tooltip } from '@affine/component';
+import { useAFFiNEI18N } from '@affine/i18n/hooks';
+import { SidebarIcon } from '@blocksuite/icons';
+import { useAtom } from 'jotai';
+
+import { sidebarButtonStyle } from '../index.css';
+import { appSidebarOpenAtom } from '../index.jotai';
+
+export const SidebarSwitch = () => {
+  const [open, setOpen] = useAtom(appSidebarOpenAtom);
+  const t = useAFFiNEI18N();
+  const tooltipContent = open ? t['Collapse sidebar']() : t['Expand sidebar']();
+  const collapseKeyboardShortcuts =
+    environment.isBrowser && environment.isMacOs ? ' ⌘+/' : ' Ctrl+/';
+
+  return (
+    <Tooltip
+      content={tooltipContent + ' ' + collapseKeyboardShortcuts}
+      placement="right"
+      zIndex={1000}
+    >
+      <IconButton
+        data-testid={`app-sidebar-arrow-button-${open ? 'collapse' : 'expand'}`}
+        className={sidebarButtonStyle}
+        onClick={() => setOpen(open => !open)}
+      >
+        <SidebarIcon width={24} height={24} />
+      </IconButton>
+    </Tooltip>
+  );
+};