luulam/AFFiNE
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

feat: modify interaction of new workspace (#1031)

Browse Source
This commit is contained in:
Qi
2023-02-16 00:45:05 +08:00
committed by GitHub
parent a360e30073
commit 8ead48a6d8
3 changed files with 28 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
apps/web/src/components/editor/index.tsx
View File

@@ -2,7 +2,6 @@ import { useEffect, useRef } from 'react';
import type { Page, Workspace } from '@blocksuite/store'; import type { Page, Workspace } from '@blocksuite/store';
import '@blocksuite/blocks'; import '@blocksuite/blocks';
import { EditorContainer } from '@blocksuite/editor'; import { EditorContainer } from '@blocksuite/editor';
import exampleMarkdown from '@/templates/Welcome-to-AFFiNE-Alpha-Downhills.md';
import { styled } from '@affine/component'; import { styled } from '@affine/component';
const StyledEditorContainer = styled('div')(() => { const StyledEditorContainer = styled('div')(() => {
@@ -16,11 +15,18 @@ type Props = {
page: Page; page: Page;
workspace: Workspace; workspace: Workspace;
setEditor: (editor: EditorContainer) => void; setEditor: (editor: EditorContainer) => void;
templateMarkdown?: string;
templateTitle?: string;
}; };
export const Editor = ({ page, workspace, setEditor }: Props) => { export const Editor = ({
page,
workspace,
setEditor,
templateMarkdown,
templateTitle = '',
}: Props) => {
const editorContainer = useRef<HTMLDivElement>(null); const editorContainer = useRef<HTMLDivElement>(null);
// const { currentWorkspace, currentPage, setEditor } = useAppState();
useEffect(() => { useEffect(() => {
const ret = () => { const ret = () => {
const node = editorContainer.current; const node = editorContainer.current;
@@ -34,14 +40,9 @@ export const Editor = ({ page, workspace, setEditor }: Props) => {
editorContainer.current?.appendChild(editor); editorContainer.current?.appendChild(editor);
if (page.isEmpty) { if (page.isEmpty) {
const isFirstPage = workspace?.meta.pageMetas.length === 1;
// Can not use useCurrentPageMeta to get new title, cause meta title will trigger rerender, but the second time can not remove title // Can not use useCurrentPageMeta to get new title, cause meta title will trigger rerender, but the second time can not remove title
const { title: metaTitle } = page.meta; const { title: metaTitle } = page.meta;
const title = metaTitle const title = metaTitle ? metaTitle : templateTitle;
? metaTitle
: isFirstPage
? 'Welcome to AFFiNE Alpha "Downhills"'
: '';
workspace?.setPageMeta(page.id, { title }); workspace?.setPageMeta(page.id, { title });
const pageBlockId = page.addBlockByFlavour('affine:page', { title }); const pageBlockId = page.addBlockByFlavour('affine:page', { title });
page.addBlockByFlavour('affine:surface', {}, null); page.addBlockByFlavour('affine:surface', {}, null);
@@ -49,10 +50,9 @@ export const Editor = ({ page, workspace, setEditor }: Props) => {
const frameId = page.addBlockByFlavour('affine:frame', {}, pageBlockId); const frameId = page.addBlockByFlavour('affine:frame', {}, pageBlockId);
// Add paragraph block inside frame block // Add paragraph block inside frame block
// If this is a first page in workspace, init an introduction markdown // If this is a first page in workspace, init an introduction markdown
if (isFirstPage) { if (templateMarkdown) {
editor.clipboard.importMarkdown(exampleMarkdown, frameId); editor.clipboard.importMarkdown(templateMarkdown, frameId);
workspace.setPageMeta(page.id, { title }); workspace.setPageMeta(page.id, { title });
page.resetHistory();
} else { } else {
page.addBlockByFlavour('affine:paragraph', {}, frameId); page.addBlockByFlavour('affine:paragraph', {}, frameId);
} }
@@ -61,7 +61,7 @@ export const Editor = ({ page, workspace, setEditor }: Props) => {
setEditor(editor); setEditor(editor);
return ret; return ret;
}, [workspace, page, setEditor]); }, [workspace, page, setEditor, templateTitle, templateMarkdown]);
return <StyledEditorContainer ref={editorContainer} />; return <StyledEditorContainer ref={editorContainer} />;
}; };

2
apps/web/src/components/workspace-modal/index.tsx
View File

@@ -86,7 +86,7 @@ export const WorkspaceModal = ({ open, onClose }: WorkspaceModalProps) => {
<WorkspaceCard <WorkspaceCard
workspaceData={item} workspaceData={item}
onClick={workspaceData => { onClick={workspaceData => {
router.replace(`/workspace/${workspaceData.id}`); router.replace(`/workspace/${workspaceData.id}/all`);
onClose(); onClose();
}} }}
key={index} key={index}

14
apps/web/src/pages/workspace/[workspaceId]/[pageId].tsx
View File

@@ -10,6 +10,8 @@ import dynamic from 'next/dynamic';
import Head from 'next/head'; import Head from 'next/head';
import { useTranslation } from '@affine/i18n'; import { useTranslation } from '@affine/i18n';
import { useGlobalState } from '@/store/app'; import { useGlobalState } from '@/store/app';
import exampleMarkdown from '@/templates/Welcome-to-AFFiNE-Alpha-Downhills.md';
const DynamicBlocksuite = dynamic(() => import('@/components/editor'), { const DynamicBlocksuite = dynamic(() => import('@/components/editor'), {
ssr: false, ssr: false,
}); });
@@ -44,6 +46,10 @@ const Page: NextPageWithLayout = () => {
const { t } = useTranslation(); const { t } = useTranslation();
// Only first workspace and first page will have template markdown
const shouldInitTemplateContent =
currentPage?.isEmpty &&
currentWorkspace?.blocksuiteWorkspace?.meta.pageMetas.length === 1;
return ( return (
<> <>
<Head> <Head>
@@ -58,6 +64,14 @@ const Page: NextPageWithLayout = () => {
page={currentPage} page={currentPage}
workspace={currentWorkspace.blocksuiteWorkspace} workspace={currentWorkspace.blocksuiteWorkspace}
setEditor={setEditor} setEditor={setEditor}
templateMarkdown={
shouldInitTemplateContent ? exampleMarkdown : undefined
}
templateTitle={
shouldInitTemplateContent
? 'Welcome to AFFiNE Alpha "Downhills"'
: undefined
}
/> />
<BlockHubAppender /> <BlockHubAppender />
</> </>