refactor: use explicit memo import (#1596)

Co-authored-by: Himself65 <himself65@outlook.com>

apps/web/src/components/pure/workspace-avatar/index.tsx

@@ -1,5 +1,6 @@
 import { UNTITLED_WORKSPACE_NAME } from '@affine/env';
-import React from 'react';
+import type React from 'react';
+import { memo } from 'react';
 
 import { useBlockSuiteWorkspaceAvatarUrl } from '../../../hooks/use-blocksuite-workspace-avatar-url';
 import type { BlockSuiteWorkspace, RemWorkspace } from '../../../shared';
@@ -12,8 +13,13 @@ interface AvatarProps {
   style?: React.CSSProperties;
 }
 
-export const Avatar: React.FC<AvatarProps> = React.memo<AvatarProps>(
+export const Avatar: React.FC<AvatarProps> = memo<AvatarProps>(function Avatar({
-  function Avatar({ size: _size, avatar_url, style, name, ...props }) {
+  size: _size,
+  avatar_url,
+  style,
+  name,
+  ...props
+}) {
   const size = _size || 20;
   const sizeStr = size + 'px';
 
@@ -65,8 +71,7 @@ export const Avatar: React.FC<AvatarProps> = React.memo<AvatarProps>(
       )}
     </>
   );
-  }
+});
-);
 
 export type WorkspaceUnitAvatarProps = {
   size?: number;

apps/web/src/providers/AffineSWRConfigProvider.tsx

@@ -1,4 +1,5 @@
-import React from 'react';
+import type React from 'react';
+import { memo } from 'react';
 import type { SWRConfiguration } from 'swr';
 import { SWRConfig } from 'swr';
 
@@ -9,7 +10,7 @@ const config: SWRConfiguration = {
   fetcher,
 };
 
-export const AffineSWRConfigProvider = React.memo<React.PropsWithChildren>(
+export const AffineSWRConfigProvider = memo<React.PropsWithChildren>(
   function AffineSWRConfigProvider({ children }) {
     return <SWRConfig value={config}>{children}</SWRConfig>;
   }

apps/web/src/providers/ThemeProvider.tsx

@@ -8,13 +8,14 @@ import {
 import { GlobalStyles } from '@mui/material';
 import { ThemeProvider as NextThemeProvider, useTheme } from 'next-themes';
 import type { PropsWithChildren } from 'react';
-import React, { memo, useEffect, useMemo, useState } from 'react';
+import type React from 'react';
+import { memo, useEffect, useMemo, useState } from 'react';
 
 import { useCurrentPage } from '../hooks/current/use-current-page-id';
 import { useCurrentWorkspace } from '../hooks/current/use-current-workspace';
 import { usePageMeta } from '../hooks/use-page-meta';
 
-const ThemeInjector = React.memo<{
+const ThemeInjector = memo<{
   themeStyle: AffineTheme;
 }>(function ThemeInjector({ themeStyle }) {
   return (