mirror of
https://github.com/toeverything/AFFiNE.git
synced 2024-11-24 12:22:10 +03:00
refactor: lazy load workspaces (#3091)
This commit is contained in:
Alex Yang
GitHub
parent
66152401be
commit
283f0cd263
@ -2,27 +2,27 @@ import { toast } from '@affine/component';
|
||||
import { BlockCard } from '@affine/component/card/block-card';
|
||||
import { WorkspaceCard } from '@affine/component/card/workspace-card';
|
||||
import { WorkspaceFlavour } from '@affine/env/workspace';
|
||||
import { createEmptyBlockSuiteWorkspace } from '@affine/workspace/utils';
|
||||
import { EdgelessIcon, PageIcon } from '@blocksuite/icons';
|
||||
import { Workspace } from '@blocksuite/store';
|
||||
|
||||
export default {
|
||||
title: 'AFFiNE/Card',
|
||||
component: WorkspaceCard,
|
||||
};
|
||||
|
||||
const blockSuiteWorkspace = new Workspace({
|
||||
id: 'blocksuite-local',
|
||||
});
|
||||
const blockSuiteWorkspace = createEmptyBlockSuiteWorkspace(
|
||||
'blocksuite-local',
|
||||
WorkspaceFlavour.LOCAL
|
||||
);
|
||||
|
||||
blockSuiteWorkspace.meta.setName('Hello World');
|
||||
|
||||
export const AffineWorkspaceCard = () => {
|
||||
return (
|
||||
<WorkspaceCard
|
||||
workspace={{
|
||||
meta={{
|
||||
id: 'blocksuite-local',
|
||||
flavour: WorkspaceFlavour.LOCAL,
|
||||
id: 'local',
|
||||
blockSuiteWorkspace,
|
||||
}}
|
||||
onClick={() => {}}
|
||||
onSettingClick={() => {}}
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
import type { WorkspaceAvatarProps } from '@affine/component/workspace-avatar';
|
||||
import { WorkspaceAvatar } from '@affine/component/workspace-avatar';
|
||||
import { WorkspaceFlavour } from '@affine/env/workspace';
|
||||
import { Workspace } from '@blocksuite/store';
|
||||
import type { Meta, StoryFn } from '@storybook/react';
|
||||
|
||||
@ -25,16 +24,7 @@ const basicBlockSuiteWorkspace = new Workspace({
|
||||
basicBlockSuiteWorkspace.meta.setName('Hello World');
|
||||
|
||||
export const Basic: StoryFn<WorkspaceAvatarProps> = props => {
|
||||
return (
|
||||
<WorkspaceAvatar
|
||||
{...props}
|
||||
workspace={{
|
||||
flavour: WorkspaceFlavour.LOCAL,
|
||||
id: 'local',
|
||||
blockSuiteWorkspace: basicBlockSuiteWorkspace,
|
||||
}}
|
||||
/>
|
||||
);
|
||||
return <WorkspaceAvatar {...props} workspace={basicBlockSuiteWorkspace} />;
|
||||
};
|
||||
|
||||
Basic.args = {
|
||||
@ -60,16 +50,7 @@ fetch(new URL('@affine-test/fixtures/smile.png', import.meta.url))
|
||||
});
|
||||
|
||||
export const BlobExample: StoryFn<WorkspaceAvatarProps> = props => {
|
||||
return (
|
||||
<WorkspaceAvatar
|
||||
{...props}
|
||||
workspace={{
|
||||
flavour: WorkspaceFlavour.LOCAL,
|
||||
id: 'local',
|
||||
blockSuiteWorkspace: avatarBlockSuiteWorkspace,
|
||||
}}
|
||||
/>
|
||||
);
|
||||
return <WorkspaceAvatar {...props} workspace={avatarBlockSuiteWorkspace} />;
|
||||
};
|
||||
|
||||
BlobExample.args = {
|
||||
|
||||
@ -17,7 +17,10 @@ import {
|
||||
saveWorkspaceToLocalStorage,
|
||||
} from '@affine/workspace/local/crud';
|
||||
import { createIndexedDBDownloadProvider } from '@affine/workspace/providers';
|
||||
import { createEmptyBlockSuiteWorkspace } from '@affine/workspace/utils';
|
||||
import {
|
||||
createEmptyBlockSuiteWorkspace,
|
||||
useStaticBlockSuiteWorkspace,
|
||||
} from '@affine/workspace/utils';
|
||||
import { nanoid } from '@blocksuite/store';
|
||||
|
||||
import {
|
||||
@ -75,13 +78,11 @@ export const LocalAdapter: WorkspaceAdapter<WorkspaceFlavour.LOCAL> = {
|
||||
Provider: ({ children }) => {
|
||||
return <>{children}</>;
|
||||
},
|
||||
PageDetail: ({ currentWorkspace, currentPageId, onLoadEditor }) => {
|
||||
const page = currentWorkspace.blockSuiteWorkspace.getPage(currentPageId);
|
||||
PageDetail: ({ currentWorkspaceId, currentPageId, onLoadEditor }) => {
|
||||
const workspace = useStaticBlockSuiteWorkspace(currentWorkspaceId);
|
||||
const page = workspace.getPage(currentPageId);
|
||||
if (!page) {
|
||||
throw new PageNotFoundError(
|
||||
currentWorkspace.blockSuiteWorkspace,
|
||||
currentPageId
|
||||
);
|
||||
throw new PageNotFoundError(workspace, currentPageId);
|
||||
}
|
||||
return (
|
||||
<>
|
||||
@ -89,7 +90,7 @@ export const LocalAdapter: WorkspaceAdapter<WorkspaceFlavour.LOCAL> = {
|
||||
pageId={currentPageId}
|
||||
onInit={initEmptyPage}
|
||||
onLoad={onLoadEditor}
|
||||
workspace={currentWorkspace}
|
||||
workspace={workspace}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
@ -105,14 +106,14 @@ export const LocalAdapter: WorkspaceAdapter<WorkspaceFlavour.LOCAL> = {
|
||||
);
|
||||
},
|
||||
NewSettingsDetail: ({
|
||||
currentWorkspace,
|
||||
currentWorkspaceId,
|
||||
onDeleteWorkspace,
|
||||
onTransformWorkspace,
|
||||
}) => {
|
||||
return (
|
||||
<NewWorkspaceSettingDetail
|
||||
onDeleteWorkspace={onDeleteWorkspace}
|
||||
workspace={currentWorkspace}
|
||||
workspaceId={currentWorkspaceId}
|
||||
onTransferWorkspace={onTransformWorkspace}
|
||||
/>
|
||||
);
|
||||
|
||||
@ -3,34 +3,14 @@
|
||||
*/
|
||||
import 'fake-indexeddb/auto';
|
||||
|
||||
import { initEmptyPage } from '@affine/env/blocksuite';
|
||||
import type {
|
||||
LocalIndexedDBBackgroundProvider,
|
||||
WorkspaceAdapter,
|
||||
} from '@affine/env/workspace';
|
||||
import { WorkspaceFlavour, WorkspaceVersion } from '@affine/env/workspace';
|
||||
import {
|
||||
rootCurrentWorkspaceIdAtom,
|
||||
rootWorkspacesMetadataAtom,
|
||||
workspaceAdaptersAtom,
|
||||
} from '@affine/workspace/atom';
|
||||
import { createIndexedDBBackgroundProvider } from '@affine/workspace/providers';
|
||||
import {
|
||||
_cleanupBlockSuiteWorkspaceCache,
|
||||
createEmptyBlockSuiteWorkspace,
|
||||
} from '@affine/workspace/utils';
|
||||
import type { ParagraphBlockModel } from '@blocksuite/blocks/models';
|
||||
import type { Page } from '@blocksuite/store';
|
||||
import { createStore } from 'jotai';
|
||||
import { describe, expect, test } from 'vitest';
|
||||
|
||||
import { WorkspaceAdapters } from '../../adapters/workspace';
|
||||
import {
|
||||
pageSettingFamily,
|
||||
pageSettingsAtom,
|
||||
recentPageSettingsAtom,
|
||||
} from '../index';
|
||||
import { rootCurrentWorkspaceAtom } from '../root';
|
||||
|
||||
describe('page mode atom', () => {
|
||||
test('basic', () => {
|
||||
@ -63,66 +43,3 @@ describe('page mode atom', () => {
|
||||
]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('currentWorkspace atom', () => {
|
||||
test('should be defined', async () => {
|
||||
const store = createStore();
|
||||
store.set(
|
||||
workspaceAdaptersAtom,
|
||||
WorkspaceAdapters as Record<
|
||||
WorkspaceFlavour,
|
||||
WorkspaceAdapter<WorkspaceFlavour>
|
||||
>
|
||||
);
|
||||
let id: string;
|
||||
{
|
||||
const workspace = createEmptyBlockSuiteWorkspace(
|
||||
'test',
|
||||
WorkspaceFlavour.LOCAL
|
||||
);
|
||||
const page = workspace.createPage({ id: 'page0' });
|
||||
await initEmptyPage(page);
|
||||
const frameId = page.getBlockByFlavour('affine:note').at(0)?.id as string;
|
||||
id = page.addBlock(
|
||||
'affine:paragraph',
|
||||
{
|
||||
text: new page.Text('test 1'),
|
||||
},
|
||||
frameId
|
||||
);
|
||||
const provider = createIndexedDBBackgroundProvider(
|
||||
workspace.id,
|
||||
workspace.doc,
|
||||
{
|
||||
awareness: workspace.awarenessStore.awareness,
|
||||
}
|
||||
) as LocalIndexedDBBackgroundProvider;
|
||||
provider.connect();
|
||||
await new Promise(resolve => setTimeout(resolve, 1000));
|
||||
provider.disconnect();
|
||||
const workspaceId = await WorkspaceAdapters[
|
||||
WorkspaceFlavour.LOCAL
|
||||
].CRUD.create(workspace);
|
||||
await store.set(rootWorkspacesMetadataAtom, [
|
||||
{
|
||||
id: workspaceId,
|
||||
flavour: WorkspaceFlavour.LOCAL,
|
||||
version: WorkspaceVersion.SubDoc,
|
||||
},
|
||||
]);
|
||||
_cleanupBlockSuiteWorkspaceCache();
|
||||
}
|
||||
store.set(
|
||||
rootCurrentWorkspaceIdAtom,
|
||||
(await store.get(rootWorkspacesMetadataAtom))[0].id
|
||||
);
|
||||
const workspace = await store.get(rootCurrentWorkspaceAtom);
|
||||
expect(workspace).toBeDefined();
|
||||
const page = workspace.blockSuiteWorkspace.getPage('page0') as Page;
|
||||
await page.waitForLoaded();
|
||||
expect(page).not.toBeNull();
|
||||
const paragraphBlock = page.getBlockById(id) as ParagraphBlockModel;
|
||||
expect(paragraphBlock).not.toBeNull();
|
||||
expect(paragraphBlock.text.toString()).toBe('test 1');
|
||||
});
|
||||
});
|
||||
|
||||
@ -10,20 +10,18 @@ export const openCreateWorkspaceModalAtom = atom<CreateWorkspaceMode>(false);
|
||||
export const openQuickSearchModalAtom = atom(false);
|
||||
export const openOnboardingModalAtom = atom(false);
|
||||
|
||||
export type SettingAtom = Pick<SettingProps, 'activeTab' | 'workspace'> & {
|
||||
export type SettingAtom = Pick<SettingProps, 'activeTab' | 'workspaceId'> & {
|
||||
open: boolean;
|
||||
};
|
||||
|
||||
export const openSettingModalAtom = atom<SettingAtom>({
|
||||
activeTab: 'appearance',
|
||||
workspace: null,
|
||||
workspaceId: null,
|
||||
open: false,
|
||||
});
|
||||
|
||||
export const openDisableCloudAlertModalAtom = atom(false);
|
||||
|
||||
export { workspacesAtom } from './root';
|
||||
|
||||
type PageMode = 'page' | 'edgeless';
|
||||
type PageLocalSetting = {
|
||||
mode: PageMode;
|
||||
|
||||
@ -1,160 +0,0 @@
|
||||
//#region async atoms that to load the real workspace data
|
||||
import { DebugLogger } from '@affine/debug';
|
||||
import type {
|
||||
WorkspaceAdapter,
|
||||
WorkspaceRegistry,
|
||||
} from '@affine/env/workspace';
|
||||
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';
|
||||
import { atom } from 'jotai';
|
||||
|
||||
import type { AllWorkspace } from '../shared';
|
||||
|
||||
const logger = new DebugLogger('web:atoms:root');
|
||||
|
||||
/**
|
||||
* Fetch all workspaces from the Plugin CRUD
|
||||
*/
|
||||
export const workspacesAtom = atom<Promise<AllWorkspace[]>>(
|
||||
async (get, { signal }) => {
|
||||
const WorkspaceAdapters = get(workspaceAdaptersAtom);
|
||||
const flavours: string[] = Object.values(WorkspaceAdapters).map(
|
||||
plugin => plugin.flavour
|
||||
);
|
||||
const jotaiWorkspaces = (await get(rootWorkspacesMetadataAtom)).filter(
|
||||
workspace => flavours.includes(workspace.flavour)
|
||||
);
|
||||
if (jotaiWorkspaces.some(meta => !('version' in meta))) {
|
||||
// wait until all workspaces have migrated to v2
|
||||
await new Promise((resolve, reject) => {
|
||||
signal.addEventListener('abort', reject);
|
||||
setTimeout(resolve, 1000);
|
||||
}).catch(() => {
|
||||
// do nothing
|
||||
});
|
||||
}
|
||||
const workspaces = await Promise.all(
|
||||
jotaiWorkspaces.map(workspace => {
|
||||
const adapter = WorkspaceAdapters[
|
||||
workspace.flavour
|
||||
] as WorkspaceAdapter<WorkspaceFlavour>;
|
||||
assertExists(adapter);
|
||||
const { CRUD } = adapter;
|
||||
return CRUD.get(workspace.id).then(workspace => {
|
||||
if (workspace === null) {
|
||||
console.warn(
|
||||
'workspace is null. this should not happen. If you see this error, please report it to the developer.'
|
||||
);
|
||||
}
|
||||
return workspace;
|
||||
});
|
||||
})
|
||||
).then(workspaces =>
|
||||
workspaces.filter(
|
||||
(workspace): workspace is WorkspaceRegistry['affine-cloud' | 'local'] =>
|
||||
workspace !== null
|
||||
)
|
||||
);
|
||||
const workspaceProviders = workspaces.map(workspace =>
|
||||
workspace.blockSuiteWorkspace.providers.filter(
|
||||
(provider): provider is ActiveDocProvider =>
|
||||
'active' in provider && provider.active
|
||||
)
|
||||
);
|
||||
const promises: Promise<void>[] = [];
|
||||
for (const providers of workspaceProviders) {
|
||||
for (const provider of providers) {
|
||||
provider.sync();
|
||||
promises.push(provider.whenReady);
|
||||
}
|
||||
}
|
||||
// we will wait for all the necessary providers to be ready
|
||||
await Promise.all(promises);
|
||||
logger.info('workspaces', workspaces);
|
||||
return workspaces;
|
||||
}
|
||||
);
|
||||
|
||||
/**
|
||||
* This will throw an error if the workspace is not found,
|
||||
* should not be used on the root component,
|
||||
* use `rootCurrentWorkspaceIdAtom` instead
|
||||
*/
|
||||
export const rootCurrentWorkspaceAtom = atom<Promise<AllWorkspace>>(
|
||||
async (get, { signal }) => {
|
||||
const WorkspaceAdapters = get(workspaceAdaptersAtom);
|
||||
const metadata = await get(rootWorkspacesMetadataAtom);
|
||||
const targetId = get(rootCurrentWorkspaceIdAtom);
|
||||
if (targetId === null) {
|
||||
throw new Error(
|
||||
'current workspace id is null. this should not happen. If you see this error, please report it to the developer.'
|
||||
);
|
||||
}
|
||||
const targetWorkspace = metadata.find(meta => meta.id === targetId);
|
||||
if (!targetWorkspace) {
|
||||
throw new Error(`cannot find the workspace with id ${targetId}.`);
|
||||
}
|
||||
|
||||
if (!('version' in targetWorkspace)) {
|
||||
// wait until the workspace has migrated to v2
|
||||
await new Promise((resolve, reject) => {
|
||||
signal.addEventListener('abort', reject);
|
||||
setTimeout(resolve, 1000);
|
||||
}).catch(() => {
|
||||
// do nothing
|
||||
});
|
||||
}
|
||||
|
||||
const adapter = WorkspaceAdapters[
|
||||
targetWorkspace.flavour
|
||||
] as WorkspaceAdapter<WorkspaceFlavour>;
|
||||
assertExists(adapter);
|
||||
|
||||
const workspace = await adapter.CRUD.get(targetWorkspace.id);
|
||||
if (!workspace) {
|
||||
throw new Error(
|
||||
`cannot find the workspace with id ${targetId} in the plugin ${targetWorkspace.flavour}.`
|
||||
);
|
||||
}
|
||||
|
||||
const providers = workspace.blockSuiteWorkspace.providers.filter(
|
||||
(provider): provider is ActiveDocProvider =>
|
||||
'active' in provider && provider.active === true
|
||||
);
|
||||
for (const provider of providers) {
|
||||
provider.sync();
|
||||
// we will wait for the necessary providers to be ready
|
||||
await provider.whenReady;
|
||||
}
|
||||
logger.info('current workspace', workspace);
|
||||
globalThis.currentWorkspace = workspace;
|
||||
globalThis.dispatchEvent(
|
||||
new CustomEvent('affine:workspace:change', {
|
||||
detail: { id: workspace.id },
|
||||
})
|
||||
);
|
||||
return workspace;
|
||||
}
|
||||
);
|
||||
|
||||
declare global {
|
||||
/**
|
||||
* @internal debug only
|
||||
*/
|
||||
// eslint-disable-next-line no-var
|
||||
var currentWorkspace: AllWorkspace | undefined;
|
||||
interface WindowEventMap {
|
||||
'affine:workspace:change': CustomEvent<{ id: string }>;
|
||||
}
|
||||
}
|
||||
|
||||
// Do not add `rootCurrentWorkspacePageAtom`, this is not needed.
|
||||
// It can be derived from `rootCurrentWorkspaceAtom` and `rootCurrentPageIdAtom`
|
||||
|
||||
//#endregion
|
||||
@ -11,7 +11,7 @@ import { useAFFiNEI18N } from '@affine/i18n/hooks';
|
||||
import { useBlockSuiteWorkspaceName } from '@toeverything/hooks/use-block-suite-workspace-name';
|
||||
import type { FC } from 'react';
|
||||
|
||||
import type { AffineOfficialWorkspace } from '../../../shared';
|
||||
import { useWorkspace } from '../../../hooks/use-workspace';
|
||||
import { DeleteLeaveWorkspace } from './delete-leave-workspace';
|
||||
import { ExportPanel } from './export';
|
||||
import { ProfilePanel } from './profile';
|
||||
@ -19,7 +19,7 @@ import { PublishPanel } from './publish';
|
||||
import { StoragePanel } from './storage';
|
||||
|
||||
export type WorkspaceSettingDetailProps = {
|
||||
workspace: AffineOfficialWorkspace;
|
||||
workspaceId: string;
|
||||
onDeleteWorkspace: (id: string) => Promise<void>;
|
||||
onTransferWorkspace: <
|
||||
From extends WorkspaceFlavour,
|
||||
@ -32,11 +32,12 @@ export type WorkspaceSettingDetailProps = {
|
||||
};
|
||||
|
||||
export const WorkspaceSettingDetail: FC<WorkspaceSettingDetailProps> = ({
|
||||
workspace,
|
||||
workspaceId,
|
||||
onDeleteWorkspace,
|
||||
...props
|
||||
}) => {
|
||||
const t = useAFFiNEI18N();
|
||||
const workspace = useWorkspace(workspaceId);
|
||||
const [name] = useBlockSuiteWorkspaceName(workspace.blockSuiteWorkspace);
|
||||
|
||||
return (
|
||||
|
||||
@ -64,7 +64,10 @@ export const ProfilePanel: FC<{
|
||||
<div className="camera-icon-wrapper">
|
||||
<CameraIcon />
|
||||
</div>
|
||||
<WorkspaceAvatar size={56} workspace={workspace} />
|
||||
<WorkspaceAvatar
|
||||
size={56}
|
||||
workspace={workspace.blockSuiteWorkspace}
|
||||
/>
|
||||
</>
|
||||
</Upload>
|
||||
</div>
|
||||
|
||||
@ -18,13 +18,22 @@ import { TmpDisableAffineCloudModal } from '../tmp-disable-affine-cloud-modal';
|
||||
import type { WorkspaceSettingDetailProps } from './index';
|
||||
import * as style from './style.css';
|
||||
|
||||
export type PublishPanelProps = WorkspaceSettingDetailProps & {
|
||||
export type PublishPanelProps = Omit<
|
||||
WorkspaceSettingDetailProps,
|
||||
'workspaceId'
|
||||
> & {
|
||||
workspace: AffineOfficialWorkspace;
|
||||
};
|
||||
export type PublishPanelLocalProps = WorkspaceSettingDetailProps & {
|
||||
export type PublishPanelLocalProps = Omit<
|
||||
WorkspaceSettingDetailProps,
|
||||
'workspaceId'
|
||||
> & {
|
||||
workspace: LocalWorkspace;
|
||||
};
|
||||
export type PublishPanelAffineProps = WorkspaceSettingDetailProps & {
|
||||
export type PublishPanelAffineProps = Omit<
|
||||
WorkspaceSettingDetailProps,
|
||||
'workspaceId'
|
||||
> & {
|
||||
workspace: AffineCloudWorkspace;
|
||||
};
|
||||
|
||||
|
||||
@ -4,14 +4,13 @@ import {
|
||||
} from '@affine/component/setting-components';
|
||||
import { WorkspaceFlavour } from '@affine/env/workspace';
|
||||
import { useAFFiNEI18N } from '@affine/i18n/hooks';
|
||||
import { rootWorkspacesMetadataAtom } from '@affine/workspace/atom';
|
||||
import { ContactWithUsIcon } from '@blocksuite/icons';
|
||||
import type { PassiveDocProvider } from '@blocksuite/store';
|
||||
import { noop } from 'foxact/noop';
|
||||
import { useAtomValue } from 'jotai';
|
||||
import type React from 'react';
|
||||
import { useCallback, useEffect, useMemo } from 'react';
|
||||
import { useCallback, useMemo } from 'react';
|
||||
|
||||
import { useCurrentWorkspace } from '../../../hooks/current/use-current-workspace';
|
||||
import { useWorkspaces } from '../../../hooks/use-workspaces';
|
||||
import type { AllWorkspace } from '../../../shared';
|
||||
import { AccountSetting } from './account-setting';
|
||||
import {
|
||||
@ -26,70 +25,52 @@ import { WorkspaceSetting } from './workspace-setting';
|
||||
type ActiveTab = GeneralSettingKeys | 'workspace' | 'account';
|
||||
export type SettingProps = {
|
||||
activeTab: ActiveTab;
|
||||
workspace: AllWorkspace | null;
|
||||
workspaceId: string | null;
|
||||
onSettingClick: (params: {
|
||||
activeTab: ActiveTab;
|
||||
workspace: AllWorkspace | null;
|
||||
workspaceId: string | null;
|
||||
}) => void;
|
||||
};
|
||||
export const SettingModal: React.FC<SettingModalProps & SettingProps> = ({
|
||||
open,
|
||||
setOpen,
|
||||
activeTab = 'appearance',
|
||||
workspace = null,
|
||||
workspaceId = null,
|
||||
onSettingClick,
|
||||
}) => {
|
||||
const t = useAFFiNEI18N();
|
||||
|
||||
const workspaces = useWorkspaces();
|
||||
const workspaces = useAtomValue(rootWorkspacesMetadataAtom);
|
||||
const [currentWorkspace] = useCurrentWorkspace();
|
||||
const generalSettingList = useGeneralSettingList();
|
||||
const workspaceList = useMemo(() => {
|
||||
return workspaces.filter(
|
||||
({ flavour }) => flavour !== WorkspaceFlavour.PUBLIC
|
||||
) as AllWorkspace[];
|
||||
);
|
||||
}, [workspaces]);
|
||||
|
||||
const onGeneralSettingClick = useCallback(
|
||||
(key: GeneralSettingKeys) => {
|
||||
onSettingClick({
|
||||
activeTab: key,
|
||||
workspace: null,
|
||||
workspaceId: null,
|
||||
});
|
||||
},
|
||||
[onSettingClick]
|
||||
);
|
||||
const onWorkspaceSettingClick = useCallback(
|
||||
(workspace: AllWorkspace) => {
|
||||
(workspaceId: string) => {
|
||||
onSettingClick({
|
||||
activeTab: 'workspace',
|
||||
workspace,
|
||||
workspaceId,
|
||||
});
|
||||
},
|
||||
[onSettingClick]
|
||||
);
|
||||
const onAccountSettingClick = useCallback(() => {
|
||||
onSettingClick({ activeTab: 'account', workspace: null });
|
||||
onSettingClick({ activeTab: 'account', workspaceId: 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
|
||||
@ -99,15 +80,15 @@ export const SettingModal: React.FC<SettingModalProps & SettingProps> = ({
|
||||
workspaceList={workspaceList}
|
||||
onWorkspaceSettingClick={onWorkspaceSettingClick}
|
||||
selectedGeneralKey={activeTab}
|
||||
selectedWorkspace={workspace}
|
||||
selectedWorkspaceId={workspaceId}
|
||||
onAccountSettingClick={onAccountSettingClick}
|
||||
/>
|
||||
|
||||
<div className={settingContent}>
|
||||
<div className="wrapper">
|
||||
<div className="content">
|
||||
{activeTab === 'workspace' && workspace ? (
|
||||
<WorkspaceSetting key={workspace.id} workspace={workspace} />
|
||||
{activeTab === 'workspace' && workspaceId ? (
|
||||
<WorkspaceSetting key={workspaceId} workspaceId={workspaceId} />
|
||||
) : null}
|
||||
{generalSettingList.find(v => v.key === activeTab) ? (
|
||||
<GeneralSetting generalKey={activeTab as GeneralSettingKeys} />
|
||||
|
||||
@ -1,6 +1,8 @@
|
||||
import { UserAvatar } from '@affine/component/user-avatar';
|
||||
import { WorkspaceAvatar } from '@affine/component/workspace-avatar';
|
||||
import { useAFFiNEI18N } from '@affine/i18n/hooks';
|
||||
import type { RootWorkspaceMetadata } from '@affine/workspace/atom';
|
||||
import { useStaticBlockSuiteWorkspace } from '@affine/workspace/utils';
|
||||
import { useBlockSuiteWorkspaceName } from '@toeverything/hooks/use-block-suite-workspace-name';
|
||||
import clsx from 'clsx';
|
||||
|
||||
@ -24,17 +26,17 @@ export const SettingSidebar = ({
|
||||
currentWorkspace,
|
||||
workspaceList,
|
||||
onWorkspaceSettingClick,
|
||||
selectedWorkspace,
|
||||
selectedWorkspaceId,
|
||||
selectedGeneralKey,
|
||||
onAccountSettingClick,
|
||||
}: {
|
||||
generalSettingList: GeneralSettingList;
|
||||
onGeneralSettingClick: (key: GeneralSettingKeys) => void;
|
||||
currentWorkspace: AllWorkspace;
|
||||
workspaceList: AllWorkspace[];
|
||||
onWorkspaceSettingClick: (workspace: AllWorkspace) => void;
|
||||
workspaceList: RootWorkspaceMetadata[];
|
||||
onWorkspaceSettingClick: (workspaceId: string) => void;
|
||||
|
||||
selectedWorkspace: AllWorkspace | null;
|
||||
selectedWorkspaceId: string | null;
|
||||
selectedGeneralKey: string | null;
|
||||
onAccountSettingClick: () => void;
|
||||
}) => {
|
||||
@ -72,12 +74,12 @@ export const SettingSidebar = ({
|
||||
return (
|
||||
<WorkspaceListItem
|
||||
key={workspace.id}
|
||||
workspace={workspace}
|
||||
meta={workspace}
|
||||
onClick={() => {
|
||||
onWorkspaceSettingClick(workspace);
|
||||
onWorkspaceSettingClick(workspace.id);
|
||||
}}
|
||||
isCurrent={workspace.id === currentWorkspace.id}
|
||||
isActive={workspace.id === selectedWorkspace?.id}
|
||||
isActive={workspace.id === selectedWorkspaceId}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
@ -107,19 +109,18 @@ export const SettingSidebar = ({
|
||||
};
|
||||
|
||||
const WorkspaceListItem = ({
|
||||
workspace,
|
||||
meta,
|
||||
onClick,
|
||||
isCurrent,
|
||||
isActive,
|
||||
}: {
|
||||
workspace: AllWorkspace;
|
||||
meta: RootWorkspaceMetadata;
|
||||
onClick: () => void;
|
||||
isCurrent: boolean;
|
||||
isActive: boolean;
|
||||
}) => {
|
||||
const [workspaceName] = useBlockSuiteWorkspaceName(
|
||||
workspace.blockSuiteWorkspace ?? null
|
||||
);
|
||||
const workspace = useStaticBlockSuiteWorkspace(meta.id);
|
||||
const [workspaceName] = useBlockSuiteWorkspaceName(workspace);
|
||||
return (
|
||||
<div
|
||||
className={clsx(sidebarSelectItem, { active: isActive })}
|
||||
|
||||
@ -1,16 +1,16 @@
|
||||
import { Suspense, useCallback } from 'react';
|
||||
|
||||
import { getUIAdapter } from '../../../../adapters/workspace';
|
||||
import { usePassiveWorkspaceEffect } from '../../../../hooks/current/use-current-workspace';
|
||||
import { useOnTransformWorkspace } from '../../../../hooks/root/use-on-transform-workspace';
|
||||
import { useWorkspace } from '../../../../hooks/use-workspace';
|
||||
import { useAppHelper } from '../../../../hooks/use-workspaces';
|
||||
import type { AllWorkspace } from '../../../../shared';
|
||||
|
||||
export const WorkspaceSetting = ({
|
||||
workspace,
|
||||
}: {
|
||||
workspace: AllWorkspace;
|
||||
}) => {
|
||||
export const WorkspaceSetting = ({ workspaceId }: { workspaceId: string }) => {
|
||||
const workspace = useWorkspace(workspaceId);
|
||||
usePassiveWorkspaceEffect(workspace.blockSuiteWorkspace);
|
||||
const helper = useAppHelper();
|
||||
|
||||
const { NewSettingsDetail } = getUIAdapter(workspace.flavour);
|
||||
|
||||
const onDeleteWorkspace = useCallback(
|
||||
@ -26,7 +26,7 @@ export const WorkspaceSetting = ({
|
||||
<NewSettingsDetail
|
||||
onTransformWorkspace={onTransformWorkspace}
|
||||
onDeleteWorkspace={onDeleteWorkspace}
|
||||
currentWorkspace={workspace}
|
||||
currentWorkspaceId={workspaceId}
|
||||
/>
|
||||
</Suspense>
|
||||
);
|
||||
|
||||
@ -7,7 +7,7 @@ import {
|
||||
import { rootBlockHubAtom } from '@affine/workspace/atom';
|
||||
import type { EditorContainer } from '@blocksuite/editor';
|
||||
import { assertExists } from '@blocksuite/global/utils';
|
||||
import type { Page } from '@blocksuite/store';
|
||||
import type { Page, Workspace } from '@blocksuite/store';
|
||||
import { useBlockSuitePageMeta } from '@toeverything/hooks/use-block-suite-page-meta';
|
||||
import { useBlockSuiteWorkspacePage } from '@toeverything/hooks/use-block-suite-workspace-page';
|
||||
import { useBlockSuiteWorkspacePageTitle } from '@toeverything/hooks/use-block-suite-workspace-page-title';
|
||||
@ -28,14 +28,13 @@ import { Panel, PanelGroup, PanelResizeHandle } from 'react-resizable-panels';
|
||||
import { pageSettingFamily } from '../atoms';
|
||||
import { contentLayoutAtom } from '../atoms/layout';
|
||||
import { useAppSetting } from '../atoms/settings';
|
||||
import type { AffineOfficialWorkspace } from '../shared';
|
||||
import { BlockSuiteEditor as Editor } from './blocksuite/block-suite-editor';
|
||||
import { editor } from './page-detail-editor.css';
|
||||
import { pluginContainer } from './page-detail-editor.css';
|
||||
|
||||
export type PageDetailEditorProps = {
|
||||
isPublic?: boolean;
|
||||
workspace: AffineOfficialWorkspace;
|
||||
workspace: Workspace;
|
||||
pageId: string;
|
||||
onInit: (page: Page, editor: Readonly<EditorContainer>) => void;
|
||||
onLoad?: (page: Page, editor: EditorContainer) => () => void;
|
||||
@ -53,12 +52,11 @@ const EditorWrapper = memo(function EditorWrapper({
|
||||
() => Object.values(affinePluginsMap),
|
||||
[affinePluginsMap]
|
||||
);
|
||||
const blockSuiteWorkspace = workspace.blockSuiteWorkspace;
|
||||
const page = useBlockSuiteWorkspacePage(blockSuiteWorkspace, pageId);
|
||||
const page = useBlockSuiteWorkspacePage(workspace, pageId);
|
||||
if (!page) {
|
||||
throw new PageNotFoundError(blockSuiteWorkspace, pageId);
|
||||
throw new PageNotFoundError(workspace, pageId);
|
||||
}
|
||||
const meta = useBlockSuitePageMeta(blockSuiteWorkspace).find(
|
||||
const meta = useBlockSuitePageMeta(workspace).find(
|
||||
meta => meta.id === pageId
|
||||
);
|
||||
const pageSettingAtom = pageSettingFamily(pageId);
|
||||
@ -77,7 +75,7 @@ const EditorWrapper = memo(function EditorWrapper({
|
||||
className={clsx(editor, {
|
||||
'full-screen': appSettings?.fullWidthLayout,
|
||||
})}
|
||||
key={`${workspace.flavour}-${workspace.id}-${pageId}`}
|
||||
key={`${workspace.id}-${pageId}`}
|
||||
mode={isPublic ? 'page' : currentMode}
|
||||
page={page}
|
||||
onInit={useCallback(
|
||||
@ -181,12 +179,11 @@ const LayoutPanel = memo(function LayoutPanel(
|
||||
|
||||
export const PageDetailEditor: FC<PageDetailEditorProps> = props => {
|
||||
const { workspace, pageId } = props;
|
||||
const blockSuiteWorkspace = workspace.blockSuiteWorkspace;
|
||||
const page = useBlockSuiteWorkspacePage(blockSuiteWorkspace, pageId);
|
||||
const page = useBlockSuiteWorkspacePage(workspace, pageId);
|
||||
if (!page) {
|
||||
throw new PageNotFoundError(blockSuiteWorkspace, pageId);
|
||||
throw new PageNotFoundError(workspace, pageId);
|
||||
}
|
||||
const title = useBlockSuiteWorkspacePageTitle(blockSuiteWorkspace, pageId);
|
||||
const title = useBlockSuiteWorkspacePageTitle(workspace, pageId);
|
||||
|
||||
const layout = useAtomValue(contentLayoutAtom);
|
||||
const affinePluginsMap = useAtomValue(affinePluginsAtom);
|
||||
|
||||
@ -41,7 +41,7 @@ export const HelpIsland = ({
|
||||
setOpenSettingModalAtom({
|
||||
open: true,
|
||||
activeTab: 'about',
|
||||
workspace: null,
|
||||
workspaceId: null,
|
||||
});
|
||||
}, [setOpenSettingModalAtom]);
|
||||
|
||||
|
||||
@ -1,9 +1,5 @@
|
||||
import { useAFFiNEI18N } from '@affine/i18n/hooks';
|
||||
import {
|
||||
DeleteTemporarilyIcon,
|
||||
FolderIcon,
|
||||
SettingsIcon,
|
||||
} from '@blocksuite/icons';
|
||||
import { DeleteTemporarilyIcon, FolderIcon } from '@blocksuite/icons';
|
||||
import type { FC, SVGProps } from 'react';
|
||||
import { useMemo } from 'react';
|
||||
|
||||
@ -23,11 +19,11 @@ export const useSwitchToConfig = (
|
||||
href: pathGenerator.all(workspaceId),
|
||||
icon: FolderIcon,
|
||||
},
|
||||
{
|
||||
title: t['Workspace Settings'](),
|
||||
href: pathGenerator.setting(workspaceId),
|
||||
icon: SettingsIcon,
|
||||
},
|
||||
// {
|
||||
// title: t['Workspace Settings'](),
|
||||
// href: pathGenerator.setting(workspaceId),
|
||||
// icon: SettingsIcon,
|
||||
// },
|
||||
{
|
||||
title: t['Trash'](),
|
||||
href: pathGenerator.trash(workspaceId),
|
||||
|
||||
@ -14,6 +14,7 @@ import type {
|
||||
} from '@affine/env/workspace';
|
||||
import { WorkspaceFlavour } from '@affine/env/workspace';
|
||||
import { useAFFiNEI18N } from '@affine/i18n/hooks';
|
||||
import type { RootWorkspaceMetadata } from '@affine/workspace/atom';
|
||||
import { HelpIcon, ImportIcon, PlusIcon } from '@blocksuite/icons';
|
||||
import type { DragEndEvent } from '@dnd-kit/core';
|
||||
import { useCallback, useRef } from 'react';
|
||||
@ -40,12 +41,12 @@ import {
|
||||
|
||||
interface WorkspaceModalProps {
|
||||
disabled?: boolean;
|
||||
workspaces: AllWorkspace[];
|
||||
workspaces: RootWorkspaceMetadata[];
|
||||
currentWorkspaceId: AllWorkspace['id'] | null;
|
||||
open: boolean;
|
||||
onClose: () => void;
|
||||
onClickWorkspace: (workspace: AllWorkspace) => void;
|
||||
onClickWorkspaceSetting: (workspace: AllWorkspace) => void;
|
||||
onClickWorkspace: (workspace: RootWorkspaceMetadata['id']) => void;
|
||||
onClickWorkspaceSetting: (workspace: RootWorkspaceMetadata['id']) => void;
|
||||
onNewWorkspace: () => void;
|
||||
onAddWorkspace: () => void;
|
||||
onMoveWorkspace: (activeId: string, overId: string) => void;
|
||||
|
||||
@ -57,7 +57,7 @@ export const WorkspaceSelector: React.FC<WorkspaceSelectorProps> = ({
|
||||
data-testid="workspace-avatar"
|
||||
className={workspaceAvatarStyle}
|
||||
size={40}
|
||||
workspace={currentWorkspace}
|
||||
workspace={currentWorkspace?.blockSuiteWorkspace ?? null}
|
||||
/>
|
||||
<StyledSelectorWrapper>
|
||||
<StyledWorkspaceName data-testid="workspace-name">
|
||||
|
||||
@ -44,7 +44,6 @@ export type RootAppSidebarProps = {
|
||||
paths: {
|
||||
all: (workspaceId: string) => string;
|
||||
trash: (workspaceId: string) => string;
|
||||
setting: (workspaceId: string) => string;
|
||||
shared: (workspaceId: string) => string;
|
||||
};
|
||||
};
|
||||
@ -173,16 +172,6 @@ export const RootAppSidebar = ({
|
||||
>
|
||||
<span data-testid="all-pages">{t['All pages']()}</span>
|
||||
</RouteMenuLinkItem>
|
||||
{!runtimeConfig.enableNewSettingModal && (
|
||||
<RouteMenuLinkItem
|
||||
data-testid="slider-bar-workspace-setting-button"
|
||||
icon={<SettingsIcon />}
|
||||
currentPath={currentPath}
|
||||
path={currentWorkspaceId && paths.setting(currentWorkspaceId)}
|
||||
>
|
||||
<span data-testid="settings">{t['Settings']()}</span>
|
||||
</RouteMenuLinkItem>
|
||||
)}
|
||||
{runtimeConfig.enableNewSettingModal ? (
|
||||
<MenuItem
|
||||
data-testid="slider-bar-workspace-setting-button"
|
||||
|
||||
@ -14,12 +14,13 @@ import type { ReactElement } from 'react';
|
||||
import { useCallback } from 'react';
|
||||
|
||||
import { useGetPageInfoById } from '../hooks/use-get-page-info';
|
||||
import { useWorkspace } from '../hooks/use-workspace';
|
||||
import { BlockSuiteEditorHeader } from './blocksuite/workspace-header';
|
||||
import { filterContainerStyle } from './filter-container.css';
|
||||
import { WorkspaceModeFilterTab, WorkspaceTitle } from './pure/workspace-title';
|
||||
|
||||
export function WorkspaceHeader({
|
||||
currentWorkspace,
|
||||
currentWorkspaceId,
|
||||
currentEntry,
|
||||
}: WorkspaceHeaderProps<WorkspaceFlavour>): ReactElement {
|
||||
const setting = useCollectionManager();
|
||||
@ -31,6 +32,9 @@ export function WorkspaceHeader({
|
||||
},
|
||||
[setting]
|
||||
);
|
||||
|
||||
const currentWorkspace = useWorkspace(currentWorkspaceId);
|
||||
|
||||
const getPageInfoById = useGetPageInfoById();
|
||||
if ('subPath' in currentEntry) {
|
||||
if (currentEntry.subPath === WorkspaceSubPath.ALL) {
|
||||
|
||||
@ -3,14 +3,7 @@
|
||||
*/
|
||||
import 'fake-indexeddb/auto';
|
||||
|
||||
import assert from 'node:assert';
|
||||
|
||||
import type { WorkspaceAdapter } from '@affine/env/workspace';
|
||||
import { WorkspaceFlavour, WorkspaceSubPath } from '@affine/env/workspace';
|
||||
import {
|
||||
rootCurrentWorkspaceIdAtom,
|
||||
workspaceAdaptersAtom,
|
||||
} from '@affine/workspace/atom';
|
||||
import { WorkspaceSubPath } from '@affine/env/workspace';
|
||||
import type { PageBlockModel } from '@blocksuite/blocks';
|
||||
import { __unstableSchemas, AffineSchemas } from '@blocksuite/blocks/models';
|
||||
import { assertExists } from '@blocksuite/global/utils';
|
||||
@ -20,18 +13,12 @@ import {
|
||||
useBlockSuitePageMeta,
|
||||
usePageMetaHelper,
|
||||
} from '@toeverything/hooks/use-block-suite-page-meta';
|
||||
import { createStore, Provider } from 'jotai';
|
||||
import routerMock from 'next-router-mock';
|
||||
import { createDynamicRouteParser } from 'next-router-mock/dynamic-routes';
|
||||
import type React from 'react';
|
||||
import { beforeAll, beforeEach, describe, expect, test, vi } from 'vitest';
|
||||
|
||||
import { WorkspaceAdapters } from '../../adapters/workspace';
|
||||
import { workspacesAtom } from '../../atoms';
|
||||
import { rootCurrentWorkspaceAtom } from '../../atoms/root';
|
||||
import { BlockSuiteWorkspace } from '../../shared';
|
||||
import { useCurrentWorkspace } from '../current/use-current-workspace';
|
||||
import { useAppHelper, useWorkspaces } from '../use-workspaces';
|
||||
|
||||
vi.mock(
|
||||
'../../components/blocksuite/header/editor-mode-switch/CustomLottie',
|
||||
@ -56,28 +43,6 @@ beforeEach(() => {
|
||||
localStorage.clear();
|
||||
});
|
||||
|
||||
async function getJotaiContext() {
|
||||
const store = createStore();
|
||||
store.set(
|
||||
workspaceAdaptersAtom,
|
||||
WorkspaceAdapters as Record<
|
||||
WorkspaceFlavour,
|
||||
WorkspaceAdapter<WorkspaceFlavour>
|
||||
>
|
||||
);
|
||||
const ProviderWrapper: React.FC<React.PropsWithChildren> =
|
||||
function ProviderWrapper({ children }) {
|
||||
return <Provider store={store}>{children}</Provider>;
|
||||
};
|
||||
const workspaces = await store.get(workspacesAtom);
|
||||
expect(workspaces.length).toBe(1);
|
||||
return {
|
||||
store,
|
||||
ProviderWrapper,
|
||||
initialWorkspaces: workspaces,
|
||||
} as const;
|
||||
}
|
||||
|
||||
beforeEach(async () => {
|
||||
blockSuiteWorkspace = new BlockSuiteWorkspace({ id: 'test' })
|
||||
.register(AffineSchemas)
|
||||
@ -163,67 +128,3 @@ describe('usePageMetas', async () => {
|
||||
expect(result.current[0].title).toBe('test');
|
||||
});
|
||||
});
|
||||
|
||||
describe('useWorkspacesHelper', () => {
|
||||
test('basic', async () => {
|
||||
const { ProviderWrapper, store } = await getJotaiContext();
|
||||
const workspaceHelperHook = renderHook(() => useAppHelper(), {
|
||||
wrapper: ProviderWrapper,
|
||||
});
|
||||
const id = await workspaceHelperHook.result.current.createLocalWorkspace(
|
||||
'test'
|
||||
);
|
||||
const workspaces = await store.get(workspacesAtom);
|
||||
expect(workspaces.length).toBe(2);
|
||||
expect(workspaces[1].id).toBe(id);
|
||||
const workspacesHook = renderHook(() => useWorkspaces(), {
|
||||
wrapper: ProviderWrapper,
|
||||
});
|
||||
store.set(rootCurrentWorkspaceIdAtom, workspacesHook.result.current[1].id);
|
||||
await store.get(rootCurrentWorkspaceAtom);
|
||||
const currentWorkspaceHook = renderHook(() => useCurrentWorkspace(), {
|
||||
wrapper: ProviderWrapper,
|
||||
});
|
||||
currentWorkspaceHook.result.current[1](workspacesHook.result.current[1].id);
|
||||
});
|
||||
});
|
||||
|
||||
describe('useWorkspaces', () => {
|
||||
test('basic', async () => {
|
||||
const { ProviderWrapper } = await getJotaiContext();
|
||||
const { result } = renderHook(() => useWorkspaces(), {
|
||||
wrapper: ProviderWrapper,
|
||||
});
|
||||
expect(result.current).toEqual([
|
||||
{
|
||||
id: expect.stringContaining(''),
|
||||
flavour: WorkspaceFlavour.LOCAL,
|
||||
blockSuiteWorkspace: expect.anything(),
|
||||
},
|
||||
]);
|
||||
});
|
||||
|
||||
test('mutation', async () => {
|
||||
const { ProviderWrapper, store } = await getJotaiContext();
|
||||
const { result } = renderHook(() => useAppHelper(), {
|
||||
wrapper: ProviderWrapper,
|
||||
});
|
||||
{
|
||||
const workspaces = await store.get(workspacesAtom);
|
||||
expect(workspaces.length).toEqual(1);
|
||||
}
|
||||
await result.current.createLocalWorkspace('test');
|
||||
{
|
||||
const workspaces = await store.get(workspacesAtom);
|
||||
expect(workspaces.length).toEqual(2);
|
||||
}
|
||||
const { result: result2 } = renderHook(() => useWorkspaces(), {
|
||||
wrapper: ProviderWrapper,
|
||||
});
|
||||
expect(result2.current.length).toEqual(2);
|
||||
const secondWorkspace = result2.current[1];
|
||||
expect(secondWorkspace.flavour).toBe('local');
|
||||
assert(secondWorkspace.flavour === WorkspaceFlavour.LOCAL);
|
||||
expect(secondWorkspace.blockSuiteWorkspace.meta.name).toBe('test');
|
||||
});
|
||||
});
|
||||
|
||||
@ -1,26 +1,47 @@
|
||||
import { isBrowser } from '@affine/env/constant';
|
||||
import {
|
||||
rootCurrentPageIdAtom,
|
||||
rootCurrentWorkspaceIdAtom,
|
||||
} from '@affine/workspace/atom';
|
||||
import { useAtom, useAtomValue } from 'jotai';
|
||||
import { useCallback } from 'react';
|
||||
import { assertExists } from '@blocksuite/global/utils';
|
||||
import type { PassiveDocProvider, Workspace } from '@blocksuite/store';
|
||||
import { useAtom, useSetAtom } from 'jotai';
|
||||
import { useCallback, useEffect } from 'react';
|
||||
|
||||
import { rootCurrentWorkspaceAtom } from '../../atoms/root';
|
||||
import type { AllWorkspace } from '../../shared';
|
||||
import { useWorkspace } from '../use-workspace';
|
||||
|
||||
declare global {
|
||||
/**
|
||||
* @internal debug only
|
||||
*/
|
||||
// eslint-disable-next-line no-var
|
||||
var currentWorkspace: AllWorkspace | undefined;
|
||||
interface WindowEventMap {
|
||||
'affine:workspace:change': CustomEvent<{ id: string }>;
|
||||
}
|
||||
}
|
||||
|
||||
export function useCurrentWorkspace(): [
|
||||
AllWorkspace,
|
||||
(id: string | null) => void,
|
||||
] {
|
||||
const currentWorkspace = useAtomValue(rootCurrentWorkspaceAtom);
|
||||
const [, setId] = useAtom(rootCurrentWorkspaceIdAtom);
|
||||
const [, setPageId] = useAtom(rootCurrentPageIdAtom);
|
||||
const [id, setId] = useAtom(rootCurrentWorkspaceIdAtom);
|
||||
assertExists(id);
|
||||
const currentWorkspace = useWorkspace(id);
|
||||
useEffect(() => {
|
||||
globalThis.currentWorkspace = currentWorkspace;
|
||||
globalThis.dispatchEvent(
|
||||
new CustomEvent('affine:workspace:change', {
|
||||
detail: { id: currentWorkspace.id },
|
||||
})
|
||||
);
|
||||
}, [currentWorkspace]);
|
||||
const setPageId = useSetAtom(rootCurrentPageIdAtom);
|
||||
return [
|
||||
currentWorkspace,
|
||||
useCallback(
|
||||
(id: string | null) => {
|
||||
if (isBrowser && id) {
|
||||
if (environment.isBrowser && id) {
|
||||
localStorage.setItem('last_workspace_id', id);
|
||||
}
|
||||
setPageId(null);
|
||||
@ -30,3 +51,27 @@ export function useCurrentWorkspace(): [
|
||||
),
|
||||
];
|
||||
}
|
||||
|
||||
const activeWorkspaceWeakMap = new WeakMap<Workspace, boolean>();
|
||||
|
||||
export function usePassiveWorkspaceEffect(workspace: Workspace) {
|
||||
useEffect(() => {
|
||||
if (activeWorkspaceWeakMap.get(workspace) === true) {
|
||||
return;
|
||||
}
|
||||
const providers = workspace.providers.filter(
|
||||
(provider): provider is PassiveDocProvider =>
|
||||
'passive' in provider && provider.passive === true
|
||||
);
|
||||
providers.forEach(provider => {
|
||||
provider.connect();
|
||||
});
|
||||
activeWorkspaceWeakMap.set(workspace, true);
|
||||
return () => {
|
||||
providers.forEach(provider => {
|
||||
provider.disconnect();
|
||||
});
|
||||
activeWorkspaceWeakMap.delete(workspace);
|
||||
};
|
||||
}, [workspace]);
|
||||
}
|
||||
|
||||
@ -4,10 +4,10 @@ import { useAtomValue } from 'jotai';
|
||||
import { useMemo } from 'react';
|
||||
|
||||
import { pageSettingsAtom } from '../atoms';
|
||||
import { rootCurrentWorkspaceAtom } from '../atoms/root';
|
||||
import { useCurrentWorkspace } from './current/use-current-workspace';
|
||||
|
||||
export const useGetPageInfoById = (): GetPageInfoById => {
|
||||
const currentWorkspace = useAtomValue(rootCurrentWorkspaceAtom);
|
||||
const [currentWorkspace] = useCurrentWorkspace();
|
||||
const pageMetas = useBlockSuitePageMeta(currentWorkspace.blockSuiteWorkspace);
|
||||
const pageMap = useMemo(
|
||||
() => Object.fromEntries(pageMetas.map(page => [page.id, page])),
|
||||
|
||||
36
apps/web/src/hooks/use-workspace.ts
Normal file
36
apps/web/src/hooks/use-workspace.ts
Normal file
@ -0,0 +1,36 @@
|
||||
import { rootWorkspacesMetadataAtom } from '@affine/workspace/atom';
|
||||
import { useStaticBlockSuiteWorkspace } from '@affine/workspace/utils';
|
||||
import { assertExists } from '@blocksuite/global/utils';
|
||||
import type { Workspace } from '@blocksuite/store';
|
||||
import type { Atom } from 'jotai';
|
||||
import { atom, useAtomValue } from 'jotai';
|
||||
|
||||
import type { AffineOfficialWorkspace } from '../shared';
|
||||
|
||||
const workspaceWeakMap = new WeakMap<
|
||||
Workspace,
|
||||
Atom<Promise<AffineOfficialWorkspace>>
|
||||
>();
|
||||
|
||||
export function useWorkspace(workspaceId: string): AffineOfficialWorkspace {
|
||||
const blockSuiteWorkspace = useStaticBlockSuiteWorkspace(workspaceId);
|
||||
if (!workspaceWeakMap.has(blockSuiteWorkspace)) {
|
||||
const baseAtom = atom(async get => {
|
||||
const metadata = await get(rootWorkspacesMetadataAtom);
|
||||
const flavour = metadata.find(({ id }) => id === workspaceId)?.flavour;
|
||||
assertExists(flavour);
|
||||
return {
|
||||
id: workspaceId,
|
||||
flavour,
|
||||
blockSuiteWorkspace,
|
||||
};
|
||||
});
|
||||
workspaceWeakMap.set(blockSuiteWorkspace, baseAtom);
|
||||
}
|
||||
|
||||
return useAtomValue(
|
||||
workspaceWeakMap.get(blockSuiteWorkspace) as Atom<
|
||||
Promise<AffineOfficialWorkspace>
|
||||
>
|
||||
);
|
||||
}
|
||||
@ -2,19 +2,16 @@ import { DebugLogger } from '@affine/debug';
|
||||
import { WorkspaceFlavour, WorkspaceVersion } from '@affine/env/workspace';
|
||||
import { rootWorkspacesMetadataAtom } from '@affine/workspace/atom';
|
||||
import { saveWorkspaceToLocalStorage } from '@affine/workspace/local/crud';
|
||||
import { createEmptyBlockSuiteWorkspace } from '@affine/workspace/utils';
|
||||
import {
|
||||
createEmptyBlockSuiteWorkspace,
|
||||
getWorkspace,
|
||||
} from '@affine/workspace/utils';
|
||||
import { nanoid } from '@blocksuite/store';
|
||||
import { useAtomValue, useSetAtom } from 'jotai';
|
||||
import { useCallback } from 'react';
|
||||
|
||||
import { LocalAdapter } from '../adapters/local';
|
||||
import { WorkspaceAdapters } from '../adapters/workspace';
|
||||
import { workspacesAtom } from '../atoms';
|
||||
import type { AllWorkspace } from '../shared';
|
||||
|
||||
export function useWorkspaces(): AllWorkspace[] {
|
||||
return useAtomValue(workspacesAtom);
|
||||
}
|
||||
|
||||
const logger = new DebugLogger('use-workspaces');
|
||||
|
||||
@ -22,12 +19,12 @@ const logger = new DebugLogger('use-workspaces');
|
||||
* This hook has the permission to all workspaces. Be careful when using it.
|
||||
*/
|
||||
export function useAppHelper() {
|
||||
const workspaces = useWorkspaces();
|
||||
const jotaiWorkspaces = useAtomValue(rootWorkspacesMetadataAtom);
|
||||
const set = useSetAtom(rootWorkspacesMetadataAtom);
|
||||
return {
|
||||
addLocalWorkspace: useCallback(
|
||||
async (workspaceId: string): Promise<string> => {
|
||||
createEmptyBlockSuiteWorkspace(workspaceId, WorkspaceFlavour.LOCAL);
|
||||
saveWorkspaceToLocalStorage(workspaceId);
|
||||
await set(workspaces => [
|
||||
...workspaces,
|
||||
@ -68,20 +65,20 @@ export function useAppHelper() {
|
||||
const targetJotaiWorkspace = jotaiWorkspaces.find(
|
||||
ws => ws.id === workspaceId
|
||||
);
|
||||
const targetWorkspace = workspaces.find(ws => ws.id === workspaceId);
|
||||
if (!targetJotaiWorkspace || !targetWorkspace) {
|
||||
if (!targetJotaiWorkspace) {
|
||||
throw new Error('page cannot be found');
|
||||
}
|
||||
|
||||
const targetWorkspace = getWorkspace(targetJotaiWorkspace.id);
|
||||
|
||||
// delete workspace from plugin
|
||||
await WorkspaceAdapters[targetWorkspace.flavour].CRUD.delete(
|
||||
// fixme: type casting
|
||||
targetWorkspace as any
|
||||
await WorkspaceAdapters[targetJotaiWorkspace.flavour].CRUD.delete(
|
||||
targetWorkspace
|
||||
);
|
||||
// delete workspace from jotai storage
|
||||
await set(workspaces => workspaces.filter(ws => ws.id !== workspaceId));
|
||||
},
|
||||
[jotaiWorkspaces, set, workspaces]
|
||||
[jotaiWorkspaces, set]
|
||||
),
|
||||
};
|
||||
}
|
||||
|
||||
@ -20,7 +20,6 @@ import {
|
||||
rootWorkspacesMetadataAtom,
|
||||
} from '@affine/workspace/atom';
|
||||
import { assertEquals, assertExists } from '@blocksuite/global/utils';
|
||||
import type { PassiveDocProvider } from '@blocksuite/store';
|
||||
import { nanoid } from '@blocksuite/store';
|
||||
import type { DragEndEvent } from '@dnd-kit/core';
|
||||
import {
|
||||
@ -55,10 +54,12 @@ import {
|
||||
RootAppSidebar,
|
||||
} from '../components/root-app-sidebar';
|
||||
import { useBlockSuiteMetaHelper } from '../hooks/affine/use-block-suite-meta-helper';
|
||||
import { useCurrentWorkspace } from '../hooks/current/use-current-workspace';
|
||||
import {
|
||||
useCurrentWorkspace,
|
||||
usePassiveWorkspaceEffect,
|
||||
} from '../hooks/current/use-current-workspace';
|
||||
import { useRouterHelper } from '../hooks/use-router-helper';
|
||||
import { useRouterTitle } from '../hooks/use-router-title';
|
||||
import { useWorkspaces } from '../hooks/use-workspaces';
|
||||
import {
|
||||
AllWorkspaceModals,
|
||||
CurrentWorkspaceModals,
|
||||
@ -96,13 +97,6 @@ export const QuickSearch: FC = () => {
|
||||
);
|
||||
};
|
||||
|
||||
export const AllWorkspaceContext = ({
|
||||
children,
|
||||
}: PropsWithChildren): ReactElement => {
|
||||
useWorkspaces();
|
||||
return <>{children}</>;
|
||||
};
|
||||
|
||||
declare global {
|
||||
// eslint-disable-next-line no-var
|
||||
var HALTING_PROBLEM_TIMEOUT: number;
|
||||
@ -166,13 +160,11 @@ export const WorkspaceLayout: FC<PropsWithChildren> =
|
||||
<>
|
||||
{/* load all workspaces is costly, do not block the whole UI */}
|
||||
<Suspense fallback={null}>
|
||||
<AllWorkspaceContext>
|
||||
<AllWorkspaceModals />
|
||||
<CurrentWorkspaceContext>
|
||||
{/* fixme(himself65): don't re-render whole modals */}
|
||||
<CurrentWorkspaceModals key={currentWorkspaceId} />
|
||||
</CurrentWorkspaceContext>
|
||||
</AllWorkspaceContext>
|
||||
<AllWorkspaceModals />
|
||||
<CurrentWorkspaceContext>
|
||||
{/* fixme(himself65): don't re-render whole modals */}
|
||||
<CurrentWorkspaceModals key={currentWorkspaceId} />
|
||||
</CurrentWorkspaceContext>
|
||||
</Suspense>
|
||||
<CurrentWorkspaceContext>
|
||||
<Suspense fallback={<WorkspaceFallback />}>
|
||||
@ -223,36 +215,24 @@ export const WorkspaceLayoutInner: FC<PropsWithChildren> = ({ children }) => {
|
||||
}
|
||||
//#endregion
|
||||
|
||||
if (currentPageId) {
|
||||
const pageExist =
|
||||
currentWorkspace.blockSuiteWorkspace.getPage(currentPageId);
|
||||
if (router.pathname === '/[workspaceId]/[pageId]' && !pageExist) {
|
||||
router.push('/404').catch(console.error);
|
||||
}
|
||||
} else if (
|
||||
router.pathname === '/[workspaceId]/[pageId]' &&
|
||||
//#region check if page is valid
|
||||
if (
|
||||
typeof router.query.pageId === 'string' &&
|
||||
router.query.pageId !== currentPageId
|
||||
router.pathname === '/workspace/[workspaceId]/[pageId]' &&
|
||||
currentPageId
|
||||
) {
|
||||
setCurrentPageId(router.query.pageId);
|
||||
jumpToPage(currentWorkspace.id, router.query.pageId).catch(console.error);
|
||||
if (currentPageId !== router.query.pageId) {
|
||||
setCurrentPageId(router.query.pageId);
|
||||
} else {
|
||||
const page = currentWorkspace.blockSuiteWorkspace.getPage(currentPageId);
|
||||
if (!page) {
|
||||
router.push('/404').catch(console.error);
|
||||
}
|
||||
}
|
||||
}
|
||||
//#endregion
|
||||
|
||||
useEffect(() => {
|
||||
const backgroundProviders =
|
||||
currentWorkspace.blockSuiteWorkspace.providers.filter(
|
||||
(provider): provider is PassiveDocProvider =>
|
||||
'passive' in provider && provider.passive
|
||||
);
|
||||
backgroundProviders.forEach(provider => {
|
||||
provider.connect();
|
||||
});
|
||||
return () => {
|
||||
backgroundProviders.forEach(provider => {
|
||||
provider.disconnect();
|
||||
});
|
||||
};
|
||||
}, [currentWorkspace]);
|
||||
usePassiveWorkspaceEffect(currentWorkspace.blockSuiteWorkspace);
|
||||
|
||||
useEffect(() => {
|
||||
const page = currentWorkspace.blockSuiteWorkspace.getPage(
|
||||
@ -303,7 +283,7 @@ export const WorkspaceLayoutInner: FC<PropsWithChildren> = ({ children }) => {
|
||||
const handleOpenSettingModal = useCallback(() => {
|
||||
setOpenSettingModalAtom({
|
||||
activeTab: 'appearance',
|
||||
workspace: null,
|
||||
workspaceId: null,
|
||||
open: true,
|
||||
});
|
||||
}, [setOpenSettingModalAtom]);
|
||||
|
||||
@ -1,10 +1,13 @@
|
||||
import { Button, displayFlex, styled } from '@affine/component';
|
||||
import { WorkspaceSubPath } from '@affine/env/workspace';
|
||||
import { useAFFiNEI18N } from '@affine/i18n/hooks';
|
||||
import Head from 'next/head';
|
||||
import Image from 'next/legacy/image';
|
||||
import { useRouter } from 'next/router';
|
||||
import React from 'react';
|
||||
|
||||
import { useRouterHelper } from '../hooks/use-router-helper';
|
||||
|
||||
export const StyledContainer = styled('div')(() => {
|
||||
return {
|
||||
...displayFlex('center', 'center'),
|
||||
@ -26,6 +29,7 @@ export const StyledContainer = styled('div')(() => {
|
||||
export const NotfoundPage = () => {
|
||||
const t = useAFFiNEI18N();
|
||||
const router = useRouter();
|
||||
const { jumpToSubPath } = useRouterHelper(router);
|
||||
return (
|
||||
<StyledContainer data-testid="notFound">
|
||||
<Image alt="404" src="/imgs/invite-error.svg" width={360} height={270} />
|
||||
@ -34,7 +38,12 @@ export const NotfoundPage = () => {
|
||||
<Button
|
||||
shape="round"
|
||||
onClick={() => {
|
||||
router.push('/').catch(err => console.error(err));
|
||||
const id = localStorage.getItem('last_workspace_id');
|
||||
if (id) {
|
||||
jumpToSubPath(id, WorkspaceSubPath.ALL).catch(console.error);
|
||||
} else {
|
||||
router.push('/').catch(err => console.error(err));
|
||||
}
|
||||
}}
|
||||
>
|
||||
{t['Back Home']()}
|
||||
|
||||
@ -1,22 +1,33 @@
|
||||
import { WorkspaceFallback } from '@affine/component/workspace';
|
||||
import { DebugLogger } from '@affine/debug';
|
||||
import { WorkspaceSubPath } from '@affine/env/workspace';
|
||||
import { rootWorkspacesMetadataAtom } from '@affine/workspace/atom';
|
||||
import { getWorkspace } from '@affine/workspace/utils';
|
||||
import { useAtomValue } from 'jotai';
|
||||
import type { NextPage } from 'next';
|
||||
import { useRouter } from 'next/router';
|
||||
import { Suspense, useEffect } from 'react';
|
||||
|
||||
import { PageLoading } from '../components/pure/loading';
|
||||
import { RouteLogic, useRouterHelper } from '../hooks/use-router-helper';
|
||||
import { useAppHelper, useWorkspaces } from '../hooks/use-workspaces';
|
||||
import { AllWorkspaceContext } from '../layouts/workspace-layout';
|
||||
import { useWorkspace } from '../hooks/use-workspace';
|
||||
import { useAppHelper } from '../hooks/use-workspaces';
|
||||
import { AllWorkspaceModals } from '../providers/modal-provider';
|
||||
|
||||
const logger = new DebugLogger('index-page');
|
||||
const logger = new DebugLogger('index:router');
|
||||
|
||||
type AllWorkspaceLoaderProps = {
|
||||
id: string;
|
||||
};
|
||||
|
||||
const WorkspaceLoader = (props: AllWorkspaceLoaderProps): null => {
|
||||
useWorkspace(props.id);
|
||||
return null;
|
||||
};
|
||||
|
||||
const IndexPageInner = () => {
|
||||
const router = useRouter();
|
||||
const { jumpToPage, jumpToSubPath } = useRouterHelper(router);
|
||||
const workspaces = useWorkspaces();
|
||||
const meta = useAtomValue(rootWorkspacesMetadataAtom);
|
||||
const helper = useAppHelper();
|
||||
|
||||
useEffect(() => {
|
||||
@ -25,15 +36,14 @@ const IndexPageInner = () => {
|
||||
}
|
||||
const lastId = localStorage.getItem('last_workspace_id');
|
||||
const lastPageId = localStorage.getItem('last_page_id');
|
||||
const targetWorkspace =
|
||||
(lastId && workspaces.find(({ id }) => id === lastId)) ||
|
||||
workspaces.at(0);
|
||||
|
||||
if (targetWorkspace) {
|
||||
const nonTrashPages =
|
||||
targetWorkspace.blockSuiteWorkspace.meta.pageMetas.filter(
|
||||
({ trash }) => !trash
|
||||
);
|
||||
const target =
|
||||
(lastId && meta.find(({ id }) => id === lastId)) || meta.at(0);
|
||||
if (target) {
|
||||
const targetWorkspace = getWorkspace(target.id);
|
||||
const nonTrashPages = targetWorkspace.meta.pageMetas.filter(
|
||||
({ trash }) => !trash
|
||||
);
|
||||
const pageId =
|
||||
nonTrashPages.find(({ id }) => id === lastPageId)?.id ??
|
||||
nonTrashPages.at(0)?.id;
|
||||
@ -56,38 +66,38 @@ const IndexPageInner = () => {
|
||||
console.error(err);
|
||||
});
|
||||
}, 1000);
|
||||
const dispose =
|
||||
targetWorkspace.blockSuiteWorkspace.slots.pageAdded.once(pageId => {
|
||||
clearTimeout(clearId);
|
||||
jumpToPage(targetWorkspace.id, pageId, RouteLogic.REPLACE).catch(
|
||||
err => {
|
||||
console.error(err);
|
||||
}
|
||||
);
|
||||
});
|
||||
const dispose = targetWorkspace.slots.pageAdded.once(pageId => {
|
||||
clearTimeout(clearId);
|
||||
jumpToPage(targetWorkspace.id, pageId, RouteLogic.REPLACE).catch(
|
||||
err => {
|
||||
console.error(err);
|
||||
}
|
||||
);
|
||||
});
|
||||
return () => {
|
||||
clearTimeout(clearId);
|
||||
dispose.dispose();
|
||||
};
|
||||
}
|
||||
} else {
|
||||
console.warn('No target workspace. This should not happen in production');
|
||||
console.warn('No workspace found');
|
||||
}
|
||||
return;
|
||||
}, [helper, jumpToPage, jumpToSubPath, router, workspaces]);
|
||||
}, [meta, helper, jumpToPage, jumpToSubPath, router]);
|
||||
|
||||
return (
|
||||
<Suspense fallback={<WorkspaceFallback />}>
|
||||
<AllWorkspaceContext>
|
||||
<AllWorkspaceModals />
|
||||
</AllWorkspaceContext>
|
||||
</Suspense>
|
||||
<>
|
||||
{meta.map(({ id }) => (
|
||||
<WorkspaceLoader key={id} id={id} />
|
||||
))}
|
||||
<AllWorkspaceModals />
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
const IndexPage: NextPage = () => {
|
||||
return (
|
||||
<Suspense fallback={<PageLoading />}>
|
||||
<Suspense fallback={<WorkspaceFallback />}>
|
||||
<IndexPageInner />
|
||||
</Suspense>
|
||||
);
|
||||
|
||||
@ -8,7 +8,6 @@ import { rootCurrentPageIdAtom } from '@affine/workspace/atom';
|
||||
import type { EditorContainer } from '@blocksuite/editor';
|
||||
import { assertExists } from '@blocksuite/global/utils';
|
||||
import type { Page } from '@blocksuite/store';
|
||||
import { useBlockSuiteWorkspacePage } from '@toeverything/hooks/use-block-suite-workspace-page';
|
||||
import { useAtom, useAtomValue } from 'jotai';
|
||||
import { useRouter } from 'next/router';
|
||||
import type React from 'react';
|
||||
@ -16,7 +15,6 @@ import { useCallback } from 'react';
|
||||
|
||||
import { getUIAdapter } from '../../../adapters/workspace';
|
||||
import { pageSettingFamily } from '../../../atoms';
|
||||
import { rootCurrentWorkspaceAtom } from '../../../atoms/root';
|
||||
import { useCurrentWorkspace } from '../../../hooks/current/use-current-workspace';
|
||||
import { useRouterHelper } from '../../../hooks/use-router-helper';
|
||||
import { WorkspaceLayout } from '../../../layouts/workspace-layout';
|
||||
@ -65,13 +63,13 @@ const WorkspaceDetail: React.FC = () => {
|
||||
return (
|
||||
<>
|
||||
<Header
|
||||
currentWorkspace={currentWorkspace}
|
||||
currentWorkspaceId={currentWorkspace.id}
|
||||
currentEntry={{
|
||||
pageId: currentPageId,
|
||||
}}
|
||||
/>
|
||||
<PageDetail
|
||||
currentWorkspace={currentWorkspace}
|
||||
currentWorkspaceId={currentWorkspace.id}
|
||||
currentPageId={currentPageId}
|
||||
onLoadEditor={onLoad}
|
||||
/>
|
||||
@ -81,12 +79,11 @@ const WorkspaceDetail: React.FC = () => {
|
||||
|
||||
const WorkspaceDetailPage: NextPageWithLayout = () => {
|
||||
const router = useRouter();
|
||||
const currentWorkspace = useAtomValue(rootCurrentWorkspaceAtom);
|
||||
const [currentWorkspace] = useCurrentWorkspace();
|
||||
const currentPageId = useAtomValue(rootCurrentPageIdAtom);
|
||||
const page = useBlockSuiteWorkspacePage(
|
||||
currentWorkspace.blockSuiteWorkspace,
|
||||
currentPageId
|
||||
);
|
||||
const page = currentPageId
|
||||
? currentWorkspace.blockSuiteWorkspace.getPage(currentPageId)
|
||||
: null;
|
||||
if (!router.isReady) {
|
||||
return <PageDetailSkeleton key="router-not-ready" />;
|
||||
} else if (!currentPageId || !page) {
|
||||
|
||||
@ -45,7 +45,7 @@ const AllPage: NextPageWithLayout = () => {
|
||||
<title>{t['All pages']()} - AFFiNE</title>
|
||||
</Head>
|
||||
<Header
|
||||
currentWorkspace={currentWorkspace}
|
||||
currentWorkspaceId={currentWorkspace.id}
|
||||
currentEntry={{
|
||||
subPath: WorkspaceSubPath.ALL,
|
||||
}}
|
||||
|
||||
@ -40,7 +40,7 @@ const SharedPages: NextPageWithLayout = () => {
|
||||
<title>{t['Shared Pages']()} - AFFiNE</title>
|
||||
</Head>
|
||||
<Header
|
||||
currentWorkspace={currentWorkspace}
|
||||
currentWorkspaceId={currentWorkspace.id}
|
||||
currentEntry={{
|
||||
subPath: WorkspaceSubPath.SHARED,
|
||||
}}
|
||||
|
||||
@ -44,7 +44,7 @@ const TrashPage: NextPageWithLayout = () => {
|
||||
<title>{t['Trash']()} - AFFiNE</title>
|
||||
</Head>
|
||||
<Header
|
||||
currentWorkspace={currentWorkspace}
|
||||
currentWorkspaceId={currentWorkspace.id}
|
||||
currentEntry={{
|
||||
subPath: WorkspaceSubPath.TRASH,
|
||||
}}
|
||||
|
||||
@ -5,7 +5,7 @@ import {
|
||||
} from '@affine/workspace/atom';
|
||||
import { assertExists } from '@blocksuite/global/utils';
|
||||
import { arrayMove } from '@dnd-kit/sortable';
|
||||
import { useAtom, useSetAtom } from 'jotai';
|
||||
import { useAtom, useAtomValue, useSetAtom } from 'jotai';
|
||||
import { useRouter } from 'next/router';
|
||||
import type { FC, ReactElement } from 'react';
|
||||
import { lazy, Suspense, useCallback, useTransition } from 'react';
|
||||
@ -20,8 +20,6 @@ import {
|
||||
} from '../atoms';
|
||||
import { useCurrentWorkspace } from '../hooks/current/use-current-workspace';
|
||||
import { useRouterHelper } from '../hooks/use-router-helper';
|
||||
import { useWorkspaces } from '../hooks/use-workspaces';
|
||||
import type { AllWorkspace } from '../shared';
|
||||
|
||||
const SettingModal = lazy(() =>
|
||||
import('../components/affine/setting-modal').then(module => ({
|
||||
@ -57,16 +55,16 @@ const OnboardingModal = lazy(() =>
|
||||
|
||||
export const Setting: FC = () => {
|
||||
const [currentWorkspace] = useCurrentWorkspace();
|
||||
const [{ open, workspace, activeTab }, setOpenSettingModalAtom] =
|
||||
const [{ open, workspaceId, activeTab }, setOpenSettingModalAtom] =
|
||||
useAtom(openSettingModalAtom);
|
||||
assertExists(currentWorkspace);
|
||||
|
||||
const onSettingClick = useCallback(
|
||||
({
|
||||
activeTab,
|
||||
workspace,
|
||||
}: Pick<SettingAtom, 'activeTab' | 'workspace'>) => {
|
||||
setOpenSettingModalAtom(prev => ({ ...prev, activeTab, workspace }));
|
||||
workspaceId,
|
||||
}: Pick<SettingAtom, 'activeTab' | 'workspaceId'>) => {
|
||||
setOpenSettingModalAtom(prev => ({ ...prev, activeTab, workspaceId }));
|
||||
},
|
||||
[setOpenSettingModalAtom]
|
||||
);
|
||||
@ -75,7 +73,7 @@ export const Setting: FC = () => {
|
||||
<SettingModal
|
||||
open={open}
|
||||
activeTab={activeTab}
|
||||
workspace={workspace}
|
||||
workspaceId={workspaceId}
|
||||
onSettingClick={onSettingClick}
|
||||
setOpen={useCallback(
|
||||
open => {
|
||||
@ -132,7 +130,7 @@ export const AllWorkspaceModals = (): ReactElement => {
|
||||
|
||||
const router = useRouter();
|
||||
const { jumpToSubPath } = useRouterHelper(router);
|
||||
const workspaces = useWorkspaces();
|
||||
const workspaces = useAtomValue(rootWorkspacesMetadataAtom);
|
||||
const setWorkspaces = useSetAtom(rootWorkspacesMetadataAtom);
|
||||
const [currentWorkspaceId, setCurrentWorkspaceId] = useAtom(
|
||||
rootCurrentWorkspaceIdAtom
|
||||
@ -141,13 +139,13 @@ export const AllWorkspaceModals = (): ReactElement => {
|
||||
const [, setOpenSettingModalAtom] = useAtom(openSettingModalAtom);
|
||||
|
||||
const handleOpenSettingModal = useCallback(
|
||||
(workspace: AllWorkspace) => {
|
||||
(workspaceId: string) => {
|
||||
setOpenWorkspacesModal(false);
|
||||
|
||||
setOpenSettingModalAtom({
|
||||
open: true,
|
||||
activeTab: 'workspace',
|
||||
workspace,
|
||||
workspaceId,
|
||||
});
|
||||
},
|
||||
[setOpenSettingModalAtom, setOpenWorkspacesModal]
|
||||
@ -179,10 +177,10 @@ export const AllWorkspaceModals = (): ReactElement => {
|
||||
[setWorkspaces, workspaces]
|
||||
)}
|
||||
onClickWorkspace={useCallback(
|
||||
workspace => {
|
||||
workspaceId => {
|
||||
setOpenWorkspacesModal(false);
|
||||
setCurrentWorkspaceId(workspace.id);
|
||||
jumpToSubPath(workspace.id, WorkspaceSubPath.ALL).catch(error => {
|
||||
setCurrentWorkspaceId(workspaceId);
|
||||
jumpToSubPath(workspaceId, WorkspaceSubPath.ALL).catch(error => {
|
||||
console.error(error);
|
||||
});
|
||||
},
|
||||
|
||||
@ -26,14 +26,12 @@ export type NextPageWithLayout<P = Record<string, unknown>, IP = P> = NextPage<
|
||||
|
||||
export enum WorkspaceSubPath {
|
||||
ALL = 'all',
|
||||
SETTING = 'setting',
|
||||
TRASH = 'trash',
|
||||
SHARED = 'shared',
|
||||
}
|
||||
|
||||
export const WorkspaceSubPathName = {
|
||||
[WorkspaceSubPath.ALL]: 'All Pages',
|
||||
[WorkspaceSubPath.SETTING]: 'Settings',
|
||||
[WorkspaceSubPath.TRASH]: 'Trash',
|
||||
[WorkspaceSubPath.SHARED]: 'Shared',
|
||||
} satisfies {
|
||||
@ -43,17 +41,15 @@ export const WorkspaceSubPathName = {
|
||||
export const pathGenerator = {
|
||||
all: workspaceId => `/workspace/${workspaceId}/all`,
|
||||
trash: workspaceId => `/workspace/${workspaceId}/trash`,
|
||||
setting: workspaceId => `/workspace/${workspaceId}/setting`,
|
||||
shared: workspaceId => `/workspace/${workspaceId}/shared`,
|
||||
} satisfies {
|
||||
[Path in WorkspaceSubPath]: (workspaceId: string) => string;
|
||||
};
|
||||
|
||||
export const publicPathGenerator = {
|
||||
all: workspaceId => `/public-workspace/${workspaceId}/all`,
|
||||
trash: workspaceId => `/public-workspace/${workspaceId}/trash`,
|
||||
setting: workspaceId => `/public-workspace/${workspaceId}/setting`,
|
||||
shared: workspaceId => `/public-workspace/${workspaceId}/shared`,
|
||||
all: workspaceId => `/share/${workspaceId}/all`,
|
||||
trash: workspaceId => `/share/${workspaceId}/trash`,
|
||||
shared: workspaceId => `/share/${workspaceId}/shared`,
|
||||
} satisfies {
|
||||
[Path in WorkspaceSubPath]: (workspaceId: string) => string;
|
||||
};
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Skeleton } from '@mui/material';
|
||||
import { NoSsr, Skeleton } from '@mui/material';
|
||||
import { assignInlineVars } from '@vanilla-extract/dynamic';
|
||||
import clsx from 'clsx';
|
||||
import { useAtom, useAtomValue } from 'jotai';
|
||||
@ -107,7 +107,9 @@ export function AppSidebar(props: AppSidebarProps): ReactElement {
|
||||
data-enable-animation={enableAnimation && !isResizing}
|
||||
>
|
||||
<nav className={navStyle} ref={navRef} data-testid="app-sidebar">
|
||||
<SidebarHeader router={props.router} />
|
||||
<NoSsr>
|
||||
<SidebarHeader router={props.router} />
|
||||
</NoSsr>
|
||||
<div className={navBodyStyle} data-testid="sliderBar-inner">
|
||||
{props.children}
|
||||
</div>
|
||||
|
||||
@ -1,10 +1,14 @@
|
||||
import type {
|
||||
AffineCloudWorkspace,
|
||||
LocalWorkspace,
|
||||
} from '@affine/env/workspace';
|
||||
import { WorkspaceFlavour } from '@affine/env/workspace';
|
||||
import { useAFFiNEI18N } from '@affine/i18n/hooks';
|
||||
import type { RootWorkspaceMetadata } from '@affine/workspace/atom';
|
||||
import { useStaticBlockSuiteWorkspace } from '@affine/workspace/utils';
|
||||
import { SettingsIcon } from '@blocksuite/icons';
|
||||
import {
|
||||
CloudWorkspaceIcon as DefaultCloudWorkspaceIcon,
|
||||
CollaborationIcon as DefaultJoinedWorkspaceIcon,
|
||||
LocalDataIcon as DefaultLocalDataIcon,
|
||||
LocalWorkspaceIcon as DefaultLocalWorkspaceIcon,
|
||||
} from '@blocksuite/icons';
|
||||
import { useBlockSuiteWorkspaceName } from '@toeverything/hooks/use-block-suite-workspace-name';
|
||||
import type { FC } from 'react';
|
||||
import { useCallback } from 'react';
|
||||
@ -18,16 +22,8 @@ import {
|
||||
} from './styles';
|
||||
|
||||
export type WorkspaceTypeProps = {
|
||||
workspace: AffineCloudWorkspace | LocalWorkspace;
|
||||
flavour: WorkspaceFlavour;
|
||||
};
|
||||
|
||||
import {
|
||||
CloudWorkspaceIcon as DefaultCloudWorkspaceIcon,
|
||||
CollaborationIcon as DefaultJoinedWorkspaceIcon,
|
||||
LocalDataIcon as DefaultLocalDataIcon,
|
||||
LocalWorkspaceIcon as DefaultLocalWorkspaceIcon,
|
||||
} from '@blocksuite/icons';
|
||||
|
||||
const JoinedWorkspaceIcon = () => {
|
||||
return <DefaultJoinedWorkspaceIcon style={{ color: '#FF646B' }} />;
|
||||
};
|
||||
@ -43,12 +39,12 @@ const LocalDataIcon = () => {
|
||||
return <DefaultLocalDataIcon style={{ color: '#62CD80' }} />;
|
||||
};
|
||||
|
||||
const WorkspaceType: FC<WorkspaceTypeProps> = ({ workspace }) => {
|
||||
const WorkspaceType: FC<WorkspaceTypeProps> = ({ flavour }) => {
|
||||
const t = useAFFiNEI18N();
|
||||
// fixme: cloud regression
|
||||
const isOwner = true;
|
||||
|
||||
if (workspace.flavour === WorkspaceFlavour.LOCAL) {
|
||||
if (flavour === WorkspaceFlavour.LOCAL) {
|
||||
return (
|
||||
<p title={t['Local Workspace']()}>
|
||||
<LocalWorkspaceIcon />
|
||||
@ -72,51 +68,46 @@ const WorkspaceType: FC<WorkspaceTypeProps> = ({ workspace }) => {
|
||||
|
||||
export type WorkspaceCardProps = {
|
||||
currentWorkspaceId: string | null;
|
||||
workspace: AffineCloudWorkspace | LocalWorkspace;
|
||||
onClick: (workspace: AffineCloudWorkspace | LocalWorkspace) => void;
|
||||
onSettingClick: (workspace: AffineCloudWorkspace | LocalWorkspace) => void;
|
||||
meta: RootWorkspaceMetadata;
|
||||
onClick: (workspaceId: string) => void;
|
||||
onSettingClick: (workspaceId: string) => void;
|
||||
};
|
||||
|
||||
export const WorkspaceCard: FC<WorkspaceCardProps> = ({
|
||||
workspace,
|
||||
onClick,
|
||||
onSettingClick,
|
||||
currentWorkspaceId,
|
||||
meta,
|
||||
}) => {
|
||||
const t = useAFFiNEI18N();
|
||||
const [name] = useBlockSuiteWorkspaceName(workspace.blockSuiteWorkspace);
|
||||
const workspace = useStaticBlockSuiteWorkspace(meta.id);
|
||||
const [name] = useBlockSuiteWorkspaceName(workspace);
|
||||
|
||||
return (
|
||||
<StyledCard
|
||||
data-testid="workspace-card"
|
||||
onClick={useCallback(() => {
|
||||
onClick(workspace);
|
||||
}, [onClick, workspace])}
|
||||
onClick(meta.id);
|
||||
}, [onClick, meta.id])}
|
||||
active={workspace.id === currentWorkspaceId}
|
||||
>
|
||||
<WorkspaceAvatar size={58} workspace={workspace} />
|
||||
|
||||
<StyleWorkspaceInfo>
|
||||
<StyleWorkspaceTitle>{name}</StyleWorkspaceTitle>
|
||||
<WorkspaceType workspace={workspace} />
|
||||
{workspace.flavour === WorkspaceFlavour.LOCAL && (
|
||||
<WorkspaceType flavour={meta.flavour} />
|
||||
{meta.flavour === WorkspaceFlavour.LOCAL && (
|
||||
<p title={t['Available Offline']()}>
|
||||
<LocalDataIcon />
|
||||
<span>{t['Available Offline']()}</span>
|
||||
</p>
|
||||
)}
|
||||
{/* {workspace.flavour === WorkspaceFlavour.AFFINE && workspace.public && (
|
||||
<p title={t['Published to Web']()}>
|
||||
<PublishIcon />
|
||||
<span>{t['Published to Web']()}</span>
|
||||
</p>
|
||||
)} */}
|
||||
</StyleWorkspaceInfo>
|
||||
<StyledSettingLink
|
||||
className="setting-entry"
|
||||
onClick={e => {
|
||||
e.stopPropagation();
|
||||
onSettingClick(workspace);
|
||||
onSettingClick(meta.id);
|
||||
}}
|
||||
>
|
||||
<SettingsIcon />
|
||||
|
||||
@ -1,8 +1,3 @@
|
||||
import type {
|
||||
AffineCloudWorkspace,
|
||||
AffinePublicWorkspace,
|
||||
LocalWorkspace,
|
||||
} from '@affine/env/workspace';
|
||||
import type { Workspace } from '@blocksuite/store';
|
||||
import * as RadixAvatar from '@radix-ui/react-avatar';
|
||||
import { useBlockSuiteWorkspaceAvatarUrl } from '@toeverything/hooks/use-block-suite-workspace-avatar-url';
|
||||
@ -15,11 +10,7 @@ import { avatarImageStyle, avatarStyle } from './index.css';
|
||||
|
||||
export type WorkspaceAvatarProps = {
|
||||
size?: number;
|
||||
workspace:
|
||||
| AffineCloudWorkspace
|
||||
| LocalWorkspace
|
||||
| AffinePublicWorkspace
|
||||
| null;
|
||||
workspace: Workspace | null;
|
||||
className?: string;
|
||||
};
|
||||
|
||||
@ -60,13 +51,9 @@ export const WorkspaceAvatar: React.FC<WorkspaceAvatarProps> = ({
|
||||
workspace,
|
||||
...props
|
||||
}) => {
|
||||
if (workspace && 'blockSuiteWorkspace' in workspace) {
|
||||
if (workspace) {
|
||||
return (
|
||||
<BlockSuiteWorkspaceAvatar
|
||||
{...props}
|
||||
size={size}
|
||||
workspace={workspace.blockSuiteWorkspace}
|
||||
/>
|
||||
<BlockSuiteWorkspaceAvatar {...props} size={size} workspace={workspace} />
|
||||
);
|
||||
}
|
||||
return (
|
||||
|
||||
@ -2,6 +2,7 @@ import type {
|
||||
AffineCloudWorkspace,
|
||||
LocalWorkspace,
|
||||
} from '@affine/env/workspace';
|
||||
import type { RootWorkspaceMetadata } from '@affine/workspace/atom';
|
||||
import type { DragEndEvent } from '@dnd-kit/core';
|
||||
import {
|
||||
DndContext,
|
||||
@ -10,7 +11,8 @@ import {
|
||||
useSensors,
|
||||
} from '@dnd-kit/core';
|
||||
import { SortableContext, useSortable } from '@dnd-kit/sortable';
|
||||
import type { FC } from 'react';
|
||||
import type { CSSProperties, FC } from 'react';
|
||||
import { useMemo } from 'react';
|
||||
|
||||
import { WorkspaceCard } from '../../components/card/workspace-card';
|
||||
import { workspaceItemStyle } from './index.css';
|
||||
@ -19,26 +21,29 @@ export type WorkspaceListProps = {
|
||||
disabled?: boolean;
|
||||
currentWorkspaceId: string | null;
|
||||
items: (AffineCloudWorkspace | LocalWorkspace)[];
|
||||
onClick: (workspace: AffineCloudWorkspace | LocalWorkspace) => void;
|
||||
onSettingClick: (workspace: AffineCloudWorkspace | LocalWorkspace) => void;
|
||||
onClick: (workspaceId: string) => void;
|
||||
onSettingClick: (workspaceId: string) => void;
|
||||
onDragEnd: (event: DragEndEvent) => void;
|
||||
};
|
||||
|
||||
const SortableWorkspaceItem: FC<
|
||||
Omit<WorkspaceListProps, 'items'> & {
|
||||
item: AffineCloudWorkspace | LocalWorkspace;
|
||||
item: RootWorkspaceMetadata;
|
||||
}
|
||||
> = props => {
|
||||
const { setNodeRef, attributes, listeners, transform } = useSortable({
|
||||
id: props.item.id,
|
||||
});
|
||||
const style: React.CSSProperties = {
|
||||
transform: transform
|
||||
? `translate3d(${transform.x}px, ${transform.y}px, 0)`
|
||||
: undefined,
|
||||
pointerEvents: props.disabled ? 'none' : undefined,
|
||||
opacity: props.disabled ? 0.6 : undefined,
|
||||
};
|
||||
const style: CSSProperties = useMemo(
|
||||
() => ({
|
||||
transform: transform
|
||||
? `translate3d(${transform.x}px, ${transform.y}px, 0)`
|
||||
: undefined,
|
||||
pointerEvents: props.disabled ? 'none' : undefined,
|
||||
opacity: props.disabled ? 0.6 : undefined,
|
||||
}),
|
||||
[props.disabled, transform]
|
||||
);
|
||||
return (
|
||||
<div
|
||||
className={workspaceItemStyle}
|
||||
@ -50,7 +55,7 @@ const SortableWorkspaceItem: FC<
|
||||
>
|
||||
<WorkspaceCard
|
||||
currentWorkspaceId={props.currentWorkspaceId}
|
||||
workspace={props.item}
|
||||
meta={props.item}
|
||||
onClick={props.onClick}
|
||||
onSettingClick={props.onSettingClick}
|
||||
/>
|
||||
|
||||
@ -1,8 +1,10 @@
|
||||
import type { TooltipProps } from '@mui/material';
|
||||
import { NoSsr } from '@mui/material';
|
||||
|
||||
import { styled } from '../../styles';
|
||||
import { Popper, type PopperProps } from '../popper';
|
||||
import StyledPopperContainer from '../shared/container';
|
||||
|
||||
const StyledTooltip = styled(StyledPopperContainer)(() => {
|
||||
return {
|
||||
maxWidth: '320px',
|
||||
@ -19,11 +21,13 @@ const StyledTooltip = styled(StyledPopperContainer)(() => {
|
||||
export const Tooltip = (props: PopperProps & Omit<TooltipProps, 'title'>) => {
|
||||
const { content, placement = 'top-start', children } = props;
|
||||
return (
|
||||
<Popper
|
||||
{...props}
|
||||
content={<StyledTooltip placement={placement}>{content}</StyledTooltip>}
|
||||
>
|
||||
{children}
|
||||
</Popper>
|
||||
<NoSsr>
|
||||
<Popper
|
||||
{...props}
|
||||
content={<StyledTooltip placement={placement}>{content}</StyledTooltip>}
|
||||
>
|
||||
{children}
|
||||
</Popper>
|
||||
</NoSsr>
|
||||
);
|
||||
};
|
||||
|
||||
23
packages/env/src/workspace.ts
vendored
23
packages/env/src/workspace.ts
vendored
@ -50,18 +50,25 @@ export interface SQLiteDBDownloadProvider extends ActiveDocProvider {
|
||||
flavour: 'sqlite-download';
|
||||
}
|
||||
|
||||
// todo: update type with nest.js
|
||||
export type AffineCloudWorkspace = Omit<LocalWorkspace, 'flavour'> & {
|
||||
flavour: WorkspaceFlavour.AFFINE_CLOUD;
|
||||
type BaseWorkspace = {
|
||||
flavour: string;
|
||||
id: string;
|
||||
blockSuiteWorkspace: BlockSuiteWorkspace;
|
||||
};
|
||||
|
||||
export interface LocalWorkspace {
|
||||
export interface AffineCloudWorkspace extends BaseWorkspace {
|
||||
flavour: WorkspaceFlavour.AFFINE_CLOUD;
|
||||
id: string;
|
||||
blockSuiteWorkspace: BlockSuiteWorkspace;
|
||||
}
|
||||
|
||||
export interface LocalWorkspace extends BaseWorkspace {
|
||||
flavour: WorkspaceFlavour.LOCAL;
|
||||
id: string;
|
||||
blockSuiteWorkspace: BlockSuiteWorkspace;
|
||||
}
|
||||
|
||||
export interface AffinePublicWorkspace {
|
||||
export interface AffinePublicWorkspace extends BaseWorkspace {
|
||||
flavour: WorkspaceFlavour.PUBLIC;
|
||||
id: string;
|
||||
blockSuiteWorkspace: BlockSuiteWorkspace;
|
||||
@ -107,15 +114,15 @@ export interface WorkspaceRegistry {
|
||||
|
||||
export interface WorkspaceCRUD<Flavour extends keyof WorkspaceRegistry> {
|
||||
create: (blockSuiteWorkspace: BlockSuiteWorkspace) => Promise<string>;
|
||||
delete: (workspace: WorkspaceRegistry[Flavour]) => Promise<void>;
|
||||
delete: (blockSuiteWorkspace: BlockSuiteWorkspace) => Promise<void>;
|
||||
get: (workspaceId: string) => Promise<WorkspaceRegistry[Flavour] | null>;
|
||||
// not supported yet
|
||||
// update: (workspace: FlavourToWorkspace[Flavour]) => Promise<void>;
|
||||
list: () => Promise<WorkspaceRegistry[Flavour][]>;
|
||||
}
|
||||
|
||||
type UIBaseProps<Flavour extends keyof WorkspaceRegistry> = {
|
||||
currentWorkspace: WorkspaceRegistry[Flavour];
|
||||
type UIBaseProps<_Flavour extends keyof WorkspaceRegistry> = {
|
||||
currentWorkspaceId: string;
|
||||
};
|
||||
|
||||
export type WorkspaceHeaderProps<Flavour extends keyof WorkspaceRegistry> =
|
||||
|
||||
@ -3,9 +3,10 @@
|
||||
*/
|
||||
import 'fake-indexeddb/auto';
|
||||
|
||||
import type { LocalWorkspace, WorkspaceCRUD } from '@affine/env/workspace';
|
||||
import type { WorkspaceCRUD } from '@affine/env/workspace';
|
||||
import { WorkspaceFlavour } from '@affine/env/workspace';
|
||||
import { __unstableSchemas, AffineSchemas } from '@blocksuite/blocks/models';
|
||||
import { assertExists } from '@blocksuite/global/utils';
|
||||
import { Workspace } from '@blocksuite/store';
|
||||
import { afterEach, assertType, describe, expect, test } from 'vitest';
|
||||
|
||||
@ -29,11 +30,7 @@ describe('crud', () => {
|
||||
|
||||
test('delete not exist', async () => {
|
||||
await expect(async () =>
|
||||
CRUD.delete({
|
||||
id: 'not_exist',
|
||||
flavour: WorkspaceFlavour.LOCAL,
|
||||
blockSuiteWorkspace: new Workspace({ id: 'test' }),
|
||||
})
|
||||
CRUD.delete(new Workspace({ id: 'test' }))
|
||||
).rejects.toThrowError();
|
||||
});
|
||||
|
||||
@ -54,7 +51,8 @@ describe('crud', () => {
|
||||
const list = await CRUD.list();
|
||||
expect(list.length).toBe(1);
|
||||
expect(list[0].id).toBe(id);
|
||||
const localWorkspace = list.at(0) as LocalWorkspace;
|
||||
const localWorkspace = list.at(0);
|
||||
assertExists(localWorkspace);
|
||||
expect(localWorkspace.id).toBe(id);
|
||||
expect(localWorkspace.flavour).toBe(WorkspaceFlavour.LOCAL);
|
||||
expect(localWorkspace.blockSuiteWorkspace.doc.toJSON()).toEqual({
|
||||
@ -64,7 +62,7 @@ describe('crud', () => {
|
||||
}),
|
||||
});
|
||||
|
||||
await CRUD.delete(localWorkspace);
|
||||
await CRUD.delete(localWorkspace.blockSuiteWorkspace);
|
||||
expect(await CRUD.get(id)).toBeNull();
|
||||
expect(await CRUD.list()).toEqual([]);
|
||||
});
|
||||
|
||||
@ -7,25 +7,19 @@ import {
|
||||
} from '@affine/workspace/providers';
|
||||
import { __unstableSchemas, AffineSchemas } from '@blocksuite/blocks/models';
|
||||
import type {
|
||||
ActiveDocProvider,
|
||||
DocProviderCreator,
|
||||
Generator,
|
||||
StoreOptions,
|
||||
} from '@blocksuite/store';
|
||||
import { createIndexeddbStorage, Workspace } from '@blocksuite/store';
|
||||
import { rootStore } from '@toeverything/plugin-infra/manager';
|
||||
import { useAtomValue } from 'jotai/react';
|
||||
import type { Atom } from 'jotai/vanilla';
|
||||
import { atom } from 'jotai/vanilla';
|
||||
|
||||
import { rootWorkspacesMetadataAtom } from './atom';
|
||||
import { createStaticStorage } from './blob/local-static-storage';
|
||||
import { createSQLiteStorage } from './blob/sqlite-blob-storage';
|
||||
|
||||
export function cleanupWorkspace(flavour: WorkspaceFlavour) {
|
||||
rootStore
|
||||
.set(rootWorkspacesMetadataAtom, metas =>
|
||||
metas.filter(meta => meta.flavour !== flavour)
|
||||
)
|
||||
.catch(console.error);
|
||||
}
|
||||
|
||||
function setEditorFlags(workspace: Workspace) {
|
||||
Object.entries(runtimeConfig.editorFlags).forEach(([key, value]) => {
|
||||
workspace.awarenessStore.setFlag(
|
||||
@ -39,12 +33,53 @@ function setEditorFlags(workspace: Workspace) {
|
||||
);
|
||||
}
|
||||
|
||||
const hashMap = new Map<string, Workspace>();
|
||||
// guid -> Workspace
|
||||
export const workspaceHashMap = new Map<string, Workspace>();
|
||||
|
||||
/**
|
||||
* @internal test only
|
||||
*/
|
||||
export const _cleanupBlockSuiteWorkspaceCache = () => hashMap.clear();
|
||||
const workspacePassiveAtomWeakMap = new WeakMap<
|
||||
Workspace,
|
||||
Atom<Promise<Workspace>>
|
||||
>();
|
||||
const workspaceActiveWeakMap = new WeakMap<Workspace, boolean>();
|
||||
|
||||
export function getWorkspace(id: string) {
|
||||
if (!workspaceHashMap.has(id)) {
|
||||
throw new Error('Workspace not found');
|
||||
}
|
||||
return workspaceHashMap.get(id) as Workspace;
|
||||
}
|
||||
|
||||
export function getPassiveBlockSuiteWorkspaceAtom(
|
||||
id: string
|
||||
): Atom<Promise<Workspace>> {
|
||||
if (!workspaceHashMap.has(id)) {
|
||||
throw new Error('Workspace not found');
|
||||
}
|
||||
const workspace = workspaceHashMap.get(id) as Workspace;
|
||||
if (!workspacePassiveAtomWeakMap.has(workspace)) {
|
||||
const baseAtom = atom(async () => {
|
||||
if (workspaceActiveWeakMap.get(workspace) !== true) {
|
||||
const providers = workspace.providers.filter(
|
||||
(provider): provider is ActiveDocProvider =>
|
||||
'active' in provider && provider.active === true
|
||||
);
|
||||
for (const provider of providers) {
|
||||
provider.sync();
|
||||
// we will wait for the necessary providers to be ready
|
||||
await provider.whenReady;
|
||||
}
|
||||
workspaceActiveWeakMap.set(workspace, true);
|
||||
}
|
||||
return workspace;
|
||||
});
|
||||
workspacePassiveAtomWeakMap.set(workspace, baseAtom);
|
||||
}
|
||||
return workspacePassiveAtomWeakMap.get(workspace) as Atom<Promise<Workspace>>;
|
||||
}
|
||||
|
||||
export function useStaticBlockSuiteWorkspace(id: string): Workspace {
|
||||
return useAtomValue(getPassiveBlockSuiteWorkspaceAtom(id));
|
||||
}
|
||||
|
||||
export function createEmptyBlockSuiteWorkspace(
|
||||
id: string,
|
||||
@ -73,8 +108,8 @@ export function createEmptyBlockSuiteWorkspace(
|
||||
const providerCreators: DocProviderCreator[] = [];
|
||||
const prefix: string = config?.cachePrefix ?? '';
|
||||
const cacheKey = `${prefix}${id}`;
|
||||
if (hashMap.has(cacheKey)) {
|
||||
return hashMap.get(cacheKey) as Workspace;
|
||||
if (workspaceHashMap.has(cacheKey)) {
|
||||
return workspaceHashMap.get(cacheKey) as Workspace;
|
||||
}
|
||||
const idGenerator = config?.idGenerator;
|
||||
|
||||
@ -111,36 +146,6 @@ export function createEmptyBlockSuiteWorkspace(
|
||||
.register(AffineSchemas)
|
||||
.register(__unstableSchemas);
|
||||
setEditorFlags(workspace);
|
||||
hashMap.set(cacheKey, workspace);
|
||||
workspaceHashMap.set(cacheKey, workspace);
|
||||
return workspace;
|
||||
}
|
||||
|
||||
export class CallbackSet extends Set<() => void> {
|
||||
#ready = false;
|
||||
|
||||
get ready(): boolean {
|
||||
return this.#ready;
|
||||
}
|
||||
|
||||
set ready(v: boolean) {
|
||||
this.#ready = v;
|
||||
}
|
||||
|
||||
override add(cb: () => void) {
|
||||
if (this.ready) {
|
||||
cb();
|
||||
return this;
|
||||
}
|
||||
if (this.has(cb)) {
|
||||
return this;
|
||||
}
|
||||
return super.add(cb);
|
||||
}
|
||||
|
||||
override delete(cb: () => void) {
|
||||
if (this.has(cb)) {
|
||||
return super.delete(cb);
|
||||
}
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
@ -19,6 +19,7 @@ test('database is useable', async ({ page }) => {
|
||||
await openHomePage(page);
|
||||
await waitEditorLoad(page);
|
||||
await newPage(page);
|
||||
await waitEditorLoad(page);
|
||||
await page.keyboard.insertText('test title');
|
||||
await page.keyboard.press('Enter');
|
||||
const title = page.locator('.affine-default-page-block-title');
|
||||
@ -29,9 +30,11 @@ test('database is useable', async ({ page }) => {
|
||||
await page.reload();
|
||||
await waitEditorLoad(page);
|
||||
await newPage(page);
|
||||
await waitEditorLoad(page);
|
||||
await page.keyboard.insertText('test title2');
|
||||
await page.keyboard.press('Enter');
|
||||
const title2 = page.locator('.affine-default-page-block-title');
|
||||
await page.waitForTimeout(500);
|
||||
expect(await title2.innerText()).toBe('test title2');
|
||||
await addDatabase(page);
|
||||
const database2 = page.locator('.affine-database-table');
|
||||
@ -42,11 +45,13 @@ test('link page is useable', async ({ page }) => {
|
||||
await openHomePage(page);
|
||||
await waitEditorLoad(page);
|
||||
await newPage(page);
|
||||
await waitEditorLoad(page);
|
||||
await page.keyboard.insertText('page1');
|
||||
await page.keyboard.press('Enter');
|
||||
const title = page.locator('.affine-default-page-block-title');
|
||||
expect(await title.innerText()).toBe('page1');
|
||||
await newPage(page);
|
||||
await waitEditorLoad(page);
|
||||
await page.keyboard.insertText('page2');
|
||||
await page.keyboard.press('Enter');
|
||||
const title2 = page.locator('.affine-default-page-block-title');
|
||||
@ -59,7 +64,9 @@ test('link page is useable', async ({ page }) => {
|
||||
await page.keyboard.press('1');
|
||||
await page.keyboard.press('Enter');
|
||||
const link = page.locator('.affine-reference');
|
||||
expect(link).toBeVisible();
|
||||
await page.waitForTimeout(500);
|
||||
await expect(link).toBeVisible();
|
||||
await page.click('.affine-reference');
|
||||
await page.waitForTimeout(500);
|
||||
expect(await title.innerText()).toBe('page1');
|
||||
});
|
||||
|
||||
@ -13,6 +13,7 @@ test('drag a page from "All pages" list onto the "Trash" folder in the sidebar t
|
||||
await openHomePage(page);
|
||||
await waitEditorLoad(page);
|
||||
await page.getByText('All Pages').click();
|
||||
await page.waitForTimeout(500);
|
||||
}
|
||||
|
||||
const title = 'AFFiNE - not just a note taking app';
|
||||
|
||||
@ -103,6 +103,7 @@ test('create multi workspace in the workspace list', async ({ page }) => {
|
||||
await page.reload();
|
||||
await openWorkspaceListModal(page);
|
||||
|
||||
await page.waitForTimeout(1000);
|
||||
// check workspace list length
|
||||
{
|
||||
const workspaceCards1 = await page.$$('data-testid=workspace-card');
|
||||
|
||||
@ -8,9 +8,9 @@ test('goto not found page', async ({ page }) => {
|
||||
await openHomePage(page);
|
||||
await waitEditorLoad(page);
|
||||
const currentUrl = page.url();
|
||||
const invalidUrl = currentUrl.replace(/\/$/, '') + '/invalid';
|
||||
const invalidUrl = currentUrl.replace('hello-world', 'invalid');
|
||||
await page.goto(invalidUrl);
|
||||
await expect(page.getByTestId('notFound').isVisible()).toBeTruthy();
|
||||
await expect(page.getByTestId('notFound')).toBeVisible();
|
||||
});
|
||||
|
||||
test('goto not found workspace', async ({ page }) => {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user