refactor: workspace header (#1880)

This commit is contained in:
Himself65
2023-04-11 21:39:39 -05:00
committed by GitHub
parent 2e823c2fee
commit a06113d48c
42 changed files with 1653 additions and 470 deletions
-145
View File
@@ -1,145 +0,0 @@
import { createEmptyBlockSuiteWorkspace } from '@affine/workspace/utils';
import { ContentParser } from '@blocksuite/blocks/content-parser';
import type {
GetStaticPaths,
GetStaticProps,
InferGetStaticPropsType,
NextPage,
} from 'next';
import Head from 'next/head';
import React, { useEffect, useState } from 'react';
import { PageDetailEditor } from '../../components/page-detail-editor';
import { PageLoading } from '../../components/pure/loading';
import {
StyledPage,
StyledToolWrapper,
StyledWrapper,
} from '../../layouts/styles';
import type { BlockSuiteWorkspace } from '../../shared';
export type PreviewPageProps = {
text: string;
title: string;
};
export type PreviewPageParams = {
previewId: string;
};
const PreviewPage: NextPage<PreviewPageProps> = ({
text,
title,
}: InferGetStaticPropsType<typeof getStaticProps>) => {
const [blockSuiteWorkspace, setBlockSuiteWorkspace] =
useState<BlockSuiteWorkspace | null>(null);
useEffect(() => {
const blockSuiteWorkspace = createEmptyBlockSuiteWorkspace(
'preview',
(_: string) => undefined
);
blockSuiteWorkspace.slots.pageAdded.once(() => {
setBlockSuiteWorkspace(blockSuiteWorkspace);
});
blockSuiteWorkspace.createPage('preview');
return () => {
blockSuiteWorkspace.removePage('preview');
};
}, []);
if (!blockSuiteWorkspace || !blockSuiteWorkspace.getPage('preview')) {
return <PageLoading />;
}
return (
<>
<Head>
<title>{title}</title>
</Head>
<StyledPage>
<StyledWrapper>
<PageDetailEditor
isPreview
blockSuiteWorkspace={blockSuiteWorkspace}
pageId="preview"
onInit={(page, editor) => {
blockSuiteWorkspace.setPageMeta(page.id, { title });
const pageBlockId = page.addBlock('affine:page', {
title: new page.Text(title),
});
page.addBlock('affine:surface', {}, null);
const frameId = page.addBlock('affine:frame', {}, pageBlockId);
page.addBlock('affine:paragraph', {}, frameId);
const contentParser = new ContentParser(page);
contentParser.importMarkdown(text, frameId).then(() => {
page.resetHistory();
});
}}
/>
<StyledToolWrapper>
{/* fixme(himself65): remove this */}
<div id="toolWrapper" style={{ marginBottom: '12px' }}>
{/* Slot for block hub */}
</div>
</StyledToolWrapper>
</StyledWrapper>
</StyledPage>
</>
);
};
export default PreviewPage;
export const getStaticProps: GetStaticProps<
PreviewPageProps,
PreviewPageParams
> = async context => {
const name = context.params?.previewId;
const fs = await import('node:fs/promises');
const path = await import('node:path');
const markdown: string = await fs.readFile(
path.resolve(
process.cwd(),
'..',
'..',
'packages',
'templates',
'src',
`${name}.md`
),
'utf8'
);
const title = markdown
.split('\n')
.splice(0, 1)
.join('')
.replaceAll('#', '')
.trim();
if (!name) {
return {
redirect: {
destination: '/404',
},
props: {
text: '',
title: '',
},
};
}
return {
props: {
text: markdown.split('\n').slice(1).join('\n'),
title,
},
};
};
export const getStaticPaths: GetStaticPaths<PreviewPageParams> = () => {
return {
paths: [
{ params: { previewId: 'AFFiNE-Docs' } },
{ params: { previewId: 'Welcome-to-AFFiNE-Abbey-Alpha-Wood' } },
{ params: { previewId: 'Welcome-to-AFFiNE-Alpha-Downhills' } },
{ params: { previewId: 'Welcome-to-the-AFFiNE-Alpha' } },
],
fallback: false,
};
};
@@ -10,7 +10,7 @@ import { Suspense, useCallback, useEffect } from 'react';
import { currentWorkspaceIdAtom, openQuickSearchModalAtom } from '../../atoms';
import {
publicBlockSuiteAtom,
publicWorkspaceAtom,
publicWorkspaceIdAtom,
} from '../../atoms/public-workspace';
import { QueryParamError } from '../../components/affine/affine-error-eoundary';
@@ -31,7 +31,8 @@ const ListPageInner: React.FC<{
workspaceId: string;
}> = ({ workspaceId }) => {
const router = useRouter();
const blockSuiteWorkspace = useAtomValue(publicBlockSuiteAtom);
const publicWorkspace = useAtomValue(publicWorkspaceAtom);
const blockSuiteWorkspace = publicWorkspace.blockSuiteWorkspace;
const handleClickPage = useCallback(
(pageId: string) => {
return router.push({
@@ -84,6 +85,7 @@ const ListPage: NextPageWithLayout = () => {
const router = useRouter();
const workspaceId = router.query.workspaceId;
const setWorkspaceId = useSetAtom(publicWorkspaceIdAtom);
// todo: remove this atom usage here
const setCurrentWorkspaceId = useSetAtom(currentWorkspaceIdAtom);
useEffect(() => {
if (!router.isReady) {
@@ -55,7 +55,8 @@ export const StyledBreadcrumbs = styled(Link)(({ theme }) => {
const PublicWorkspaceDetailPageInner: React.FC<{
pageId: string;
}> = ({ pageId }) => {
const blockSuiteWorkspace = useAtomValue(publicPageBlockSuiteAtom);
const publicWorkspace = useAtomValue(publicPageBlockSuiteAtom);
const blockSuiteWorkspace = publicWorkspace.blockSuiteWorkspace;
if (!blockSuiteWorkspace) {
throw new Error('cannot find workspace');
}
@@ -83,7 +84,7 @@ const PublicWorkspaceDetailPageInner: React.FC<{
<PageDetailEditor
isPublic={true}
pageId={pageId}
blockSuiteWorkspace={blockSuiteWorkspace}
workspace={publicWorkspace}
onLoad={(_, editor) => {
const { page } = editor;
page.awarenessStore.setReadonly(page, true);
@@ -92,7 +92,15 @@ const AllPage: NextPageWithLayout = () => {
<Head>
<title>{t('All Pages')} - AFFiNE</title>
</Head>
<WorkspaceTitle icon={<FolderIcon />}>{t('All pages')}</WorkspaceTitle>
<WorkspaceTitle
workspace={currentWorkspace}
currentPage={null}
isPreview={false}
isPublic={false}
icon={<FolderIcon />}
>
{t('All pages')}
</WorkspaceTitle>
<PageList
onOpenPage={onClickPage}
blockSuiteWorkspace={currentWorkspace.blockSuiteWorkspace}
@@ -106,7 +114,15 @@ const AllPage: NextPageWithLayout = () => {
<Head>
<title>{t('All Pages')} - AFFiNE</title>
</Head>
<WorkspaceTitle icon={<FolderIcon />}>{t('All pages')}</WorkspaceTitle>
<WorkspaceTitle
workspace={currentWorkspace}
currentPage={null}
isPreview={false}
isPublic={false}
icon={<FolderIcon />}
>
{t('All pages')}
</WorkspaceTitle>
<PageList
onOpenPage={onClickPage}
blockSuiteWorkspace={currentWorkspace.blockSuiteWorkspace}
@@ -41,7 +41,15 @@ const FavouritePage: NextPageWithLayout = () => {
<Head>
<title>{t('Favorites')} - AFFiNE</title>
</Head>
<WorkspaceTitle icon={<FavoriteIcon />}>{t('Favorites')}</WorkspaceTitle>
<WorkspaceTitle
workspace={currentWorkspace}
currentPage={null}
isPreview={false}
isPublic={false}
icon={<FavoriteIcon />}
>
{t('Favorites')}
</WorkspaceTitle>
<PageList
blockSuiteWorkspace={blockSuiteWorkspace}
onClickPage={onClickPage}
@@ -148,7 +148,13 @@ const SettingPage: NextPageWithLayout = () => {
<Head>
<title>{t('Settings')} - AFFiNE</title>
</Head>
<WorkspaceTitle icon={<SettingsIcon />}>
<WorkspaceTitle
workspace={currentWorkspace}
currentPage={null}
isPreview={false}
isPublic={false}
icon={<SettingsIcon />}
>
{t('Workspace Settings')}
</WorkspaceTitle>
<Setting
@@ -168,7 +174,13 @@ const SettingPage: NextPageWithLayout = () => {
<Head>
<title>{t('Settings')} - AFFiNE</title>
</Head>
<WorkspaceTitle icon={<SettingsIcon />}>
<WorkspaceTitle
workspace={currentWorkspace}
currentPage={null}
isPreview={false}
isPublic={false}
icon={<SettingsIcon />}
>
{t('Workspace Settings')}
</WorkspaceTitle>
<Setting
@@ -44,7 +44,13 @@ const TrashPage: NextPageWithLayout = () => {
<Head>
<title>{t('Trash')} - AFFiNE</title>
</Head>
<WorkspaceTitle icon={<DeleteTemporarilyIcon />}>
<WorkspaceTitle
workspace={currentWorkspace}
currentPage={null}
isPreview={false}
isPublic={false}
icon={<DeleteTemporarilyIcon />}
>
{t('Trash')}
</WorkspaceTitle>
<PageList