fix(env): is mobile flag (#8005)

only 'mobile' entry has isMobile = true flag

packages/frontend/component/src/ui/menu/index.ts

@@ -1,5 +1,4 @@
 export * from './menu.types';
-import { isMobile } from '../../utils/env';
 import { DesktopMenuItem } from './desktop/item';
 import { DesktopMenu } from './desktop/root';
 import { DesktopMenuSeparator } from './desktop/separator';
@@ -10,10 +9,12 @@ import { MobileMenu } from './mobile/root';
 import { MobileMenuSeparator } from './mobile/separator';
 import { MobileMenuSub } from './mobile/sub';
 
-const MenuItem = isMobile() ? MobileMenuItem : DesktopMenuItem;
-const MenuSeparator = isMobile() ? MobileMenuSeparator : DesktopMenuSeparator;
-const MenuSub = isMobile() ? MobileMenuSub : DesktopMenuSub;
-const Menu = isMobile() ? MobileMenu : DesktopMenu;
+const MenuItem = environment.isMobileEdition ? MobileMenuItem : DesktopMenuItem;
+const MenuSeparator = environment.isMobileEdition
+  ? MobileMenuSeparator
+  : DesktopMenuSeparator;
+const MenuSub = environment.isMobileEdition ? MobileMenuSub : DesktopMenuSub;
+const Menu = environment.isMobileEdition ? MobileMenu : DesktopMenu;
 
 export {
   DesktopMenu,

packages/frontend/component/src/ui/menu/use-menu-item.tsx

@@ -1,7 +1,6 @@
 import { DoneIcon } from '@blocksuite/icons/rc';
 import clsx from 'clsx';
 
-import { isMobile } from '../../utils/env';
 import type { MenuItemProps } from './menu.types';
 import { mobileMenuItem } from './mobile/styles.css';
 import * as styles from './styles.css';
@@ -27,7 +26,7 @@ export const useMenuItem = <T extends MenuItemProps>({
       checked,
       selected,
       block,
-      [mobileMenuItem]: isMobile(),
+      [mobileMenuItem]: environment.isMobileEdition,
     },
     propsClassName
   );

packages/frontend/component/src/ui/modal/modal.tsx

@@ -12,7 +12,6 @@ import clsx from 'clsx';
 import type { CSSProperties, MouseEvent } from 'react';
 import { forwardRef, useCallback, useEffect, useState } from 'react';
 
-import { isMobile } from '../../utils/env';
 import type { IconButtonProps } from '../button';
 import { IconButton } from '../button';
 import * as styles from './styles.css';
@@ -151,9 +150,7 @@ export const ModalInner = forwardRef<HTMLDivElement, ModalProps>(
       children,
       contentWrapperClassName,
       contentWrapperStyle,
-      animation = environment.isBrowser && environment.isMobile
-        ? 'slideBottom'
-        : 'fadeScaleTop',
+      animation = environment.isMobileEdition ? 'slideBottom' : 'fadeScaleTop',
       fullScreen,
       ...otherProps
     } = props;
@@ -225,7 +222,7 @@ export const ModalInner = forwardRef<HTMLDivElement, ModalProps>(
               `anim-${animation}`,
               styles.modalOverlay,
               overlayClassName,
-              { mobile: isMobile() }
+              { mobile: environment.isMobileEdition }
             )}
             style={{
               ...overlayStyle,