perf: reduce unused provider connection (#3090)

apps/web/src/atoms/root.ts

@@ -8,6 +8,7 @@ import type { WorkspaceFlavour } from '@affine/env/workspace';
 import {
   rootCurrentWorkspaceIdAtom,
   rootWorkspacesMetadataAtom,
+  workspaceAdaptersAtom,
 } from '@affine/workspace/atom';
 import { assertExists } from '@blocksuite/global/utils';
 import type { ActiveDocProvider } from '@blocksuite/store';
@@ -22,7 +23,7 @@ const logger = new DebugLogger('web:atoms:root');
  */
 export const workspacesAtom = atom<Promise<AllWorkspace[]>>(
   async (get, { signal }) => {
-    const { WorkspaceAdapters } = await import('../adapters/workspace');
+    const WorkspaceAdapters = get(workspaceAdaptersAtom);
     const flavours: string[] = Object.values(WorkspaceAdapters).map(
       plugin => plugin.flavour
     );
@@ -87,7 +88,7 @@ export const workspacesAtom = atom<Promise<AllWorkspace[]>>(
  */
 export const rootCurrentWorkspaceAtom = atom<Promise<AllWorkspace>>(
   async (get, { signal }) => {
-    const { WorkspaceAdapters } = await import('../adapters/workspace');
+    const WorkspaceAdapters = get(workspaceAdaptersAtom);
     const metadata = await get(rootWorkspacesMetadataAtom);
     const targetId = get(rootCurrentWorkspaceIdAtom);
     if (targetId === null) {

apps/web/src/components/affine/setting-modal/index.tsx

@@ -5,8 +5,10 @@ import {
 import { WorkspaceFlavour } from '@affine/env/workspace';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { ContactWithUsIcon } from '@blocksuite/icons';
+import type { PassiveDocProvider } from '@blocksuite/store';
+import { noop } from 'foxact/noop';
 import type React from 'react';
-import { useCallback, useMemo } from 'react';
+import { useCallback, useEffect, useMemo } from 'react';
 
 import { useCurrentWorkspace } from '../../../hooks/current/use-current-workspace';
 import { useWorkspaces } from '../../../hooks/use-workspaces';
@@ -19,7 +21,7 @@ import {
 } from './general-setting';
 import { SettingSidebar } from './setting-sidebar';
 import { settingContent } from './style.css';
-import { WorkSpaceSetting } from './workspace-setting';
+import { WorkspaceSetting } from './workspace-setting';
 
 type ActiveTab = GeneralSettingKeys | 'workspace' | 'account';
 export type SettingProps = {
@@ -70,6 +72,24 @@ export const SettingModal: React.FC<SettingModalProps & SettingProps> = ({
     onSettingClick({ activeTab: 'account', workspace: null });
   }, [onSettingClick]);
 
+  useEffect(() => {
+    if (workspace && workspace !== currentWorkspace) {
+      const providers = workspace.blockSuiteWorkspace.providers.filter(
+        (provider): provider is PassiveDocProvider =>
+          'passive' in provider && provider.passive
+      );
+      providers.forEach(provider => {
+        provider.connect();
+      });
+      return () => {
+        providers.forEach(provider => {
+          provider.disconnect();
+        });
+      };
+    }
+    return noop;
+  }, [currentWorkspace, workspace]);
+
   return (
     <SettingModalBase open={open} setOpen={setOpen}>
       <SettingSidebar
@@ -87,7 +107,7 @@ export const SettingModal: React.FC<SettingModalProps & SettingProps> = ({
         <div className="wrapper">
           <div className="content">
             {activeTab === 'workspace' && workspace ? (
-              <WorkSpaceSetting key={workspace.id} workspace={workspace} />
+              <WorkspaceSetting key={workspace.id} workspace={workspace} />
             ) : null}
             {generalSettingList.find(v => v.key === activeTab) ? (
               <GeneralSetting generalKey={activeTab as GeneralSettingKeys} />

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

@@ -5,7 +5,7 @@ import { useOnTransformWorkspace } from '../../../../hooks/root/use-on-transform
 import { useAppHelper } from '../../../../hooks/use-workspaces';
 import type { AllWorkspace } from '../../../../shared';
 
-export const WorkSpaceSetting = ({
+export const WorkspaceSetting = ({
   workspace,
 }: {
   workspace: AllWorkspace;

apps/web/src/layouts/workspace-layout.tsx

@@ -99,27 +99,7 @@ export const QuickSearch: FC = () => {
 export const AllWorkspaceContext = ({
   children,
 }: PropsWithChildren): ReactElement => {
-  const currentWorkspaceId = useAtomValue(rootCurrentWorkspaceIdAtom);
-  const workspaces = useWorkspaces();
-  useEffect(() => {
-    const providers = workspaces
-      // ignore current workspace
-      .filter(workspace => workspace.id !== currentWorkspaceId)
-      .flatMap(workspace =>
-        workspace.blockSuiteWorkspace.providers.filter(
-          (provider): provider is PassiveDocProvider =>
-            'passive' in provider && provider.passive
-        )
-      );
-    providers.forEach(provider => {
-      provider.connect();
-    });
-    return () => {
-      providers.forEach(provider => {
-        provider.disconnect();
-      });
-    };
-  }, [currentWorkspaceId, workspaces]);
+  useWorkspaces();
   return <>{children}</>;
 };