refactor: add hook transform workspace (#1407)

This commit is contained in:
Himself65
2023-03-08 00:21:01 -06:00
committed by GitHub
parent f172831733
commit b8e45d059c
10 changed files with 176 additions and 166 deletions

View File

@@ -11,7 +11,6 @@ import Head from 'next/head';
import { useRouter } from 'next/router';
import React, { memo, ReactElement, Suspense, useEffect, useMemo } from 'react';
import { Helmet, HelmetProvider } from 'react-helmet-async';
import { SWRConfig, SWRConfiguration } from 'swr';
import { jotaiStore } from '../atoms';
import { AffineErrorBoundary } from '../components/affine/affine-error-eoundary';
@@ -38,17 +37,6 @@ const DebugAtoms = memo(function DebugAtoms() {
const clientSideEmotionCache = createEmotionCache();
const helmetContext = {};
const defaultSWRConfig: SWRConfiguration = {
suspense: true,
fetcher: () => {
const error = new Error(
'you might forget to warp your page with AffineSWRConfigProvider'
);
console.log(error);
throw error;
},
};
const App = function App({
Component,
pageProps,
@@ -71,67 +59,62 @@ const App = function App({
<CacheProvider value={emotionCache}>
<I18nextProvider i18n={i18n}>
<DebugAtoms />
<SWRConfig value={defaultSWRConfig}>
<AffineErrorBoundary router={useRouter()}>
<Suspense fallback={<PageLoading key="RootPageLoading" />}>
<ProviderComposer
contexts={useMemo(
() => [
<AffineSWRConfigProvider key="AffineSWRConfigProvider" />,
<Provider key="JotaiProvider" store={jotaiStore} />,
<ThemeProvider key="ThemeProvider" />,
],
[]
)}
>
<HelmetProvider key="HelmetProvider" context={helmetContext}>
<Helmet>
<title>AFFiNE</title>
<meta
name="viewport"
content="initial-scale=1, width=device-width"
/>
</Helmet>
<Head>
<meta name="twitter:card" content="summary_large_image" />
<meta
name="twitter:url"
content="https://app.affine.pro/"
/>
<meta
name="twitter:title"
content="AFFiNEThere can be more than Notion and Miro."
/>
<meta
name="twitter:description"
content="There can be more than Notion and Miro. AFFiNE is a next-gen knowledge base that brings planning, sorting and creating all together."
/>
<meta name="twitter:site" content="@AffineOfficial" />
<meta
name="twitter:image"
content="https://affine.pro/og.jpeg"
/>
<meta
property="og:title"
content="AFFiNEThere can be more than Notion and Miro."
/>
<meta property="og:type" content="website" />
<meta
property="og:description"
content="There can be more than Notion and Miro. AFFiNE is a next-gen knowledge base that brings planning, sorting and creating all together."
/>
<meta property="og:url" content="https://app.affine.pro/" />
<meta
property="og:image"
content="https://affine.pro/og.jpeg"
/>
</Head>
{getLayout(<Component {...pageProps} />)}
</HelmetProvider>
</ProviderComposer>
</Suspense>
</AffineErrorBoundary>
</SWRConfig>
<AffineErrorBoundary router={useRouter()}>
<Suspense fallback={<PageLoading key="RootPageLoading" />}>
<ProviderComposer
contexts={useMemo(
() => [
<AffineSWRConfigProvider key="AffineSWRConfigProvider" />,
<Provider key="JotaiProvider" store={jotaiStore} />,
<ThemeProvider key="ThemeProvider" />,
],
[]
)}
>
<HelmetProvider key="HelmetProvider" context={helmetContext}>
<Helmet>
<title>AFFiNE</title>
<meta
name="viewport"
content="initial-scale=1, width=device-width"
/>
</Helmet>
<Head>
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:url" content="https://app.affine.pro/" />
<meta
name="twitter:title"
content="AFFiNEThere can be more than Notion and Miro."
/>
<meta
name="twitter:description"
content="There can be more than Notion and Miro. AFFiNE is a next-gen knowledge base that brings planning, sorting and creating all together."
/>
<meta name="twitter:site" content="@AffineOfficial" />
<meta
name="twitter:image"
content="https://affine.pro/og.jpeg"
/>
<meta
property="og:title"
content="AFFiNEThere can be more than Notion and Miro."
/>
<meta property="og:type" content="website" />
<meta
property="og:description"
content="There can be more than Notion and Miro. AFFiNE is a next-gen knowledge base that brings planning, sorting and creating all together."
/>
<meta property="og:url" content="https://app.affine.pro/" />
<meta
property="og:image"
content="https://affine.pro/og.jpeg"
/>
</Head>
{getLayout(<Component {...pageProps} />)}
</HelmetProvider>
</ProviderComposer>
</Suspense>
</AffineErrorBoundary>
</I18nextProvider>
</CacheProvider>
);

View File

@@ -1,6 +1,7 @@
import { useTranslation } from '@affine/i18n';
import { FolderIcon } from '@blocksuite/icons';
import { assertExists } from '@blocksuite/store';
import Head from 'next/head';
import { useRouter } from 'next/router';
import React, { useCallback } from 'react';
@@ -50,6 +51,9 @@ const AllPage: NextPageWithLayout = () => {
const PageList = WorkspacePlugins[currentWorkspace.flavour].UI.PageList;
return (
<>
<Head>
<title>{t('All Pages')} - AFFiNE</title>
</Head>
<WorkspaceTitle icon={<FolderIcon />}>{t('All pages')}</WorkspaceTitle>
<PageList
onOpenPage={onClickPage}
@@ -61,6 +65,9 @@ const AllPage: NextPageWithLayout = () => {
const PageList = WorkspacePlugins[currentWorkspace.flavour].UI.PageList;
return (
<>
<Head>
<title>{t('All Pages')} - AFFiNE</title>
</Head>
<WorkspaceTitle icon={<FolderIcon />}>{t('All pages')}</WorkspaceTitle>
<PageList
onOpenPage={onClickPage}

View File

@@ -3,19 +3,21 @@ import { SettingsIcon } from '@blocksuite/icons';
import { assertExists } from '@blocksuite/store';
import { useAtom } from 'jotai';
import { atomWithStorage } from 'jotai/utils';
import Head from 'next/head';
import { useRouter } from 'next/router';
import React, { useCallback, useEffect } from 'react';
import { Helmet } from 'react-helmet-async';
import { Unreachable } from '../../../components/affine/affine-error-eoundary';
import { PageLoading } from '../../../components/pure/loading';
import { WorkspaceTitle } from '../../../components/pure/workspace-title';
import { useCurrentWorkspace } from '../../../hooks/current/use-current-workspace';
import { useSyncRouterWithCurrentWorkspace } from '../../../hooks/use-sync-router-with-current-workspace';
import { useTransformWorkspace } from '../../../hooks/use-transform-workspace';
import { useWorkspacesHelper } from '../../../hooks/use-workspaces';
import { WorkspaceLayout } from '../../../layouts';
import { WorkspacePlugins } from '../../../plugins';
import {
FlavourToWorkspace,
NextPageWithLayout,
RemWorkspaceFlavour,
SettingPanel,
@@ -96,23 +98,25 @@ const SettingPage: NextPageWithLayout = () => {
const onDeleteWorkspace = useCallback(() => {
assertExists(currentWorkspace);
const workspaceId = currentWorkspace.id;
helper.deleteWorkspace(workspaceId);
return helper.deleteWorkspace(workspaceId);
}, [currentWorkspace, helper]);
const transformWorkspace = useTransformWorkspace();
const onTransformWorkspace = useCallback(
(targetWorkspaceId: string) => {
router
.replace({
pathname: `/workspace/[workspaceId]/setting`,
query: {
...router.query,
workspaceId: targetWorkspaceId,
},
})
.then(() => {
router.reload();
});
async <From extends RemWorkspaceFlavour, To extends RemWorkspaceFlavour>(
from: From,
to: To,
workspace: FlavourToWorkspace[From]
): Promise<void> => {
const workspaceId = await transformWorkspace(from, to, workspace);
await router.replace({
pathname: `/workspace/[workspaceId]/setting`,
query: {
...router.query,
workspaceId,
},
});
},
[router]
[router, transformWorkspace]
);
if (!router.isReady) {
return <PageLoading />;
@@ -125,9 +129,9 @@ const SettingPage: NextPageWithLayout = () => {
WorkspacePlugins[currentWorkspace.flavour].UI.SettingsDetail;
return (
<>
<Helmet>
<Head>
<title>{t('Workspace Settings')} - AFFiNE</title>
</Helmet>
</Head>
<WorkspaceTitle icon={<SettingsIcon />}>
{t('Workspace Settings')}
</WorkspaceTitle>
@@ -145,6 +149,9 @@ const SettingPage: NextPageWithLayout = () => {
WorkspacePlugins[currentWorkspace.flavour].UI.SettingsDetail;
return (
<>
<Head>
<title>{t('Workspace Settings')} - AFFiNE</title>
</Head>
<WorkspaceTitle icon={<SettingsIcon />}>
{t('Workspace Settings')}
</WorkspaceTitle>