Jayden/AFFiNE-Mirror
1
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-02-16 13:57:02 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: cleanup workspace when switch setting panel (#3072)

Browse Source 
(cherry picked from commit 822078e640)
This commit is contained in:
Alex Yang
2023-07-06 23:27:09 +08:00
parent 44dbe39001
commit f38978e7c9
6 changed files with 58 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
apps/web/src/adapters/local/index.tsx
View File

@@ -113,7 +113,6 @@ export const LocalAdapter: WorkspaceAdapter<WorkspaceFlavour.LOCAL> = {
<NewWorkspaceSettingDetail
onDeleteWorkspace={onDeleteWorkspace}
workspace={currentWorkspace}
key={currentWorkspace.id}
onTransferWorkspace={onTransformWorkspace}
/>
);

2
apps/web/src/atoms/index.ts
View File

@@ -15,6 +15,8 @@ export type SettingAtom = Pick<SettingProps, 'activeTab' | 'workspace'> & {
};
export const openSettingModalAtom = atom<SettingAtom>({
activeTab: 'appearance',
workspace: null,
open: false,
});

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

@@ -23,11 +23,11 @@ import { WorkSpaceSetting } from './workspace-setting';
type ActiveTab = GeneralSettingKeys | 'workspace' | 'account';
export type SettingProps = {
activeTab?: ActiveTab;
workspace?: AllWorkspace;
activeTab: ActiveTab;
workspace: AllWorkspace | null;
onSettingClick: (params: {
activeTab: ActiveTab;
workspace?: AllWorkspace;
workspace: AllWorkspace | null;
}) => void;
};
export const SettingModal: React.FC<SettingModalProps & SettingProps> = ({
@@ -52,6 +52,7 @@ export const SettingModal: React.FC<SettingModalProps & SettingProps> = ({
(key: GeneralSettingKeys) => {
onSettingClick({
activeTab: key,
workspace: null,
});
},
[onSettingClick]
@@ -66,7 +67,7 @@ export const SettingModal: React.FC<SettingModalProps & SettingProps> = ({
[onSettingClick]
);
const onAccountSettingClick = useCallback(() => {
onSettingClick({ activeTab: 'account' });
onSettingClick({ activeTab: 'account', workspace: null });
}, [onSettingClick]);
return (
@@ -86,7 +87,7 @@ export const SettingModal: React.FC<SettingModalProps & SettingProps> = ({
<div className="wrapper">
<div className="content">
{activeTab === 'workspace' && workspace ? (
<WorkSpaceSetting workspace={workspace} />
<WorkSpaceSetting key={workspace.id} workspace={workspace} />
) : null}
{generalSettingList.find(v => v.key === activeTab) ? (
<GeneralSetting generalKey={activeTab as GeneralSettingKeys} />

18
apps/web/src/components/pure/help-island/index.tsx
View File

@@ -31,24 +31,7 @@ export const HelpIsland = ({
const [, setOpenOnboarding] = useAtom(openOnboardingModalAtom);
const [, setOpenSettingModalAtom] = useAtom(openSettingModalAtom);
const [spread, setShowSpread] = useState(false);
// const { triggerShortcutsModal, triggerContactModal } = useModal();
// const blockHub = useGlobalState(store => store.blockHub);
const t = useAFFiNEI18N();
//
// useEffect(() => {
// blockHub?.blockHubStatusUpdated.on(status => {
// if (status) {
// setShowSpread(false);
// }
// });
// return () => {
// blockHub?.blockHubStatusUpdated.dispose();
// };
// }, [blockHub]);
//
// useEffect(() => {
// spread && blockHub?.toggleMenu(false);
// }, [blockHub, spread]);
const [openShortCut, setOpenShortCut] = useState(false);
@@ -58,6 +41,7 @@ export const HelpIsland = ({
setOpenSettingModalAtom({
open: true,
activeTab: 'about',
workspace: null,
});
}, [setOpenSettingModalAtom]);

44
apps/web/src/layouts/workspace-layout.tsx
View File

@@ -40,7 +40,6 @@ import type { FC, PropsWithChildren, ReactElement } from 'react';
import { lazy, Suspense, useCallback, useEffect, useMemo } from 'react';
import { WorkspaceAdapters } from '../adapters/workspace';
import type { SettingAtom } from '../atoms';
import {
openQuickSearchModalAtom,
openSettingModalAtom,
@@ -72,11 +71,6 @@ const QuickSearchModal = lazy(() =>
default: module.QuickSearchModal,
}))
);
const SettingModal = lazy(() =>
import('../components/affine/setting-modal').then(module => ({
default: module.SettingModal,
}))
);
function DefaultProvider({ children }: PropsWithChildren) {
return <>{children}</>;
@@ -101,37 +95,6 @@ export const QuickSearch: FC = () => {
/>
);
};
export const Setting: FC = () => {
const [currentWorkspace] = useCurrentWorkspace();
const [{ open, workspace, activeTab }, setOpenSettingModalAtom] =
useAtom(openSettingModalAtom);
const blockSuiteWorkspace = currentWorkspace?.blockSuiteWorkspace;
const onSettingClick = useCallback(
({
activeTab,
workspace,
}: Pick<SettingAtom, 'activeTab' | 'workspace'>) => {
setOpenSettingModalAtom(prev => ({ ...prev, activeTab, workspace }));
},
[setOpenSettingModalAtom]
);
if (!blockSuiteWorkspace) {
return null;
}
return (
<SettingModal
open={open}
activeTab={activeTab || 'appearance'}
workspace={workspace}
onSettingClick={onSettingClick}
setOpen={open => {
setOpenSettingModalAtom(prev => ({ ...prev, open }));
}}
/>
);
};
export const AllWorkspaceContext = ({
children,
@@ -358,7 +321,11 @@ export const WorkspaceLayoutInner: FC<PropsWithChildren> = ({ children }) => {
const [, setOpenSettingModalAtom] = useAtom(openSettingModalAtom);
const handleOpenSettingModal = useCallback(() => {
setOpenSettingModalAtom({ activeTab: 'appearance', open: true });
setOpenSettingModalAtom({
activeTab: 'appearance',
workspace: null,
open: true,
});
}, [setOpenSettingModalAtom]);
const resizing = useAtomValue(appSidebarResizingAtom);
@@ -448,7 +415,6 @@ export const WorkspaceLayoutInner: FC<PropsWithChildren> = ({ children }) => {
</DndContext>
<QuickSearch />
{runtimeConfig.enableNotificationCenter && <NotificationCenter />}
<Setting />
</>
);
};

45
apps/web/src/providers/modal-provider.tsx
View File

@@ -3,12 +3,14 @@ import {
rootCurrentWorkspaceIdAtom,
rootWorkspacesMetadataAtom,
} from '@affine/workspace/atom';
import { assertExists } from '@blocksuite/global/utils';
import { arrayMove } from '@dnd-kit/sortable';
import { useAtom, useSetAtom } from 'jotai';
import { useRouter } from 'next/router';
import type { ReactElement } from 'react';
import type { FC, ReactElement } from 'react';
import { lazy, Suspense, useCallback, useTransition } from 'react';
import type { SettingAtom } from '../atoms';
import {
openCreateWorkspaceModalAtom,
openDisableCloudAlertModalAtom,
@@ -16,10 +18,17 @@ import {
openSettingModalAtom,
openWorkspacesModalAtom,
} 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 => ({
default: module.SettingModal,
}))
);
const WorkspaceListModal = lazy(() =>
import('../components/pure/workspace-list-modal').then(module => ({
default: module.WorkspaceListModal,
@@ -46,7 +55,40 @@ const OnboardingModal = lazy(() =>
}))
);
export const Setting: FC = () => {
const [currentWorkspace] = useCurrentWorkspace();
const [{ open, workspace, activeTab }, setOpenSettingModalAtom] =
useAtom(openSettingModalAtom);
assertExists(currentWorkspace);
const onSettingClick = useCallback(
({
activeTab,
workspace,
}: Pick<SettingAtom, 'activeTab' | 'workspace'>) => {
setOpenSettingModalAtom(prev => ({ ...prev, activeTab, workspace }));
},
[setOpenSettingModalAtom]
);
return (
<SettingModal
open={open}
activeTab={activeTab}
workspace={workspace}
onSettingClick={onSettingClick}
setOpen={useCallback(
open => {
setOpenSettingModalAtom(prev => ({ ...prev, open }));
},
[setOpenSettingModalAtom]
)}
/>
);
};
export function CurrentWorkspaceModals() {
const [currentWorkspace] = useCurrentWorkspace();
const [openDisableCloudAlertModal, setOpenDisableCloudAlertModal] = useAtom(
openDisableCloudAlertModalAtom
);
@@ -75,6 +117,7 @@ export function CurrentWorkspaceModals() {
/>
</Suspense>
)}
{currentWorkspace && <Setting />}
</>
);
}