style: restrict type import (#1589)

.eslintrc.js

@@ -37,6 +37,7 @@ module.exports = {
     'no-func-assign': 'off',
     'no-cond-assign': 'off',
     'react/prop-types': 'off',
+    '@typescript-eslint/consistent-type-imports': 'error',
     '@typescript-eslint/no-non-null-assertion': 'off',
     '@typescript-eslint/no-explicit-any': 'off',
     '@typescript-eslint/no-empty-function': 'off',

apps/web/src/atoms/index.ts

@@ -1,11 +1,11 @@
-import { EditorContainer } from '@blocksuite/editor';
+import type { EditorContainer } from '@blocksuite/editor';
 import { assertExists } from '@blocksuite/store';
 import { atom, createStore } from 'jotai';
 import { atomWithStorage } from 'jotai/utils';
 import { unstable_batchedUpdates } from 'react-dom';
 
 import { WorkspacePlugins } from '../plugins';
-import { RemWorkspace, RemWorkspaceFlavour } from '../shared';
+import type { RemWorkspace, RemWorkspaceFlavour } from '../shared';
 // workspace necessary atoms
 export const currentWorkspaceIdAtom = atom<string | null>(null);
 export const currentPageIdAtom = atom<string | null>(null);

apps/web/src/blocksuite/index.ts

@@ -1,6 +1,6 @@
 import { config } from '@affine/env';
 
-import { BlockSuiteWorkspace, Provider } from '../shared';
+import type { BlockSuiteWorkspace, Provider } from '../shared';
 import {
   createAffineWebSocketProvider,
   createBroadCastChannelProvider,

apps/web/src/blocksuite/providers/affine/index.ts

@@ -1,6 +1,7 @@
 import { assertExists } from '@blocksuite/store';
 
-import { AffineDownloadProvider, BlockSuiteWorkspace } from '../../../shared';
+import type { AffineDownloadProvider } from '../../../shared';
+import { BlockSuiteWorkspace } from '../../../shared';
 import { apis } from '../../../shared/apis';
 import { providerLogger } from '../../logger';
 

apps/web/src/blocksuite/providers/broad-cast-channel/index.ts

@@ -1,18 +1,19 @@
 import { assertExists } from '@blocksuite/store';
+import type { Awareness } from 'y-protocols/awareness';
 import {
   applyAwarenessUpdate,
-  Awareness,
   encodeAwarenessUpdate,
 } from 'y-protocols/awareness';
 
-import { BlockSuiteWorkspace, BroadCastChannelProvider } from '../../../shared';
+import type { BroadCastChannelProvider } from '../../../shared';
+import { BlockSuiteWorkspace } from '../../../shared';
 import { providerLogger } from '../../logger';
-import {
+import type {
   AwarenessChanges,
   BroadcastChannelMessageEvent,
-  getClients,
   TypedBroadcastChannel,
 } from './type';
+import { getClients } from './type';
 
 export const createBroadCastChannelProvider = (
   blockSuiteWorkspace: BlockSuiteWorkspace

apps/web/src/blocksuite/providers/broad-cast-channel/type.ts

@@ -1,4 +1,4 @@
-import { Awareness as YAwareness } from 'y-protocols/awareness';
+import type { Awareness as YAwareness } from 'y-protocols/awareness';
 
 export type ClientId = YAwareness['clientID'];
 // eslint-disable-next-line @typescript-eslint/ban-types

apps/web/src/blocksuite/providers/index.ts

@@ -2,7 +2,7 @@ import { WebsocketProvider } from '@affine/datacenter';
 import { assertExists } from '@blocksuite/store';
 import { IndexeddbPersistence } from 'y-indexeddb';
 
-import {
+import type {
   AffineWebSocketProvider,
   BlockSuiteWorkspace,
   LocalIndexedDBProvider,

apps/web/src/components/__debug__/client/Editor.tsx

@@ -1,7 +1,9 @@
 'use client';
-import { EditorContainer } from '@blocksuite/editor';
+import type { EditorContainer } from '@blocksuite/editor';
-import { assertEquals, assertExists, Generator, Page } from '@blocksuite/store';
+import type { Page } from '@blocksuite/store';
-import React, { useCallback, useEffect, useRef, useState } from 'react';
+import { assertEquals, assertExists, Generator } from '@blocksuite/store';
+import type React from 'react';
+import { useCallback, useEffect, useRef, useState } from 'react';
 
 import { createEmptyBlockSuiteWorkspace } from '../../../utils';
 import { BlockSuiteEditor } from '../../blocksuite/block-suite-editor';

apps/web/src/components/__tests__/ProviderComposer.spec.tsx

@@ -2,7 +2,8 @@
  * @vitest-environment happy-dom
  */
 import { render } from '@testing-library/react';
-import React, { createContext, useContext } from 'react';
+import type React from 'react';
+import { createContext, useContext } from 'react';
 import { expect, test } from 'vitest';
 
 import { ProviderComposer } from '../provider-composer';

apps/web/src/components/__tests__/WorkSpaceSliderBar.spec.tsx

@@ -7,7 +7,8 @@ import { assertExists } from '@blocksuite/store';
 import { render, renderHook } from '@testing-library/react';
 import { createStore, getDefaultStore, Provider } from 'jotai';
 import { useRouter } from 'next/router';
-import React, { useCallback } from 'react';
+import type React from 'react';
+import { useCallback } from 'react';
 import { beforeEach, describe, expect, test, vi } from 'vitest';
 
 import { workspacesAtom } from '../../atoms';

apps/web/src/components/affine/affine-error-eoundary.tsx

@@ -1,8 +1,10 @@
 import { RequestError } from '@affine/datacenter';
-import { NextRouter } from 'next/router';
+import type { NextRouter } from 'next/router';
-import React, { Component, ErrorInfo } from 'react';
+import type { ErrorInfo } from 'react';
+import type React from 'react';
+import { Component } from 'react';
 
-import { BlockSuiteWorkspace } from '../../shared';
+import type { BlockSuiteWorkspace } from '../../shared';
 
 export type AffineErrorBoundaryProps = React.PropsWithChildren<{
   router: NextRouter;

apps/web/src/components/affine/enable-affine-cloud-modal/index.tsx

@@ -1,7 +1,7 @@
 import { IconButton, Modal, ModalWrapper } from '@affine/component';
 import { useTranslation } from '@affine/i18n';
 import { CloseIcon } from '@blocksuite/icons';
-import React from 'react';
+import type React from 'react';
 
 import { useCurrentUser } from '../../../hooks/current/use-current-user';
 import { Content, ContentTitle, Header, StyleButton, StyleTips } from './style';

apps/web/src/components/affine/transform-workspace-to-affine-modal/index.tsx

@@ -1,7 +1,7 @@
 import { IconButton, Modal, ModalWrapper } from '@affine/component';
 import { useTranslation } from '@affine/i18n';
 import { CloseIcon } from '@blocksuite/icons';
-import React from 'react';
+import type React from 'react';
 
 import { useCurrentUser } from '../../../hooks/current/use-current-user';
 import { Content, ContentTitle, Header, StyleButton, StyleTips } from './style';

apps/web/src/components/affine/workspace-setting-detail/index.tsx

@@ -1,23 +1,17 @@
 import { useTranslation } from '@affine/i18n';
-import React, {
+import type { MouseEvent } from 'react';
-  MouseEvent,
+import type React from 'react';
-  Suspense,
+import { Suspense, useCallback, useEffect, useMemo, useRef } from 'react';
-  useCallback,
-  useEffect,
-  useMemo,
-  useRef,
-} from 'react';
 import { preload } from 'swr';
 
 import { useIsWorkspaceOwner } from '../../../hooks/affine/use-is-workspace-owner';
 import { fetcher, QueryKey } from '../../../plugins/affine/fetcher';
-import {
+import type {
   AffineOfficialWorkspace,
   FlavourToWorkspace,
-  RemWorkspaceFlavour,
   SettingPanel,
-  settingPanel,
 } from '../../../shared';
+import { RemWorkspaceFlavour, settingPanel } from '../../../shared';
 import { CollaborationPanel } from './panel/collaboration';
 import { ExportPanel } from './panel/export';
 import { GeneralPanel } from './panel/general';

apps/web/src/components/affine/workspace-setting-detail/panel/collaboration/index.tsx

@@ -13,17 +13,15 @@ import {
   EmailIcon,
   MoreVerticalIcon,
 } from '@blocksuite/icons';
-import React, { useCallback, useState } from 'react';
+import type React from 'react';
+import { useCallback, useState } from 'react';
 
 import { useMembers } from '../../../../../hooks/affine/use-members';
-import {
+import type { AffineWorkspace, LocalWorkspace } from '../../../../../shared';
-  AffineWorkspace,
+import { RemWorkspaceFlavour } from '../../../../../shared';
-  LocalWorkspace,
-  RemWorkspaceFlavour,
-} from '../../../../../shared';
 import { Unreachable } from '../../../affine-error-eoundary';
 import { TransformWorkspaceToAffineModal } from '../../../transform-workspace-to-affine-modal';
-import { PanelProps } from '../../index';
+import type { PanelProps } from '../../index';
 import { InviteMemberModal } from './invite-member-modal';
 import {
   StyledMemberAvatar,

apps/web/src/components/affine/workspace-setting-detail/panel/collaboration/invite-member-modal/index.tsx

@@ -5,7 +5,8 @@ import { Input } from '@affine/component';
 import { MuiAvatar } from '@affine/component';
 import { useTranslation } from '@affine/i18n';
 import { EmailIcon } from '@blocksuite/icons';
-import React, { Suspense, useCallback, useState } from 'react';
+import type React from 'react';
+import { Suspense, useCallback, useState } from 'react';
 
 import { useMembers } from '../../../../../../hooks/affine/use-members';
 import { useUsersByEmail } from '../../../../../../hooks/affine/use-users-by-email';

apps/web/src/components/affine/workspace-setting-detail/panel/general/delete/index.tsx

@@ -3,10 +3,8 @@ import { Trans, useTranslation } from '@affine/i18n';
 import { useCallback, useState } from 'react';
 
 import { useBlockSuiteWorkspaceName } from '../../../../../../hooks/use-blocksuite-workspace-name';
-import {
+import type { AffineOfficialWorkspace } from '../../../../../../shared';
-  AffineOfficialWorkspace,
+import { RemWorkspaceFlavour } from '../../../../../../shared';
-  RemWorkspaceFlavour,
-} from '../../../../../../shared';
 import {
   StyledButtonContent,
   StyledInputContent,

apps/web/src/components/affine/workspace-setting-detail/panel/general/index.tsx

@@ -1,6 +1,7 @@
 import { Button, FlexWrapper, MuiFade } from '@affine/component';
 import { useTranslation } from '@affine/i18n';
-import React, { useState } from 'react';
+import type React from 'react';
+import { useState } from 'react';
 
 import { useIsWorkspaceOwner } from '../../../../../hooks/affine/use-is-workspace-owner';
 import { useBlockSuiteWorkspaceAvatarUrl } from '../../../../../hooks/use-blocksuite-workspace-avatar-url';
@@ -13,7 +14,7 @@ import {
   LocalWorkspaceIcon,
 } from '../../../../pure/icons';
 import { WorkspaceAvatar } from '../../../../pure/workspace-avatar';
-import { PanelProps } from '../../index';
+import type { PanelProps } from '../../index';
 import { StyledRow, StyledSettingKey } from '../../style';
 import { WorkspaceDeleteModal } from './delete';
 import { CameraIcon } from './icons';

apps/web/src/components/affine/workspace-setting-detail/panel/publish/index.tsx

@@ -8,18 +8,19 @@ import {
 } from '@affine/component';
 import { useTranslation } from '@affine/i18n';
 import { Box } from '@mui/material';
-import React, { useCallback, useEffect, useState } from 'react';
+import type React from 'react';
+import { useCallback, useEffect, useState } from 'react';
 
 import { useToggleWorkspacePublish } from '../../../../../hooks/affine/use-toggle-workspace-publish';
-import {
+import type {
   AffineOfficialWorkspace,
   AffineWorkspace,
   LocalWorkspace,
-  RemWorkspaceFlavour,
 } from '../../../../../shared';
+import { RemWorkspaceFlavour } from '../../../../../shared';
 import { Unreachable } from '../../../affine-error-eoundary';
 import { EnableAffineCloudModal } from '../../../enable-affine-cloud-modal';
-import { WorkspaceSettingDetailProps } from '../../index';
+import type { WorkspaceSettingDetailProps } from '../../index';
 
 export type PublishPanelProps = WorkspaceSettingDetailProps & {
   workspace: AffineOfficialWorkspace;

apps/web/src/components/affine/workspace-setting-detail/panel/sync/index.tsx

@@ -1,13 +1,13 @@
 import { Content, FlexWrapper, styled } from '@affine/component';
 import { Trans, useTranslation } from '@affine/i18n';
-import React from 'react';
+import type React from 'react';
 
 import { useCurrentUser } from '../../../../../hooks/current/use-current-user';
 import { useBlockSuiteWorkspaceAvatarUrl } from '../../../../../hooks/use-blocksuite-workspace-avatar-url';
 import { useBlockSuiteWorkspaceName } from '../../../../../hooks/use-blocksuite-workspace-name';
 import { RemWorkspaceFlavour } from '../../../../../shared';
 import { WorkspaceAvatar } from '../../../../pure/footer';
-import { PanelProps } from '../../index';
+import type { PanelProps } from '../../index';
 
 export const StyledWorkspaceName = styled('span')(({ theme }) => {
   return {

apps/web/src/components/blocksuite/block-suite-page-list/index.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
+import type React from 'react';
 
-import { BlockSuiteWorkspace } from '../../../shared';
+import type { BlockSuiteWorkspace } from '../../../shared';
 import PageList from './page-list';
 
 export type BlockSuitePageListProps = {

apps/web/src/components/blocksuite/block-suite-page-list/page-list/DateCell.tsx

@@ -1,5 +1,6 @@
-import { TableCell, TableCellProps } from '@affine/component';
+import type { TableCellProps } from '@affine/component';
-import { PageMeta } from '@blocksuite/store';
+import { TableCell } from '@affine/component';
+import type { PageMeta } from '@blocksuite/store';
 import dayjs from 'dayjs';
 import localizedFormat from 'dayjs/plugin/localizedFormat';
 import React from 'react';

apps/web/src/components/blocksuite/block-suite-page-list/page-list/OperationCell.tsx

@@ -17,8 +17,9 @@ import {
   OpenInNewIcon,
   ResetIcon,
 } from '@blocksuite/icons';
-import { PageMeta } from '@blocksuite/store';
+import type { PageMeta } from '@blocksuite/store';
-import React, { useState } from 'react';
+import type React from 'react';
+import { useState } from 'react';
 
 export type OperationCellProps = {
   pageMeta: PageMeta;

apps/web/src/components/blocksuite/block-suite-page-list/page-list/index.tsx

@@ -13,19 +13,20 @@ import {
   FavoriteIcon,
   PageIcon,
 } from '@blocksuite/icons';
-import { PageMeta } from '@blocksuite/store';
+import type { PageMeta } from '@blocksuite/store';
 import {
   useMediaQuery,
   useTheme as useMuiTheme,
   useTheme,
 } from '@mui/material';
-import React, { useMemo } from 'react';
+import type React from 'react';
+import { useMemo } from 'react';
 
 import {
   usePageMeta,
   usePageMetaHelper,
 } from '../../../../hooks/use-page-meta';
-import { BlockSuiteWorkspace } from '../../../../shared';
+import type { BlockSuiteWorkspace } from '../../../../shared';
 import DateCell from './DateCell';
 import Empty from './Empty';
 import { OperationCell, TrashOperationCell } from './OperationCell';

apps/web/src/components/blocksuite/header/editor-mode-switch/CustomLottie.tsx

@@ -1,5 +1,6 @@
 import lottie from 'lottie-web';
-import { FC, useEffect, useRef } from 'react';
+import type { FC } from 'react';
+import { useEffect, useRef } from 'react';
 
 type CustomLottieProps = {
   options: {

apps/web/src/components/blocksuite/header/editor-mode-switch/index.tsx

@@ -1,12 +1,12 @@
 import { toast } from '@affine/component';
 import { assertExists } from '@blocksuite/store';
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 
 import {
   usePageMeta,
   usePageMetaHelper,
 } from '../../../../hooks/use-page-meta';
-import { BlockSuiteWorkspace } from '../../../../shared';
+import type { BlockSuiteWorkspace } from '../../../../shared';
 import { StyledEditorModeSwitch } from './style';
 import { EdgelessSwitchItem, PageSwitchItem } from './switch-items';
 

apps/web/src/components/blocksuite/header/editor-mode-switch/switch-items.tsx

@@ -1,4 +1,6 @@
-import React, { cloneElement, HTMLAttributes, useState } from 'react';
+import type { HTMLAttributes } from 'react';
+import type React from 'react';
+import { cloneElement, useState } from 'react';
 
 import Lottie from './CustomLottie';
 import { StyledSwitchItem } from './style';

apps/web/src/components/blocksuite/header/header-right-items/SyncUser.tsx

@@ -11,11 +11,11 @@ import React, { useEffect, useState } from 'react';
 
 import { useCurrentWorkspace } from '../../../../hooks/current/use-current-workspace';
 import { useTransformWorkspace } from '../../../../hooks/use-transform-workspace';
-import {
+import type {
   AffineOfficialWorkspace,
   LocalWorkspace,
-  RemWorkspaceFlavour,
 } from '../../../../shared';
+import { RemWorkspaceFlavour } from '../../../../shared';
 import { apis } from '../../../../shared/apis';
 import { TransformWorkspaceToAffineModal } from '../../../affine/transform-workspace-to-affine-modal';
 

apps/web/src/components/blocksuite/header/header.tsx

@@ -1,13 +1,8 @@
 import { useTranslation } from '@affine/i18n';
 import { CloseIcon } from '@blocksuite/icons';
-import React, {
+import type { HTMLAttributes, PropsWithChildren } from 'react';
-  forwardRef,
+import type React from 'react';
-  HTMLAttributes,
+import { forwardRef, useEffect, useMemo, useState } from 'react';
-  PropsWithChildren,
-  useEffect,
-  useMemo,
-  useState,
-} from 'react';
 
 import { useSidebarStatus } from '../../../hooks/affine/use-sidebar-status';
 import { SidebarSwitch } from '../../affine/sidebar-switch';

apps/web/src/components/blocksuite/header/index.tsx

@@ -1,15 +1,17 @@
-import { PopperProps, QuickSearchTips } from '@affine/component';
+import type { PopperProps } from '@affine/component';
+import { QuickSearchTips } from '@affine/component';
 import { getEnvironment } from '@affine/env';
 import { ArrowDownSmallIcon } from '@blocksuite/icons';
 import { assertExists } from '@blocksuite/store';
 import { useAtomValue, useSetAtom } from 'jotai';
-import { forwardRef, HTMLAttributes, useCallback, useRef } from 'react';
+import type { HTMLAttributes } from 'react';
+import { forwardRef, useCallback, useRef } from 'react';
 
 import { currentEditorAtom, openQuickSearchModalAtom } from '../../../atoms';
 import { useOpenTips } from '../../../hooks/affine/use-is-first-load';
 import { usePageMeta } from '../../../hooks/use-page-meta';
 import { useElementResizeEffect } from '../../../hooks/use-workspaces';
-import { BlockSuiteWorkspace } from '../../../shared';
+import type { BlockSuiteWorkspace } from '../../../shared';
 import { PageNotFoundError } from '../../affine/affine-error-eoundary';
 import { QuickSearchButton } from '../../pure/quick-search-button';
 import { EditorModeSwitch } from './editor-mode-switch';

apps/web/src/components/blocksuite/header/utils.tsx

@@ -1,6 +1,7 @@
 import { getEnvironment } from '@affine/env';
 import { Trans, useTranslation } from '@affine/i18n';
-import React, { useEffect, useState } from 'react';
+import type React from 'react';
+import { useEffect, useState } from 'react';
 
 const minimumChromeVersion = 102;
 

apps/web/src/components/page-detail-editor.tsx

@@ -1,14 +1,16 @@
 import type { EditorContainer } from '@blocksuite/editor';
-import { assertExists, Page } from '@blocksuite/store';
+import type { Page } from '@blocksuite/store';
+import { assertExists } from '@blocksuite/store';
 import { useSetAtom } from 'jotai';
 import dynamic from 'next/dynamic';
 import Head from 'next/head';
-import React, { useCallback } from 'react';
+import type React from 'react';
+import { useCallback } from 'react';
 
 import { currentEditorAtom } from '../atoms';
 import { useBlockSuiteWorkspacePageTitle } from '../hooks/use-blocksuite-workspace-page-title';
 import { usePageMeta } from '../hooks/use-page-meta';
-import { BlockSuiteWorkspace } from '../shared';
+import type { BlockSuiteWorkspace } from '../shared';
 import { PageNotFoundError } from './affine/affine-error-eoundary';
 import { BlockSuiteEditorHeader } from './blocksuite/header';
 

apps/web/src/components/provider-composer.tsx

@@ -1,4 +1,5 @@
-import { cloneElement, FC, PropsWithChildren, ReactNode } from 'react';
+import type { FC, PropsWithChildren, ReactNode } from 'react';
+import { cloneElement } from 'react';
 
 export const ProviderComposer: FC<
   PropsWithChildren<{

apps/web/src/components/pure/create-workspace-modal/index.tsx

@@ -3,8 +3,8 @@ import { Modal, ModalCloseButton, ModalWrapper } from '@affine/component';
 import { Button } from '@affine/component';
 import { Input } from '@affine/component';
 import { useTranslation } from '@affine/i18n';
+import type { KeyboardEvent } from 'react';
 import { useCallback, useRef, useState } from 'react';
-import { KeyboardEvent } from 'react';
 
 interface ModalProps {
   open: boolean;

apps/web/src/components/pure/file-upload/index.tsx

@@ -1,7 +1,9 @@
 import { Button } from '@affine/component';
 import { styled } from '@affine/component';
 import { useTranslation } from '@affine/i18n';
-import React, { ChangeEvent, useRef } from 'react';
+import type { ChangeEvent } from 'react';
+import type React from 'react';
+import { useRef } from 'react';
 
 export type UploadProps = React.PropsWithChildren<{
   uploadType?: string;

apps/web/src/components/pure/footer/index.tsx

@@ -1,10 +1,11 @@
 import { FlexWrapper } from '@affine/component';
 import { IconButton } from '@affine/component';
 import { Tooltip } from '@affine/component';
-import { AccessTokenMessage } from '@affine/datacenter';
+import type { AccessTokenMessage } from '@affine/datacenter';
 import { useTranslation } from '@affine/i18n';
 import { CloudWorkspaceIcon, SignOutIcon } from '@blocksuite/icons';
-import React, { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
+import type React from 'react';
 
 import { stringToColour } from '../../../utils';
 import { StyledFooter, StyledSignInButton, StyleUserInfo } from './styles';

apps/web/src/components/pure/message-center/index.tsx

@@ -1,7 +1,8 @@
 import { toast } from '@affine/component';
-import { MessageCode } from '@affine/datacenter';
+import type { MessageCode } from '@affine/datacenter';
 import { messages } from '@affine/datacenter';
-import React, { useEffect } from 'react';
+import type React from 'react';
+import { useEffect } from 'react';
 
 declare global {
   interface DocumentEventMap {

apps/web/src/components/pure/quick-search-button/index.tsx

@@ -1,4 +1,5 @@
-import { IconButton, IconButtonProps } from '@affine/component';
+import type { IconButtonProps } from '@affine/component';
+import { IconButton } from '@affine/component';
 import { styled } from '@affine/component';
 import { ArrowDownSmallIcon } from '@blocksuite/icons';
 

apps/web/src/components/pure/quick-search-modal/Footer.tsx

@@ -3,12 +3,12 @@ import type { PageBlockModel } from '@blocksuite/blocks';
 import { PlusIcon } from '@blocksuite/icons';
 import { assertEquals, nanoid } from '@blocksuite/store';
 import { Command } from 'cmdk';
-import { NextRouter } from 'next/router';
+import type { NextRouter } from 'next/router';
-import React from 'react';
+import type React from 'react';
 
 import { useBlockSuiteWorkspaceHelper } from '../../../hooks/use-blocksuite-workspace-helper';
 import { useRouterHelper } from '../../../hooks/use-router-helper';
-import { BlockSuiteWorkspace } from '../../../shared';
+import type { BlockSuiteWorkspace } from '../../../shared';
 import { StyledModalFooterContent } from './style';
 
 export type FooterProps = {

apps/web/src/components/pure/quick-search-modal/PublishedResults.tsx

@@ -2,10 +2,11 @@ import { useTranslation } from '@affine/i18n';
 import { EdgelessIcon, PageIcon } from '@blocksuite/icons';
 import { Command } from 'cmdk';
 import { useRouter } from 'next/router';
-import React, { useEffect, useMemo, useState } from 'react';
+import type React from 'react';
+import { useEffect, useMemo, useState } from 'react';
 
 import { usePageMeta } from '../../../hooks/use-page-meta';
-import { BlockSuiteWorkspace } from '../../../shared';
+import type { BlockSuiteWorkspace } from '../../../shared';
 import { NoResultSVG } from './NoResultSVG';
 import { StyledListItem, StyledNotFound } from './style';
 

apps/web/src/components/pure/quick-search-modal/Results.tsx

@@ -3,14 +3,16 @@ import { useTranslation } from '@affine/i18n';
 import { EdgelessIcon, PageIcon } from '@blocksuite/icons';
 import { assertExists } from '@blocksuite/store';
 import { Command } from 'cmdk';
-import { NextRouter } from 'next/router';
+import type { NextRouter } from 'next/router';
-import React, { Dispatch, SetStateAction, useEffect } from 'react';
+import type { Dispatch, SetStateAction } from 'react';
+import type React from 'react';
+import { useEffect } from 'react';
 
 import { useRecentlyViewed } from '../../../hooks/affine/use-recent-views';
 import { useBlockSuiteWorkspaceHelper } from '../../../hooks/use-blocksuite-workspace-helper';
 import { usePageMeta } from '../../../hooks/use-page-meta';
 import { useRouterHelper } from '../../../hooks/use-router-helper';
-import { BlockSuiteWorkspace } from '../../../shared';
+import type { BlockSuiteWorkspace } from '../../../shared';
 import { useSwitchToConfig } from './config';
 import { NoResultSVG } from './NoResultSVG';
 import { StyledListItem, StyledNotFound } from './style';

apps/web/src/components/pure/quick-search-modal/config.ts

@@ -5,7 +5,8 @@ import {
   FolderIcon,
   SettingsIcon,
 } from '@blocksuite/icons';
-import { FC, SVGProps, useMemo } from 'react';
+import type { FC, SVGProps } from 'react';
+import { useMemo } from 'react';
 
 import { pathGenerator } from '../../../shared';
 export const useSwitchToConfig = (

apps/web/src/components/pure/quick-search-modal/index.tsx

@@ -2,8 +2,9 @@ import { Modal, ModalWrapper } from '@affine/component';
 import { getEnvironment } from '@affine/env';
 import { useTranslation } from '@affine/i18n';
 import { Command } from 'cmdk';
-import { NextRouter } from 'next/router';
+import type { NextRouter } from 'next/router';
-import React, {
+import type React from 'react';
+import {
   useCallback,
   useEffect,
   useMemo,
@@ -12,7 +13,7 @@ import React, {
   useTransition,
 } from 'react';
 
-import { BlockSuiteWorkspace } from '../../../shared';
+import type { BlockSuiteWorkspace } from '../../../shared';
 import { Footer } from './Footer';
 import { PublishedResults } from './PublishedResults';
 import { Results } from './Results';

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

@@ -2,7 +2,7 @@ import { UNTITLED_WORKSPACE_NAME } from '@affine/env';
 import React from 'react';
 
 import { useBlockSuiteWorkspaceAvatarUrl } from '../../../hooks/use-blocksuite-workspace-avatar-url';
-import { BlockSuiteWorkspace, RemWorkspace } from '../../../shared';
+import type { BlockSuiteWorkspace, RemWorkspace } from '../../../shared';
 import { stringToColour } from '../../../utils';
 
 interface AvatarProps {

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

@@ -1,10 +1,12 @@
 import { PermissionType } from '@affine/datacenter';
 import { useTranslation } from '@affine/i18n';
 import { SettingsIcon } from '@blocksuite/icons';
-import React, { useCallback } from 'react';
+import type React from 'react';
+import { useCallback } from 'react';
 
 import { useBlockSuiteWorkspaceName } from '../../../hooks/use-blocksuite-workspace-name';
-import { RemWorkspace, RemWorkspaceFlavour } from '../../../shared';
+import type { RemWorkspace } from '../../../shared';
+import { RemWorkspaceFlavour } from '../../../shared';
 import {
   CloudWorkspaceIcon,
   JoinedWorkspaceIcon,

apps/web/src/components/pure/workspace-list-modal/index.tsx

@@ -4,11 +4,11 @@ import {
   ModalWrapper,
   Tooltip,
 } from '@affine/component';
-import { AccessTokenMessage } from '@affine/datacenter';
+import type { AccessTokenMessage } from '@affine/datacenter';
 import { useTranslation } from '@affine/i18n';
 import { HelpIcon, PlusIcon } from '@blocksuite/icons';
 
-import { RemWorkspace } from '../../../shared';
+import type { RemWorkspace } from '../../../shared';
 import { Footer } from '../footer';
 import { WorkspaceCard } from '../workspace-card';
 import { LanguageMenu } from './language-menu';

apps/web/src/components/pure/workspace-list-modal/language-menu.tsx

@@ -2,7 +2,8 @@ import { Button, Menu, MenuItem, styled } from '@affine/component';
 import { LOCALES } from '@affine/i18n';
 import { useTranslation } from '@affine/i18n';
 import { ArrowDownSmallIcon } from '@blocksuite/icons';
-import React, { useCallback } from 'react';
+import type React from 'react';
+import { useCallback } from 'react';
 
 const LanguageMenuContent: React.FC = () => {
   const { i18n } = useTranslation();

apps/web/src/components/pure/workspace-slider-bar/WorkspaceSelector/WorkspaceSelector.tsx

@@ -1,7 +1,7 @@
-import React from 'react';
+import type React from 'react';
 
 import { useBlockSuiteWorkspaceName } from '../../../../hooks/use-blocksuite-workspace-name';
-import { RemWorkspace } from '../../../../shared';
+import type { RemWorkspace } from '../../../../shared';
 import { WorkspaceAvatar } from '../../workspace-avatar';
 import { SelectorWrapper, WorkspaceName } from './styles';
 

apps/web/src/components/pure/workspace-slider-bar/index.tsx

@@ -10,14 +10,15 @@ import {
   SearchIcon,
   SettingsIcon,
 } from '@blocksuite/icons';
-import { PageMeta } from '@blocksuite/store';
+import type { PageMeta } from '@blocksuite/store';
 import Link from 'next/link';
 import { useRouter } from 'next/router';
-import React, { useCallback, useMemo, useState } from 'react';
+import type React from 'react';
+import { useCallback, useMemo, useState } from 'react';
 
 import { useSidebarStatus } from '../../../hooks/affine/use-sidebar-status';
 import { usePageMeta } from '../../../hooks/use-page-meta';
-import { RemWorkspace } from '../../../shared';
+import type { RemWorkspace } from '../../../shared';
 import { SidebarSwitch } from '../../affine/sidebar-switch';
 import {
   StyledLink,

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

@@ -1,5 +1,6 @@
 import { useSetAtom } from 'jotai';
-import React, { ReactNode } from 'react';
+import type { ReactNode } from 'react';
+import type React from 'react';
 
 import { openQuickSearchModalAtom } from '../../../atoms';
 import Header from '../../blocksuite/header/header';

apps/web/src/hooks/__tests__/index.spec.tsx

@@ -12,7 +12,7 @@ import { createStore, Provider } from 'jotai';
 import { useRouter } from 'next/router';
 import routerMock from 'next-router-mock';
 import { createDynamicRouteParser } from 'next-router-mock/dynamic-routes';
-import React from 'react';
+import type React from 'react';
 import { beforeAll, beforeEach, describe, expect, test, vi } from 'vitest';
 
 import {
@@ -21,11 +21,8 @@ import {
   workspacesAtom,
 } from '../../atoms';
 import { LocalPlugin } from '../../plugins/local';
-import {
+import type { LocalWorkspace } from '../../shared';
-  BlockSuiteWorkspace,
+import { BlockSuiteWorkspace, RemWorkspaceFlavour } from '../../shared';
-  LocalWorkspace,
-  RemWorkspaceFlavour,
-} from '../../shared';
 import { useIsFirstLoad, useOpenTips } from '../affine/use-is-first-load';
 import {
   useRecentlyViewed,

apps/web/src/hooks/__tests__/use-blocksuite-workspace-helper.spec.ts

@@ -4,7 +4,7 @@
 import 'fake-indexeddb/auto';
 
 import { __unstableSchemas, builtInSchemas } from '@blocksuite/blocks/models';
-import { Page } from '@blocksuite/store';
+import type { Page } from '@blocksuite/store';
 import { renderHook } from '@testing-library/react';
 import { beforeEach, describe, expect, test, vi } from 'vitest';
 

apps/web/src/hooks/affine/use-is-workspace-owner.ts

@@ -1,6 +1,6 @@
 import { PermissionType } from '@affine/datacenter';
 
-import { AffineOfficialWorkspace } from '../../shared';
+import type { AffineOfficialWorkspace } from '../../shared';
 
 export function useIsWorkspaceOwner(workspace: AffineOfficialWorkspace) {
   if (workspace.flavour === 'local') return true;

apps/web/src/hooks/affine/use-members.ts

@@ -1,4 +1,4 @@
-import { Member } from '@affine/datacenter';
+import type { Member } from '@affine/datacenter';
 import { useCallback } from 'react';
 import useSWR from 'swr';
 

apps/web/src/hooks/affine/use-recent-views.ts

@@ -1,5 +1,5 @@
 import { useAtomValue, useSetAtom } from 'jotai';
-import { NextRouter } from 'next/router';
+import type { NextRouter } from 'next/router';
 import { useEffect } from 'react';
 
 import {

apps/web/src/hooks/affine/use-toggle-workspace-publish.ts

@@ -3,7 +3,7 @@ import useSWR from 'swr';
 
 import { jotaiStore, jotaiWorkspacesAtom } from '../../atoms';
 import { QueryKey } from '../../plugins/affine/fetcher';
-import { AffineWorkspace } from '../../shared';
+import type { AffineWorkspace } from '../../shared';
 import { apis } from '../../shared/apis';
 
 export function useToggleWorkspacePublish(workspace: AffineWorkspace) {

apps/web/src/hooks/current/use-current-page-id.ts

@@ -1,4 +1,4 @@
-import { Page } from '@blocksuite/store';
+import type { Page } from '@blocksuite/store';
 import { atom, useAtom, useAtomValue } from 'jotai';
 
 import { currentPageIdAtom } from '../../atoms';

apps/web/src/hooks/current/use-current-user.ts

@@ -1,4 +1,4 @@
-import { AccessTokenMessage } from '@affine/datacenter';
+import type { AccessTokenMessage } from '@affine/datacenter';
 import useSWR from 'swr';
 
 import { QueryKey } from '../../plugins/affine/fetcher';

apps/web/src/hooks/current/use-current-workspace.ts

@@ -7,7 +7,7 @@ import {
   currentWorkspaceIdAtom,
   workspacesAtom,
 } from '../../atoms';
-import { RemWorkspace } from '../../shared';
+import type { RemWorkspace } from '../../shared';
 
 export const currentWorkspaceAtom = atom<Promise<RemWorkspace | null>>(
   async get => {

apps/web/src/hooks/use-blocksuite-workspace-avatar-url.ts

@@ -3,7 +3,7 @@ import { useCallback } from 'react';
 import useSWR from 'swr';
 
 import { QueryKey } from '../plugins/affine/fetcher';
-import { BlockSuiteWorkspace } from '../shared';
+import type { BlockSuiteWorkspace } from '../shared';
 
 export function useBlockSuiteWorkspaceAvatarUrl(
   // todo: remove `null` from type

apps/web/src/hooks/use-blocksuite-workspace-helper.ts

@@ -1,7 +1,7 @@
 import { assertExists } from '@blocksuite/store';
 import { useMemo } from 'react';
 
-import { BlockSuiteWorkspace } from '../shared';
+import type { BlockSuiteWorkspace } from '../shared';
 
 export function useBlockSuiteWorkspaceHelper(
   blockSuiteWorkspace: BlockSuiteWorkspace | null

apps/web/src/hooks/use-blocksuite-workspace-name.ts

@@ -2,7 +2,7 @@ import { UNTITLED_WORKSPACE_NAME } from '@affine/env';
 import { assertExists } from '@blocksuite/store';
 import { useCallback, useEffect, useState } from 'react';
 
-import { BlockSuiteWorkspace } from '../shared';
+import type { BlockSuiteWorkspace } from '../shared';
 
 export function useBlockSuiteWorkspaceName(
   blockSuiteWorkspace: BlockSuiteWorkspace | null

apps/web/src/hooks/use-blocksuite-workspace-page-title.ts

@@ -1,7 +1,7 @@
 import { assertExists } from '@blocksuite/store';
 import { useEffect, useState } from 'react';
 
-import { BlockSuiteWorkspace } from '../shared';
+import type { BlockSuiteWorkspace } from '../shared';
 
 export function useBlockSuiteWorkspacePageTitle(
   blockSuiteWorkspace: BlockSuiteWorkspace,

apps/web/src/hooks/use-page-meta.ts

@@ -1,7 +1,7 @@
-import { PageMeta } from '@blocksuite/store';
+import type { PageMeta } from '@blocksuite/store';
 import { useEffect, useMemo, useState } from 'react';
 
-import { BlockSuiteWorkspace } from '../shared';
+import type { BlockSuiteWorkspace } from '../shared';
 
 declare module '@blocksuite/store' {
   interface PageMeta {

apps/web/src/hooks/use-router-helper.ts

@@ -1,7 +1,7 @@
-import { NextRouter } from 'next/router';
+import type { NextRouter } from 'next/router';
 import { useMemo } from 'react';
 
-import { WorkspaceSubPath } from '../shared';
+import type { WorkspaceSubPath } from '../shared';
 
 export const enum RouteLogic {
   REPLACE = 'replace',

apps/web/src/hooks/use-router-title.ts

@@ -1,4 +1,4 @@
-import { NextRouter } from 'next/router';
+import type { NextRouter } from 'next/router';
 import { useMemo } from 'react';
 
 import { WorkspaceSubPathName } from '../shared';

apps/web/src/hooks/use-sync-router-with-current-workspace-and-page.ts

@@ -1,8 +1,9 @@
-import { NextRouter } from 'next/router';
+import type { NextRouter } from 'next/router';
 import { useEffect } from 'react';
 
 import { currentPageIdAtom, jotaiStore } from '../atoms';
-import { RemWorkspace, RemWorkspaceFlavour } from '../shared';
+import type { RemWorkspace } from '../shared';
+import { RemWorkspaceFlavour } from '../shared';
 import { useCurrentPageId } from './current/use-current-page-id';
 import { useCurrentWorkspace } from './current/use-current-workspace';
 import { useWorkspaces } from './use-workspaces';

apps/web/src/hooks/use-sync-router-with-current-workspace.ts

@@ -1,4 +1,4 @@
-import { NextRouter } from 'next/router';
+import type { NextRouter } from 'next/router';
 import { useEffect } from 'react';
 
 import { useCurrentWorkspace } from './current/use-current-workspace';

apps/web/src/hooks/use-transform-workspace.ts

@@ -3,7 +3,7 @@ import { useCallback } from 'react';
 
 import { jotaiWorkspacesAtom } from '../atoms';
 import { WorkspacePlugins } from '../plugins';
-import { FlavourToWorkspace, RemWorkspaceFlavour } from '../shared';
+import type { FlavourToWorkspace, RemWorkspaceFlavour } from '../shared';
 
 /**
  * Transform workspace from one flavour to another

apps/web/src/hooks/use-workspace-blob.ts

@@ -1,7 +1,7 @@
-import { BlobStorage } from '@blocksuite/store';
+import type { BlobStorage } from '@blocksuite/store';
 import { useEffect, useState } from 'react';
 
-import { BlockSuiteWorkspace } from '../shared';
+import type { BlockSuiteWorkspace } from '../shared';
 
 export function useWorkspaceBlob(
   blockSuiteWorkspace: BlockSuiteWorkspace

apps/web/src/hooks/use-workspaces.ts

@@ -5,7 +5,8 @@ import { useCallback, useEffect } from 'react';
 import { jotaiWorkspacesAtom, workspacesAtom } from '../atoms';
 import { WorkspacePlugins } from '../plugins';
 import { LocalPlugin } from '../plugins/local';
-import { LocalWorkspace, RemWorkspace, RemWorkspaceFlavour } from '../shared';
+import type { LocalWorkspace, RemWorkspace } from '../shared';
+import { RemWorkspaceFlavour } from '../shared';
 import { createEmptyBlockSuiteWorkspace } from '../utils';
 
 export function useWorkspaces(): RemWorkspace[] {

apps/web/src/layouts/index.tsx

@@ -6,7 +6,8 @@ import { useAtom, useAtomValue, useSetAtom } from 'jotai';
 import dynamic from 'next/dynamic';
 import Head from 'next/head';
 import { useRouter } from 'next/router';
-import React, { Suspense, useCallback, useEffect } from 'react';
+import type React from 'react';
+import { Suspense, useCallback, useEffect } from 'react';
 
 import {
   currentWorkspaceIdAtom,

apps/web/src/pages/_app.tsx

@@ -2,14 +2,15 @@ import '../styles/globals.css';
 
 import { config, setupGlobal } from '@affine/env';
 import { createI18n, I18nextProvider } from '@affine/i18n';
-import { EmotionCache } from '@emotion/cache';
+import type { EmotionCache } from '@emotion/cache';
 import { CacheProvider } from '@emotion/react';
 import { Provider } from 'jotai';
 import { useAtomsDebugValue } from 'jotai-devtools';
-import { AppProps } from 'next/app';
+import type { AppProps } from 'next/app';
 import Head from 'next/head';
 import { useRouter } from 'next/router';
-import React, { memo, ReactElement, Suspense, useEffect, useMemo } from 'react';
+import type { ReactElement } from 'react';
+import React, { memo, Suspense, useEffect, useMemo } from 'react';
 
 import { jotaiStore } from '../atoms';
 import { AffineErrorBoundary } from '../components/affine/affine-error-eoundary';
@@ -18,7 +19,7 @@ import { PageLoading } from '../components/pure/loading';
 import { MessageCenter } from '../components/pure/message-center';
 import { AffineSWRConfigProvider } from '../providers/AffineSWRConfigProvider';
 import { ThemeProvider } from '../providers/ThemeProvider';
-import { NextPageWithLayout } from '../shared';
+import type { NextPageWithLayout } from '../shared';
 import createEmotionCache from '../utils/create-emotion-cache';
 
 setupGlobal();

apps/web/src/pages/_debug/broadcast.dev.tsx

@@ -2,12 +2,13 @@ import { Button, toast } from '@affine/component';
 import { DebugLogger } from '@affine/debug';
 import { nanoid } from '@blocksuite/store';
 import { Typography } from '@mui/material';
-import React, { useEffect, useMemo, useState } from 'react';
+import type React from 'react';
+import { useEffect, useMemo, useState } from 'react';
 
 import { createBroadCastChannelProvider } from '../../blocksuite/providers';
 import PageList from '../../components/blocksuite/block-suite-page-list/page-list';
 import { StyledPage, StyledWrapper } from '../../layouts/styles';
-import { BroadCastChannelProvider } from '../../shared';
+import type { BroadCastChannelProvider } from '../../shared';
 import { createEmptyBlockSuiteWorkspace } from '../../utils';
 
 const logger = new DebugLogger('broadcast');

apps/web/src/pages/_debug/init-page.dev.tsx

@@ -3,7 +3,7 @@ import dynamic from 'next/dynamic';
 import { useRouter } from 'next/router';
 
 import { StyledPage, StyledWrapper } from '../../layouts/styles';
-import { NextPageWithLayout } from '../../shared';
+import type { NextPageWithLayout } from '../../shared';
 import { initPage } from '../../utils/blocksuite';
 
 const Editor = dynamic(

apps/web/src/pages/_document.tsx

@@ -1,12 +1,7 @@
 import type { EmotionJSX } from '@emotion/react/types/jsx-namespace';
 import createEmotionServer from '@emotion/server/create-instance';
-import Document, {
+import type { DocumentContext } from 'next/document';
-  DocumentContext,
+import Document, { Head, Html, Main, NextScript } from 'next/document';
-  Head,
-  Html,
-  Main,
-  NextScript,
-} from 'next/document';
 import * as React from 'react';
 
 import createEmotionCache from '../utils/create-emotion-cache';

apps/web/src/pages/index.tsx

@@ -1,4 +1,4 @@
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import { useRouter } from 'next/router';
 import React, { Suspense, useEffect } from 'react';
 

apps/web/src/pages/invite/[invite_code].tsx

@@ -1,6 +1,6 @@
 import { displayFlex, styled } from '@affine/component';
 import { Button } from '@affine/component';
-import { Permission } from '@affine/datacenter';
+import type { Permission } from '@affine/datacenter';
 import {
   SucessfulDuotoneIcon,
   UnsucessfulDuotoneIcon,
@@ -16,7 +16,8 @@ import inviteSuccess from '../../../public/imgs/invite-success.svg';
 import { PageLoading } from '../../components/pure/loading';
 import { RouteLogic, useRouterHelper } from '../../hooks/use-router-helper';
 import { QueryKey } from '../../plugins/affine/fetcher';
-import { NextPageWithLayout, WorkspaceSubPath } from '../../shared';
+import type { NextPageWithLayout } from '../../shared';
+import { WorkspaceSubPath } from '../../shared';
 
 const InvitePage: NextPageWithLayout = () => {
   const router = useRouter();

apps/web/src/pages/preview/[previewId].tsx

@@ -1,4 +1,4 @@
-import {
+import type {
   GetStaticPaths,
   GetStaticProps,
   InferGetStaticPropsType,
@@ -14,7 +14,7 @@ import {
   StyledToolWrapper,
   StyledWrapper,
 } from '../../layouts/styles';
-import { BlockSuiteWorkspace } from '../../shared';
+import type { BlockSuiteWorkspace } from '../../shared';
 import { createEmptyBlockSuiteWorkspace } from '../../utils';
 
 export type PreviewPageProps = {

apps/web/src/pages/public-workspace/[workspaceId].tsx

@@ -4,7 +4,8 @@ import { Box } from '@mui/material';
 import { useAtomValue, useSetAtom } from 'jotai';
 import dynamic from 'next/dynamic';
 import { useRouter } from 'next/router';
-import React, { Suspense, useCallback, useEffect } from 'react';
+import type React from 'react';
+import { Suspense, useCallback, useEffect } from 'react';
 
 import { currentWorkspaceIdAtom, openQuickSearchModalAtom } from '../../atoms';
 import {
@@ -18,7 +19,7 @@ import { PageLoading } from '../../components/pure/loading';
 import { useBlockSuiteWorkspaceAvatarUrl } from '../../hooks/use-blocksuite-workspace-avatar-url';
 import { useBlockSuiteWorkspaceName } from '../../hooks/use-blocksuite-workspace-name';
 import { WorkspaceLayout } from '../../layouts';
-import { NextPageWithLayout } from '../../shared';
+import type { NextPageWithLayout } from '../../shared';
 import { NavContainer, StyledBreadcrumbs } from './[workspaceId]/[pageId]';
 
 const BlockSuitePublicPageList = dynamic(

apps/web/src/pages/public-workspace/[workspaceId]/[pageId].tsx

@@ -9,7 +9,8 @@ import { PageIcon } from '@blocksuite/icons';
 import { useAtomValue, useSetAtom } from 'jotai';
 import Link from 'next/link';
 import { useRouter } from 'next/router';
-import React, { Suspense, useEffect } from 'react';
+import type React from 'react';
+import { Suspense, useEffect } from 'react';
 
 import {
   publicBlockSuiteAtom,
@@ -22,7 +23,7 @@ import { PageLoading } from '../../../components/pure/loading';
 import { useBlockSuiteWorkspaceAvatarUrl } from '../../../hooks/use-blocksuite-workspace-avatar-url';
 import { useBlockSuiteWorkspaceName } from '../../../hooks/use-blocksuite-workspace-name';
 import { WorkspaceLayout } from '../../../layouts';
-import { NextPageWithLayout } from '../../../shared';
+import type { NextPageWithLayout } from '../../../shared';
 import { initPage } from '../../../utils/blocksuite';
 
 export const NavContainer = styled('div')(({ theme }) => {

apps/web/src/pages/workspace/[workspaceId]/[pageId].tsx

@@ -1,5 +1,6 @@
 import { useRouter } from 'next/router';
-import React, { useEffect } from 'react';
+import type React from 'react';
+import { useEffect } from 'react';
 
 import { Unreachable } from '../../../components/affine/affine-error-eoundary';
 import { PageLoading } from '../../../components/pure/loading';
@@ -9,11 +10,8 @@ import { useCurrentWorkspace } from '../../../hooks/current/use-current-workspac
 import { useSyncRouterWithCurrentWorkspaceAndPage } from '../../../hooks/use-sync-router-with-current-workspace-and-page';
 import { WorkspaceLayout } from '../../../layouts';
 import { WorkspacePlugins } from '../../../plugins';
-import {
+import type { BlockSuiteWorkspace, NextPageWithLayout } from '../../../shared';
-  BlockSuiteWorkspace,
+import { RemWorkspaceFlavour } from '../../../shared';
-  NextPageWithLayout,
-  RemWorkspaceFlavour,
-} from '../../../shared';
 
 function enableFullFlags(blockSuiteWorkspace: BlockSuiteWorkspace) {
   blockSuiteWorkspace.awarenessStore.setFlag('enable_set_remote_flag', false);

apps/web/src/pages/workspace/[workspaceId]/all.tsx

@@ -16,11 +16,11 @@ import { useRouterHelper } from '../../../hooks/use-router-helper';
 import { useSyncRouterWithCurrentWorkspace } from '../../../hooks/use-sync-router-with-current-workspace';
 import { WorkspaceLayout } from '../../../layouts';
 import { WorkspacePlugins } from '../../../plugins';
-import {
+import type {
   LocalIndexedDBProvider,
   NextPageWithLayout,
-  RemWorkspaceFlavour,
 } from '../../../shared';
+import { RemWorkspaceFlavour } from '../../../shared';
 
 const AllPage: NextPageWithLayout = () => {
   const router = useRouter();

apps/web/src/pages/workspace/[workspaceId]/favorite.tsx

@@ -12,7 +12,7 @@ import { useCurrentWorkspace } from '../../../hooks/current/use-current-workspac
 import { useRouterHelper } from '../../../hooks/use-router-helper';
 import { useSyncRouterWithCurrentWorkspace } from '../../../hooks/use-sync-router-with-current-workspace';
 import { WorkspaceLayout } from '../../../layouts';
-import { NextPageWithLayout } from '../../../shared';
+import type { NextPageWithLayout } from '../../../shared';
 
 const FavouritePage: NextPageWithLayout = () => {
   const router = useRouter();

apps/web/src/pages/workspace/[workspaceId]/setting.tsx

@@ -16,11 +16,13 @@ import { useTransformWorkspace } from '../../../hooks/use-transform-workspace';
 import { useWorkspacesHelper } from '../../../hooks/use-workspaces';
 import { WorkspaceLayout } from '../../../layouts';
 import { WorkspacePlugins } from '../../../plugins';
-import {
+import type {
   FlavourToWorkspace,
   NextPageWithLayout,
-  RemWorkspaceFlavour,
   SettingPanel,
+} from '../../../shared';
+import {
+  RemWorkspaceFlavour,
   settingPanel,
   settingPanelValues,
 } from '../../../shared';

apps/web/src/pages/workspace/[workspaceId]/trash.tsx

@@ -12,7 +12,7 @@ import { useCurrentWorkspace } from '../../../hooks/current/use-current-workspac
 import { useRouterHelper } from '../../../hooks/use-router-helper';
 import { useSyncRouterWithCurrentWorkspace } from '../../../hooks/use-sync-router-with-current-workspace';
 import { WorkspaceLayout } from '../../../layouts';
-import { NextPageWithLayout } from '../../../shared';
+import type { NextPageWithLayout } from '../../../shared';
 
 const TrashPage: NextPageWithLayout = () => {
   const router = useRouter();

apps/web/src/plugins/affine/fetcher.ts

@@ -3,7 +3,8 @@ import { assertExists } from '@blocksuite/store';
 import { jotaiStore, workspacesAtom } from '../../atoms';
 import { createAffineProviders } from '../../blocksuite';
 import { Unreachable } from '../../components/affine/affine-error-eoundary';
-import { AffineWorkspace, RemWorkspaceFlavour } from '../../shared';
+import type { AffineWorkspace } from '../../shared';
+import { RemWorkspaceFlavour } from '../../shared';
 import { apis } from '../../shared/apis';
 import { createEmptyBlockSuiteWorkspace } from '../../utils';
 

apps/web/src/plugins/affine/index.tsx

@@ -8,8 +8,8 @@ import { PageNotFoundError } from '../../components/affine/affine-error-eoundary
 import { WorkspaceSettingDetail } from '../../components/affine/workspace-setting-detail';
 import { BlockSuitePageList } from '../../components/blocksuite/block-suite-page-list';
 import { PageDetailEditor } from '../../components/page-detail-editor';
+import type { AffineWorkspace } from '../../shared';
 import {
-  AffineWorkspace,
   BlockSuiteWorkspace,
   LoadPriority,
   RemWorkspaceFlavour,
@@ -17,7 +17,7 @@ import {
 import { apis, clientAuth } from '../../shared/apis';
 import { createEmptyBlockSuiteWorkspace } from '../../utils';
 import { initPage } from '../../utils/blocksuite';
-import { WorkspacePlugin } from '..';
+import type { WorkspacePlugin } from '..';
 import { QueryKey } from './fetcher';
 
 const storage = createJSONStorage(() => localStorage);

apps/web/src/plugins/index.tsx

@@ -1,12 +1,12 @@
-import React from 'react';
+import type React from 'react';
 
-import {
+import type {
   BlockSuiteWorkspace,
   FlavourToWorkspace,
   LoadPriority,
-  RemWorkspaceFlavour,
   SettingPanel,
 } from '../shared';
+import { RemWorkspaceFlavour } from '../shared';
 import { AffinePlugin } from './affine';
 import { LocalPlugin } from './local';
 

apps/web/src/plugins/local/index.tsx

@@ -10,15 +10,15 @@ import { PageNotFoundError } from '../../components/affine/affine-error-eoundary
 import { WorkspaceSettingDetail } from '../../components/affine/workspace-setting-detail';
 import { BlockSuitePageList } from '../../components/blocksuite/block-suite-page-list';
 import { PageDetailEditor } from '../../components/page-detail-editor';
+import type { LocalWorkspace } from '../../shared';
 import {
   BlockSuiteWorkspace,
   LoadPriority,
-  LocalWorkspace,
   RemWorkspaceFlavour,
 } from '../../shared';
 import { createEmptyBlockSuiteWorkspace } from '../../utils';
 import { initPage } from '../../utils/blocksuite';
-import { WorkspacePlugin } from '..';
+import type { WorkspacePlugin } from '..';
 
 const getStorage = () => createJSONStorage(() => localStorage);
 

apps/web/src/providers/AffineSWRConfigProvider.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
-import { SWRConfig, SWRConfiguration } from 'swr';
+import type { SWRConfiguration } from 'swr';
+import { SWRConfig } from 'swr';
 
 import { fetcher } from '../plugins/affine/fetcher';
 

apps/web/src/providers/ModalProvider.tsx

@@ -1,7 +1,8 @@
 import { useAtom, useAtomValue, useSetAtom } from 'jotai';
 import dynamic from 'next/dynamic';
 import { useRouter } from 'next/router';
-import React, { useCallback } from 'react';
+import type React from 'react';
+import { useCallback } from 'react';
 
 import {
   currentWorkspaceIdAtom,

apps/web/src/providers/ThemeProvider.tsx

@@ -1,4 +1,4 @@
-import { AffineTheme, ThemeProviderProps } from '@affine/component';
+import type { AffineTheme, ThemeProviderProps } from '@affine/component';
 import {
   getDarkTheme,
   getLightTheme,

apps/web/src/shared/index.ts

@@ -1,7 +1,7 @@
-import { Workspace as RemoteWorkspace } from '@affine/datacenter';
+import type { Workspace as RemoteWorkspace } from '@affine/datacenter';
 import { Workspace as BlockSuiteWorkspace } from '@blocksuite/store';
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
-import { ReactElement, ReactNode } from 'react';
+import type { ReactElement, ReactNode } from 'react';
 
 export { BlockSuiteWorkspace };
 

apps/web/src/utils/blocksuite.ts

@@ -1,7 +1,7 @@
 import { DebugLogger } from '@affine/debug';
 import markdown from '@affine/templates/Welcome-to-AFFiNE.md';
-import { EditorContainer } from '@blocksuite/editor';
+import type { EditorContainer } from '@blocksuite/editor';
-import { Page } from '@blocksuite/store';
+import type { Page } from '@blocksuite/store';
 
 const demoTitle = markdown
   .split('\n')

packages/component/src/components/block-suite-editor/index.stories.tsx

@@ -1,12 +1,14 @@
 /* deepscan-disable USELESS_ARROW_FUNC_BIND */
 import { __unstableSchemas, builtInSchemas } from '@blocksuite/blocks/models';
-import { EditorContainer } from '@blocksuite/editor';
+import type { EditorContainer } from '@blocksuite/editor';
-import { Page, Workspace } from '@blocksuite/store';
+import type { Page } from '@blocksuite/store';
+import { Workspace } from '@blocksuite/store';
 import { expect } from '@storybook/jest';
-import { Meta, StoryFn } from '@storybook/react';
+import type { Meta, StoryFn } from '@storybook/react';
 import { useEffect, useState } from 'react';
 
-import { BlockSuiteEditor, EditorProps } from '.';
+import type { EditorProps } from '.';
+import { BlockSuiteEditor } from '.';
 
 function initPage(page: Page, editor: Readonly<EditorContainer>): void {
   // Add page block and surface block at root level

packages/component/src/components/block-suite-editor/index.tsx

@@ -1,7 +1,8 @@
-import { BlockHub } from '@blocksuite/blocks';
+import type { BlockHub } from '@blocksuite/blocks';
 import { EditorContainer } from '@blocksuite/editor';
 import type { Page, Workspace } from '@blocksuite/store';
-import { CSSProperties, useEffect, useRef } from 'react';
+import type { CSSProperties } from 'react';
+import { useEffect, useRef } from 'react';
 
 export type EditorProps = {
   blockSuiteWorkspace: Workspace;

packages/component/src/stories/Breadcrumbs.stories.tsx

@@ -1,7 +1,7 @@
 /* deepscan-disable USELESS_ARROW_FUNC_BIND */
 import { Link, Typography } from '@mui/material';
 import { expect } from '@storybook/jest';
-import { Meta, StoryFn } from '@storybook/react';
+import type { Meta, StoryFn } from '@storybook/react';
 import { within } from '@storybook/testing-library';
 
 import { Breadcrumbs } from '..';

packages/component/src/stories/Button.stories.tsx

@@ -1,8 +1,8 @@
 /* deepscan-disable USELESS_ARROW_FUNC_BIND */
-import { Meta, StoryFn } from '@storybook/react';
+import type { Meta, StoryFn } from '@storybook/react';
 
 import { Button } from '..';
-import { ButtonProps } from '../ui/button/interface';
+import type { ButtonProps } from '../ui/button/interface';
 
 export default {
   title: 'AFFiNE/Button',

packages/component/src/styles/styled.tsx

@@ -9,7 +9,7 @@ import {
 import type { PropsWithChildren } from 'react';
 import { useMemo } from 'react';
 
-import { AffineTheme } from './types';
+import type { AffineTheme } from './types';
 
 export { css, keyframes, styled };