From ab059fcb2be4050a657e43d88bb09c503e1d9904 Mon Sep 17 00:00:00 2001 From: DiamondThree <857159145@qq.com> Date: Tue, 7 Feb 2023 16:45:16 +0800 Subject: [PATCH 1/4] fix: logout status error --- .../app/src/components/logout-modal/index.tsx | 10 ++++++++-- .../src/providers/app-state-provider/Provider.tsx | 15 ++++++++++++++- .../src/providers/app-state-provider/interface.ts | 1 + 3 files changed, 23 insertions(+), 3 deletions(-) diff --git a/packages/app/src/components/logout-modal/index.tsx b/packages/app/src/components/logout-modal/index.tsx index b317f1183..19b6b04d9 100644 --- a/packages/app/src/components/logout-modal/index.tsx +++ b/packages/app/src/components/logout-modal/index.tsx @@ -4,13 +4,15 @@ import { Button } from '@/ui/button'; import { Check, UnCheck } from './icon'; import { useState } from 'react'; import { useTranslation } from '@affine/i18n'; +import { useAppState } from '@/providers/app-state-provider'; interface LoginModalProps { open: boolean; onClose: (wait: boolean) => void; } export const LogoutModal = ({ open, onClose }: LoginModalProps) => { - const [localCache, setLocalCache] = useState(false); + const [localCache, setLocalCache] = useState(true); + const { blobDataSynced } = useAppState(); const { t } = useTranslation(); return ( @@ -24,7 +26,11 @@ export const LogoutModal = ({ open, onClose }: LoginModalProps) => { {t('Sign out')}? - {t('Set up an AFFiNE account to sync data')} + + {blobDataSynced + ? t('Set up an AFFiNE account to sync data') + : 'All data has been stored in the cloud'} + {localCache ? ( >; export const AppState = createContext({} as AppStateContext); export const useAppState = () => useContext(AppState); - +let syncChangeDisposable: Disposable | undefined = undefined; export const AppStateProvider = ({ children, }: PropsWithChildren) => { @@ -92,6 +96,7 @@ export const AppStateProvider = ({ const loadWorkspace = useRef(); loadWorkspace.current = async (workspaceId: string) => { + syncChangeDisposable && syncChangeDisposable.dispose(); const { dataCenter, workspaceList, currentWorkspace, user } = appState; if (!workspaceList.find(v => v.id.toString() === workspaceId)) { return null; @@ -108,6 +113,13 @@ export const AppStateProvider = ({ // We must ensure workspace.owner exists, then ensure id same. isOwner = workspace?.owner && user?.id === workspace.owner.id; } + const blobStorage = await workspace?.blocksuiteWorkspace?.blobs; + syncChangeDisposable = blobStorage?.signals.onBlobSyncStateChange.on(() => { + setAppState({ + ...appState, + synced: blobStorage?.uploading, + }); + }); const pageList = (workspace?.blocksuiteWorkspace?.meta.pageMetas as PageMeta[]) ?? []; setAppState({ @@ -117,6 +129,7 @@ export const AppStateProvider = ({ currentPage: null, editor: null, isOwner, + blobDataSynced: blobStorage?.uploading, }); return workspace; diff --git a/packages/app/src/providers/app-state-provider/interface.ts b/packages/app/src/providers/app-state-provider/interface.ts index c76b2993c..356795e96 100644 --- a/packages/app/src/providers/app-state-provider/interface.ts +++ b/packages/app/src/providers/app-state-provider/interface.ts @@ -24,6 +24,7 @@ export type AppStateValue = { editor?: EditorContainer | null; synced: boolean; isOwner?: boolean; + blobDataSynced?: boolean; }; export type AppStateFunction = { From 0441c17e1d4c8c4087506e1a3800ac895a0ec5ea Mon Sep 17 00:00:00 2001 From: DiamondThree <857159145@qq.com> Date: Tue, 7 Feb 2023 16:45:58 +0800 Subject: [PATCH 2/4] fix: pagelist is null --- packages/app/src/pages/workspace/[workspaceId]/all.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/app/src/pages/workspace/[workspaceId]/all.tsx b/packages/app/src/pages/workspace/[workspaceId]/all.tsx index 1a0ba456d..5d8eb5b43 100644 --- a/packages/app/src/pages/workspace/[workspaceId]/all.tsx +++ b/packages/app/src/pages/workspace/[workspaceId]/all.tsx @@ -4,9 +4,11 @@ import { PageListHeader } from '@/components/header'; import { ReactElement } from 'react'; import WorkspaceLayout from '@/components/workspace-layout'; import { useTranslation } from '@affine/i18n'; -import { useAppState } from '@/providers/app-state-provider'; +import { PageMeta, useAppState } from '@/providers/app-state-provider'; const All = () => { - const { pageList } = useAppState(); + const { currentWorkspace } = useAppState(); + const pageList = (currentWorkspace?.blocksuiteWorkspace?.meta.pageMetas || + []) as PageMeta[]; const { t } = useTranslation(); return ( <> From 28d2fd13d5cad7edb5e76e9fcd7508e006d9b9df Mon Sep 17 00:00:00 2001 From: DiamondThree <857159145@qq.com> Date: Tue, 7 Feb 2023 17:32:15 +0800 Subject: [PATCH 3/4] fix: sync status error --- packages/app/src/providers/app-state-provider/Provider.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/app/src/providers/app-state-provider/Provider.tsx b/packages/app/src/providers/app-state-provider/Provider.tsx index a5fb55b55..21846aefa 100644 --- a/packages/app/src/providers/app-state-provider/Provider.tsx +++ b/packages/app/src/providers/app-state-provider/Provider.tsx @@ -96,7 +96,6 @@ export const AppStateProvider = ({ const loadWorkspace = useRef(); loadWorkspace.current = async (workspaceId: string) => { - syncChangeDisposable && syncChangeDisposable.dispose(); const { dataCenter, workspaceList, currentWorkspace, user } = appState; if (!workspaceList.find(v => v.id.toString() === workspaceId)) { return null; @@ -104,6 +103,7 @@ export const AppStateProvider = ({ if (workspaceId === currentWorkspace?.id) { return currentWorkspace; } + syncChangeDisposable?.dispose(); const workspace = (await dataCenter.loadWorkspace(workspaceId)) ?? null; let isOwner; if (workspace?.provider === 'local') { @@ -117,7 +117,7 @@ export const AppStateProvider = ({ syncChangeDisposable = blobStorage?.signals.onBlobSyncStateChange.on(() => { setAppState({ ...appState, - synced: blobStorage?.uploading, + blobDataSynced: blobStorage?.uploading, }); }); const pageList = From a0f5d089d103730c3385732b498b85027f5900e9 Mon Sep 17 00:00:00 2001 From: DiamondThree <857159145@qq.com> Date: Tue, 7 Feb 2023 18:48:55 +0800 Subject: [PATCH 4/4] fix: appState dependency --- .../app/src/hooks/use-ensure-workspace.ts | 2 +- .../providers/app-state-provider/Provider.tsx | 39 +++++++++++++------ .../providers/app-state-provider/interface.ts | 4 +- 3 files changed, 31 insertions(+), 14 deletions(-) diff --git a/packages/app/src/hooks/use-ensure-workspace.ts b/packages/app/src/hooks/use-ensure-workspace.ts index 0ef15580a..d547b09da 100644 --- a/packages/app/src/hooks/use-ensure-workspace.ts +++ b/packages/app/src/hooks/use-ensure-workspace.ts @@ -38,7 +38,7 @@ export const useEnsureWorkspace = () => { // } const workspaceId = (router.query.workspaceId as string) || workspaceList[0]?.id; - loadWorkspace(workspaceId).finally(() => { + loadWorkspace.current(workspaceId).finally(() => { setWorkspaceLoaded(true); setActiveWorkspaceId(activeWorkspaceId); }); diff --git a/packages/app/src/providers/app-state-provider/Provider.tsx b/packages/app/src/providers/app-state-provider/Provider.tsx index 21846aefa..5dd18094a 100644 --- a/packages/app/src/providers/app-state-provider/Provider.tsx +++ b/packages/app/src/providers/app-state-provider/Provider.tsx @@ -19,11 +19,11 @@ type AppStateContextProps = PropsWithChildren>; export const AppState = createContext({} as AppStateContext); export const useAppState = () => useContext(AppState); -let syncChangeDisposable: Disposable | undefined = undefined; export const AppStateProvider = ({ children, }: PropsWithChildren) => { const [appState, setAppState] = useState({} as AppStateValue); + const [blobState, setBlobState] = useState(false); useEffect(() => { const initState = async () => { const dataCenter = await getDataCenter(); @@ -94,7 +94,8 @@ export const AppStateProvider = ({ }); }; - const loadWorkspace = useRef(); + const loadWorkspace: AppStateFunction['loadWorkspace'] = + useRef() as AppStateFunction['loadWorkspace']; loadWorkspace.current = async (workspaceId: string) => { const { dataCenter, workspaceList, currentWorkspace, user } = appState; if (!workspaceList.find(v => v.id.toString() === workspaceId)) { @@ -103,7 +104,7 @@ export const AppStateProvider = ({ if (workspaceId === currentWorkspace?.id) { return currentWorkspace; } - syncChangeDisposable?.dispose(); + const workspace = (await dataCenter.loadWorkspace(workspaceId)) ?? null; let isOwner; if (workspace?.provider === 'local') { @@ -113,13 +114,7 @@ export const AppStateProvider = ({ // We must ensure workspace.owner exists, then ensure id same. isOwner = workspace?.owner && user?.id === workspace.owner.id; } - const blobStorage = await workspace?.blocksuiteWorkspace?.blobs; - syncChangeDisposable = blobStorage?.signals.onBlobSyncStateChange.on(() => { - setAppState({ - ...appState, - blobDataSynced: blobStorage?.uploading, - }); - }); + const pageList = (workspace?.blocksuiteWorkspace?.meta.pageMetas as PageMeta[]) ?? []; setAppState({ @@ -129,12 +124,31 @@ export const AppStateProvider = ({ currentPage: null, editor: null, isOwner, - blobDataSynced: blobStorage?.uploading, }); return workspace; }; + useEffect(() => { + let syncChangeDisposable: Disposable | undefined; + const currentWorkspace = appState.currentWorkspace; + if (!currentWorkspace) { + return; + } + const getBlobStorage = async () => { + const blobStorage = await currentWorkspace?.blocksuiteWorkspace?.blobs; + syncChangeDisposable = blobStorage?.signals.onBlobSyncStateChange.on( + () => { + setBlobState(blobStorage?.uploading); + } + ); + }; + getBlobStorage(); + return () => { + syncChangeDisposable?.dispose(); + }; + }, [appState.currentWorkspace]); + const setEditor: AppStateFunction['setEditor'] = useRef() as AppStateFunction['setEditor']; setEditor.current = editor => { @@ -176,9 +190,10 @@ export const AppStateProvider = ({ ...appState, setEditor, loadPage: loadPage.current, - loadWorkspace: loadWorkspace.current, + loadWorkspace: loadWorkspace, login, logout, + blobDataSynced: blobState, }} > {children} diff --git a/packages/app/src/providers/app-state-provider/interface.ts b/packages/app/src/providers/app-state-provider/interface.ts index 356795e96..a1ea40022 100644 --- a/packages/app/src/providers/app-state-provider/interface.ts +++ b/packages/app/src/providers/app-state-provider/interface.ts @@ -30,7 +30,9 @@ export type AppStateValue = { export type AppStateFunction = { setEditor: MutableRefObject<(page: EditorContainer) => void>; - loadWorkspace: (workspaceId: string) => Promise; + loadWorkspace: MutableRefObject< + (workspaceId: string) => Promise + >; loadPage: (pageId: string) => void; login: () => Promise;