From 319d71345d3b7a6dacc307bea5cf370494224400 Mon Sep 17 00:00:00 2001 From: Himself65 Date: Mon, 29 May 2023 21:56:00 +0800 Subject: [PATCH] refactor: ui adapter (#2577) --- apps/web/src/adapters/affine/index.tsx | 6 +- apps/web/src/adapters/local/index.tsx | 2 +- apps/web/src/adapters/workspace.ts | 21 +++-- .../hooks/__tests__/use-recent-views.spec.tsx | 4 +- apps/web/src/hooks/use-workspaces.ts | 4 +- .../workspace/[workspaceId]/[pageId].tsx | 35 +++----- .../src/pages/workspace/[workspaceId]/all.tsx | 82 ++++++------------ .../pages/workspace/[workspaceId]/setting.tsx | 86 ++++++------------- 8 files changed, 87 insertions(+), 153 deletions(-) diff --git a/apps/web/src/adapters/affine/index.tsx b/apps/web/src/adapters/affine/index.tsx index 7865ca908d..1581837ad2 100644 --- a/apps/web/src/adapters/affine/index.tsx +++ b/apps/web/src/adapters/affine/index.tsx @@ -96,7 +96,7 @@ function AuthContext({ children }: PropsWithChildren): ReactElement { return <>{children}; } -export const AffinePlugin: WorkspaceAdapter = { +export const AffineAdapter: WorkspaceAdapter = { releaseType: ReleaseType.STABLE, flavour: WorkspaceFlavour.AFFINE, loadPriority: LoadPriority.HIGH, @@ -175,7 +175,7 @@ export const AffinePlugin: WorkspaceAdapter = { await mutate(matcher => matcher === QueryKey.getWorkspaces); // refresh the local storage - await AffinePlugin.CRUD.list(); + await AffineAdapter.CRUD.list(); return id; }, delete: async workspace => { @@ -208,7 +208,7 @@ export const AffinePlugin: WorkspaceAdapter = { return null; } const workspaces: AffineLegacyCloudWorkspace[] = - await AffinePlugin.CRUD.list(); + await AffineAdapter.CRUD.list(); return ( workspaces.find(workspace => workspace.id === workspaceId) ?? null ); diff --git a/apps/web/src/adapters/local/index.tsx b/apps/web/src/adapters/local/index.tsx index 912fa6d05d..da111fa917 100644 --- a/apps/web/src/adapters/local/index.tsx +++ b/apps/web/src/adapters/local/index.tsx @@ -45,7 +45,7 @@ const PageDetailEditor = lazy(() => const logger = new DebugLogger('use-create-first-workspace'); -export const LocalPlugin: WorkspaceAdapter = { +export const LocalAdapter: WorkspaceAdapter = { releaseType: ReleaseType.STABLE, flavour: WorkspaceFlavour.LOCAL, loadPriority: LoadPriority.LOW, diff --git a/apps/web/src/adapters/workspace.ts b/apps/web/src/adapters/workspace.ts index ae98c231c1..fa1d1482fb 100644 --- a/apps/web/src/adapters/workspace.ts +++ b/apps/web/src/adapters/workspace.ts @@ -1,12 +1,13 @@ -import type { AppEvents } from '@affine/workspace/type'; +import { Unreachable } from '@affine/env'; +import type { AppEvents, WorkspaceUISchema } from '@affine/workspace/type'; import { LoadPriority, ReleaseType, WorkspaceFlavour, } from '@affine/workspace/type'; -import { AffinePlugin } from './affine'; -import { LocalPlugin } from './local'; +import { AffineAdapter } from './affine'; +import { LocalAdapter } from './local'; import type { WorkspaceAdapter } from './type'; const unimplemented = () => { @@ -14,8 +15,8 @@ const unimplemented = () => { }; export const WorkspaceAdapters = { - [WorkspaceFlavour.AFFINE]: AffinePlugin, - [WorkspaceFlavour.LOCAL]: LocalPlugin, + [WorkspaceFlavour.AFFINE]: AffineAdapter, + [WorkspaceFlavour.LOCAL]: LocalAdapter, [WorkspaceFlavour.AFFINE_CLOUD]: { releaseType: ReleaseType.UNRELEASED, flavour: WorkspaceFlavour.AFFINE_CLOUD, @@ -59,3 +60,13 @@ export const WorkspaceAdapters = { } satisfies { [Key in WorkspaceFlavour]: WorkspaceAdapter; }; + +export function getUIAdapter( + flavour: Flavour +): WorkspaceUISchema { + const ui = WorkspaceAdapters[flavour].UI as WorkspaceUISchema; + if (!ui) { + throw new Unreachable(); + } + return ui; +} diff --git a/apps/web/src/hooks/__tests__/use-recent-views.spec.tsx b/apps/web/src/hooks/__tests__/use-recent-views.spec.tsx index 1cb0c716b7..73cf42affc 100644 --- a/apps/web/src/hooks/__tests__/use-recent-views.spec.tsx +++ b/apps/web/src/hooks/__tests__/use-recent-views.spec.tsx @@ -18,7 +18,7 @@ import { createDynamicRouteParser } from 'next-router-mock/dynamic-routes'; import type { FC, PropsWithChildren } from 'react'; import { beforeAll, beforeEach, describe, expect, test, vi } from 'vitest'; -import { LocalPlugin } from '../../adapters/local'; +import { LocalAdapter } from '../../adapters/local'; import { workspacesAtom } from '../../atoms'; import { BlockSuiteWorkspace } from '../../shared'; import { WorkspaceSubPath } from '../../shared'; @@ -92,7 +92,7 @@ describe('useRecentlyViewed', () => { flavour: WorkspaceFlavour.LOCAL, }, ]); - LocalPlugin.CRUD.get = vi.fn().mockResolvedValue({ + LocalAdapter.CRUD.get = vi.fn().mockResolvedValue({ id: workspaceId, flavour: WorkspaceFlavour.LOCAL, blockSuiteWorkspace, diff --git a/apps/web/src/hooks/use-workspaces.ts b/apps/web/src/hooks/use-workspaces.ts index f2a3492084..5602dbbd29 100644 --- a/apps/web/src/hooks/use-workspaces.ts +++ b/apps/web/src/hooks/use-workspaces.ts @@ -8,7 +8,7 @@ import { nanoid } from '@blocksuite/store'; import { useAtomValue, useSetAtom } from 'jotai'; import { useCallback } from 'react'; -import { LocalPlugin } from '../adapters/local'; +import { LocalAdapter } from '../adapters/local'; import { WorkspaceAdapters } from '../adapters/workspace'; import { workspacesAtom } from '../atoms'; import type { AllWorkspace } from '../shared'; @@ -62,7 +62,7 @@ export function useAppHelper() { WorkspaceFlavour.LOCAL ); blockSuiteWorkspace.meta.setName(name); - const id = await LocalPlugin.CRUD.create(blockSuiteWorkspace); + const id = await LocalAdapter.CRUD.create(blockSuiteWorkspace); set(workspaces => [ ...workspaces, { diff --git a/apps/web/src/pages/workspace/[workspaceId]/[pageId].tsx b/apps/web/src/pages/workspace/[workspaceId]/[pageId].tsx index 3993f430ef..25b7bb4c0f 100644 --- a/apps/web/src/pages/workspace/[workspaceId]/[pageId].tsx +++ b/apps/web/src/pages/workspace/[workspaceId]/[pageId].tsx @@ -1,9 +1,7 @@ import { PageDetailSkeleton } from '@affine/component/page-detail-skeleton'; import type { BlockSuiteFeatureFlags } from '@affine/env'; import { config } from '@affine/env'; -import { Unreachable } from '@affine/env/constant'; import { rootCurrentPageIdAtom } from '@affine/workspace/atom'; -import { WorkspaceFlavour } from '@affine/workspace/type'; import type { EditorContainer } from '@blocksuite/editor'; import type { Page } from '@blocksuite/store'; import { assertExists } from '@blocksuite/store'; @@ -13,7 +11,7 @@ import { useRouter } from 'next/router'; import type React from 'react'; import { useCallback, useEffect } from 'react'; -import { WorkspaceAdapters } from '../../../adapters/workspace'; +import { getUIAdapter } from '../../../adapters/workspace'; import { rootCurrentWorkspaceAtom } from '../../../atoms/root'; import { useCurrentWorkspace } from '../../../hooks/current/use-current-workspace'; import { useSyncRecentViewsWithRouter } from '../../../hooks/use-recent-views'; @@ -57,28 +55,15 @@ const WorkspaceDetail: React.FC = () => { setEditorFlags(currentWorkspace.blockSuiteWorkspace); } }, [currentWorkspace]); - if (currentWorkspace.flavour === WorkspaceFlavour.AFFINE) { - const PageDetail = - WorkspaceAdapters[currentWorkspace.flavour].UI.PageDetail; - return ( - - ); - } else if (currentWorkspace.flavour === WorkspaceFlavour.LOCAL) { - const PageDetail = - WorkspaceAdapters[currentWorkspace.flavour].UI.PageDetail; - return ( - - ); - } - throw new Unreachable(); + + const { PageDetail } = getUIAdapter(currentWorkspace.flavour); + return ( + + ); }; const WorkspaceDetailPage: NextPageWithLayout = () => { diff --git a/apps/web/src/pages/workspace/[workspaceId]/all.tsx b/apps/web/src/pages/workspace/[workspaceId]/all.tsx index 236955b59f..bba554d689 100644 --- a/apps/web/src/pages/workspace/[workspaceId]/all.tsx +++ b/apps/web/src/pages/workspace/[workspaceId]/all.tsx @@ -6,16 +6,15 @@ import { ViewList, } from '@affine/component/page-list'; import { config } from '@affine/env'; -import { QueryParamError, Unreachable } from '@affine/env/constant'; +import { QueryParamError } from '@affine/env/constant'; import { useAFFiNEI18N } from '@affine/i18n/hooks'; -import { WorkspaceFlavour } from '@affine/workspace/type'; import { FolderIcon } from '@blocksuite/icons'; import { assertExists } from '@blocksuite/store'; import Head from 'next/head'; import { useRouter } from 'next/router'; import React, { useCallback } from 'react'; -import { WorkspaceAdapters } from '../../../adapters/workspace'; +import { getUIAdapter } from '../../../adapters/workspace'; import { PageLoading } from '../../../components/pure/loading'; import { WorkspaceTitle } from '../../../components/pure/workspace-title'; import { useCurrentWorkspace } from '../../../hooks/current/use-current-workspace'; @@ -78,58 +77,31 @@ const AllPage: NextPageWithLayout = () => { ); - if (currentWorkspace.flavour === WorkspaceFlavour.AFFINE) { - const PageList = WorkspaceAdapters[currentWorkspace.flavour].UI.PageList; - return ( - <> - - {t['All pages']()} - AFFiNE - - } - leftSlot={leftSlot} - > - {t['All pages']()} - - {filterContainer} - - - ); - } else if (currentWorkspace.flavour === WorkspaceFlavour.LOCAL) { - const PageList = WorkspaceAdapters[currentWorkspace.flavour].UI.PageList; - return ( - <> - - {t['All pages']()} - AFFiNE - - } - leftSlot={leftSlot} - > - {t['All pages']()} - - {filterContainer} - - - ); - } - throw new Unreachable(); + + const { PageList } = getUIAdapter(currentWorkspace.flavour); + return ( + <> + + {t['All pages']()} - AFFiNE + + } + leftSlot={leftSlot} + > + {t['All pages']()} + + {filterContainer} + + + ); }; export default AllPage; diff --git a/apps/web/src/pages/workspace/[workspaceId]/setting.tsx b/apps/web/src/pages/workspace/[workspaceId]/setting.tsx index 0540c1540c..405ed99559 100644 --- a/apps/web/src/pages/workspace/[workspaceId]/setting.tsx +++ b/apps/web/src/pages/workspace/[workspaceId]/setting.tsx @@ -1,12 +1,7 @@ -import { Unreachable } from '@affine/env/constant'; import { useAFFiNEI18N } from '@affine/i18n/hooks'; import { rootWorkspacesMetadataAtom } from '@affine/workspace/atom'; import type { SettingPanel } from '@affine/workspace/type'; -import { - settingPanel, - settingPanelValues, - WorkspaceFlavour, -} from '@affine/workspace/type'; +import { settingPanel, settingPanelValues } from '@affine/workspace/type'; import { SettingsIcon } from '@blocksuite/icons'; import { assertExists } from '@blocksuite/store'; import { useAtom, useAtomValue } from 'jotai'; @@ -16,7 +11,7 @@ import type { NextRouter } from 'next/router'; import { useRouter } from 'next/router'; import React, { useCallback, useEffect } from 'react'; -import { WorkspaceAdapters } from '../../../adapters/workspace'; +import { getUIAdapter } from '../../../adapters/workspace'; import { PageLoading } from '../../../components/pure/loading'; import { WorkspaceTitle } from '../../../components/pure/workspace-title'; import { useCurrentWorkspace } from '../../../hooks/current/use-current-workspace'; @@ -119,60 +114,31 @@ const SettingPage: NextPageWithLayout = () => { return ; } else if (settingPanelValues.indexOf(currentTab as SettingPanel) === -1) { return ; - } else if (currentWorkspace.flavour === WorkspaceFlavour.AFFINE) { - const Setting = - WorkspaceAdapters[currentWorkspace.flavour].UI.SettingsDetail; - return ( - <> - - {t['Settings']()} - AFFiNE - - } - > - {t['Workspace Settings']()} - - - - ); - } else if (currentWorkspace.flavour === WorkspaceFlavour.LOCAL) { - const Setting = - WorkspaceAdapters[currentWorkspace.flavour].UI.SettingsDetail; - return ( - <> - - {t['Settings']()} - AFFiNE - - } - > - {t['Workspace Settings']()} - - - - ); } - throw new Unreachable(); + const { SettingsDetail } = getUIAdapter(currentWorkspace.flavour); + return ( + <> + + {t['Settings']()} - AFFiNE + + } + > + {t['Workspace Settings']()} + + + + ); }; export default SettingPage;