mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-07-17 10:06:17 +08:00
Merge branch 'develop' into feat/quick-search
This commit is contained in:
@@ -4,7 +4,7 @@ const { getGitVersion, getCommitHash } = require('./scripts/gitInfo');
|
||||
/** @type {import('next').NextConfig} */
|
||||
const nextConfig = {
|
||||
productionBrowserSourceMaps: true,
|
||||
reactStrictMode: true,
|
||||
reactStrictMode: false,
|
||||
swcMinify: false,
|
||||
publicRuntimeConfig: {
|
||||
NODE_ENV: process.env.NODE_ENV,
|
||||
|
||||
@@ -9,10 +9,10 @@
|
||||
"lint": "next lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"@blocksuite/blocks": "0.3.0-alpha.7",
|
||||
"@blocksuite/editor": "0.3.0-alpha.7",
|
||||
"@blocksuite/blocks": "0.3.0-alpha.8",
|
||||
"@blocksuite/editor": "0.3.0-alpha.8",
|
||||
"@blocksuite/icons": "^2.0.0",
|
||||
"@blocksuite/store": "0.3.0-alpha.7",
|
||||
"@blocksuite/store": "0.3.0-alpha.8",
|
||||
"@emotion/css": "^11.10.0",
|
||||
"@emotion/react": "^11.10.4",
|
||||
"@emotion/server": "^11.10.0",
|
||||
|
||||
@@ -75,18 +75,14 @@ const toolbarList2 = [
|
||||
const UndoRedo = () => {
|
||||
const [canUndo, setCanUndo] = useState(false);
|
||||
const [canRedo, setCanRedo] = useState(false);
|
||||
const { currentPage } = useEditor();
|
||||
useEffect(() => {
|
||||
if (!currentPage) return;
|
||||
const { onHistoryUpdated, page } = useEditor();
|
||||
|
||||
currentPage.signals.historyUpdated.on(() => {
|
||||
setCanUndo(currentPage.canUndo);
|
||||
setCanRedo(currentPage.canRedo);
|
||||
useEffect(() => {
|
||||
onHistoryUpdated(page => {
|
||||
setCanUndo(page.canUndo);
|
||||
setCanRedo(page.canRedo);
|
||||
});
|
||||
return () => {
|
||||
currentPage.signals.historyUpdated.dispose();
|
||||
};
|
||||
}, [currentPage]);
|
||||
}, [onHistoryUpdated]);
|
||||
|
||||
return (
|
||||
<StyledToolbarWrapper>
|
||||
@@ -94,7 +90,7 @@ const UndoRedo = () => {
|
||||
<StyledToolbarItem
|
||||
disable={!canUndo}
|
||||
onClick={() => {
|
||||
currentPage?.undo();
|
||||
page?.undo();
|
||||
}}
|
||||
>
|
||||
<UndoIcon />
|
||||
@@ -104,7 +100,7 @@ const UndoRedo = () => {
|
||||
<StyledToolbarItem
|
||||
disable={!canRedo}
|
||||
onClick={() => {
|
||||
currentPage?.redo();
|
||||
page?.redo();
|
||||
}}
|
||||
>
|
||||
<RedoIcon />
|
||||
|
||||
@@ -2,7 +2,7 @@ import { styled, displayFlex } from '@/styles';
|
||||
|
||||
export const StyledEdgelessToolbar = styled.div(({ theme }) => ({
|
||||
height: '320px',
|
||||
position: 'fixed',
|
||||
position: 'absolute',
|
||||
left: '12px',
|
||||
top: 0,
|
||||
bottom: 0,
|
||||
|
||||
@@ -3,7 +3,7 @@ import { useEditor, initDefaultContent } from '@/providers/editor-provider';
|
||||
|
||||
export const Editor = () => {
|
||||
const editorContainer = useRef<HTMLDivElement>(null);
|
||||
const { editor } = useEditor();
|
||||
const { editor, onHistoryUpdated } = useEditor();
|
||||
const ref = useRef<any>();
|
||||
useEffect(() => {
|
||||
if (editor && ref.current?.page.id !== editor?.page.id) {
|
||||
|
||||
@@ -142,12 +142,8 @@ const HeaderRight = () => {
|
||||
};
|
||||
|
||||
export const Header = ({ children }: PropsWithChildren<{}>) => {
|
||||
const { pageList } = useEditor();
|
||||
|
||||
const [showWarning, setShowWarning] = useState(shouldShowWarning());
|
||||
const router = useRouter();
|
||||
const currentPageMeta = pageList.find(p => p.id === router.query.pageId);
|
||||
const isTrash = !!currentPageMeta?.trash;
|
||||
|
||||
return (
|
||||
<StyledHeaderContainer hasWarning={showWarning}>
|
||||
<BrowserWarning
|
||||
|
||||
@@ -18,18 +18,17 @@ export const PageHeader = () => {
|
||||
const [title, setTitle] = useState('');
|
||||
const [isHover, setIsHover] = useState(false);
|
||||
|
||||
const { editor } = useEditor();
|
||||
const { editor, onPropsUpdated } = useEditor();
|
||||
const { triggerQuickSearchModal } = useModal();
|
||||
|
||||
useEffect(() => {
|
||||
if (editor?.model) {
|
||||
setTitle(editor.model.title || 'Untitled');
|
||||
editor.model.propsUpdated.on(() => {
|
||||
setTitle(editor.model.title);
|
||||
});
|
||||
}
|
||||
return () => {
|
||||
editor?.model?.propsUpdated.dispose();
|
||||
};
|
||||
onPropsUpdated(editor => {
|
||||
setTitle(editor.model.title);
|
||||
});
|
||||
}, [onPropsUpdated]);
|
||||
|
||||
useEffect(() => {
|
||||
setTitle(editor?.model.title || 'Untitled');
|
||||
}, [editor]);
|
||||
|
||||
return (
|
||||
|
||||
@@ -16,7 +16,9 @@ export const DateCell = ({
|
||||
// dayjs().format('L LT');
|
||||
return (
|
||||
<TableCell ellipsis={true}>
|
||||
{dayjs(pageMeta[dateKey] as string).format('YYYY-MM-DD HH:MM')}
|
||||
{pageMeta[dateKey] === undefined
|
||||
? '--'
|
||||
: dayjs(pageMeta[dateKey] as string).format('YYYY-MM-DD HH:mm')}
|
||||
</TableCell>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,16 +1,21 @@
|
||||
import { PageMeta, useEditor } from '@/providers/editor-provider';
|
||||
import { FavouritedIcon, FavouritesIcon } from '@blocksuite/icons';
|
||||
import {
|
||||
FavouritedIcon,
|
||||
FavouritesIcon,
|
||||
PaperIcon,
|
||||
EdgelessIcon,
|
||||
} from '@blocksuite/icons';
|
||||
import {
|
||||
StyledFavoriteButton,
|
||||
StyledTableContainer,
|
||||
StyledTableRow,
|
||||
StyledTitleContent,
|
||||
StyledTitleLink,
|
||||
StyledTitleWrapper,
|
||||
} from './styles';
|
||||
import { Table, TableBody, TableCell, TableHead, TableRow } from '@/ui/table';
|
||||
import { OperationCell, TrashOperationCell } from './operation-cell';
|
||||
import Empty from './empty';
|
||||
import Link from 'next/link';
|
||||
import { Content } from '@/ui/layout';
|
||||
import React from 'react';
|
||||
import DateCell from '@/components/page-list/date-cell';
|
||||
const FavoriteTag = ({ pageMeta }: { pageMeta: PageMeta }) => {
|
||||
@@ -50,7 +55,7 @@ export const PageList = ({
|
||||
<TableCell proportion={0.5}>Documents</TableCell>
|
||||
<TableCell proportion={0.2}>Created</TableCell>
|
||||
<TableCell proportion={0.2}>
|
||||
{isTrash ? 'Moved to Trash' : 'Uploaded'}
|
||||
{isTrash ? 'Moved to Trash' : 'Updated'}
|
||||
</TableCell>
|
||||
<TableCell proportion={0.1}></TableCell>
|
||||
</TableRow>
|
||||
@@ -61,20 +66,25 @@ export const PageList = ({
|
||||
<StyledTableRow key={`${pageMeta.id}-${index}`}>
|
||||
<TableCell>
|
||||
<StyledTitleWrapper>
|
||||
<Link
|
||||
<StyledTitleLink
|
||||
href={{ pathname: '/', query: { pageId: pageMeta.id } }}
|
||||
>
|
||||
<StyledTitleContent>
|
||||
{pageMeta.title || pageMeta.id}
|
||||
</StyledTitleContent>
|
||||
</Link>
|
||||
{pageMeta.mode === 'edgeless' ? (
|
||||
<EdgelessIcon />
|
||||
) : (
|
||||
<PaperIcon />
|
||||
)}
|
||||
<Content ellipsis={true} color="inherit">
|
||||
{pageMeta.title || 'Untitled'}
|
||||
</Content>
|
||||
</StyledTitleLink>
|
||||
{showFavoriteTag && <FavoriteTag pageMeta={pageMeta} />}
|
||||
</StyledTitleWrapper>
|
||||
</TableCell>
|
||||
<DateCell pageMeta={pageMeta} dateKey="createDate" />
|
||||
<DateCell
|
||||
pageMeta={pageMeta}
|
||||
dateKey={isTrash ? 'trashDate' : 'createDate'}
|
||||
dateKey={isTrash ? 'trashDate' : 'updatedDate'}
|
||||
/>
|
||||
<TableCell style={{ padding: 0 }}>
|
||||
{isTrash ? (
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { displayFlex, styled, textEllipsis } from '@/styles';
|
||||
import { TableRow } from '@/ui/table';
|
||||
import Link from 'next/link';
|
||||
|
||||
export const StyledTableContainer = styled.div(() => {
|
||||
return {
|
||||
@@ -22,11 +23,23 @@ export const StyledTitleWrapper = styled.div(({ theme }) => {
|
||||
},
|
||||
};
|
||||
});
|
||||
export const StyledTitleContent = styled.div(({ theme }) => {
|
||||
export const StyledTitleLink = styled(Link)(({ theme }) => {
|
||||
return {
|
||||
maxWidth: '90%',
|
||||
maxWidth: '80%',
|
||||
marginRight: '18px',
|
||||
...textEllipsis(1),
|
||||
...displayFlex('flex-start', 'center'),
|
||||
color: theme.colors.textColor,
|
||||
'>svg': {
|
||||
fontSize: '24px',
|
||||
marginRight: '12px',
|
||||
color: theme.colors.iconColor,
|
||||
},
|
||||
':hover': {
|
||||
color: theme.colors.textColor,
|
||||
'>svg': {
|
||||
color: theme.colors.primaryColor,
|
||||
},
|
||||
},
|
||||
};
|
||||
});
|
||||
export const StyledFavoriteButton = styled.button<{ favorite: boolean }>(
|
||||
|
||||
@@ -58,7 +58,7 @@ const FavoriteList = ({ showList }: { showList: boolean }) => {
|
||||
export const WorkSpaceSliderBar = () => {
|
||||
const { triggerQuickSearchModal, triggerImportModal } = useModal();
|
||||
const [show, setShow] = useState(false);
|
||||
const [showSubFavorite, setShowSubFavorite] = useState(false);
|
||||
const [showSubFavorite, setShowSubFavorite] = useState(true);
|
||||
const { createPage, getPageMeta, openPage } = useEditor();
|
||||
const router = useRouter();
|
||||
|
||||
|
||||
@@ -30,6 +30,7 @@ const StyledPage = styled('div')(({ theme }) => {
|
||||
const StyledWrapper = styled('div')(({ theme }) => {
|
||||
return {
|
||||
flexGrow: 1,
|
||||
position: 'relative',
|
||||
};
|
||||
});
|
||||
|
||||
|
||||
@@ -4,29 +4,28 @@ import type { PropsWithChildren } from 'react';
|
||||
import dynamic from 'next/dynamic';
|
||||
import Loading from './loading';
|
||||
import { Page, Workspace } from '@blocksuite/store';
|
||||
import useEditorHandler from './useEditorHandler';
|
||||
import { EditorHandlers, PageMeta } from './interface';
|
||||
|
||||
import useEditorHandler from './hooks/useEditorHandler';
|
||||
import {
|
||||
EditorHandlers,
|
||||
PageMeta,
|
||||
EditorContextValue,
|
||||
EditorContextProps,
|
||||
} from './interface';
|
||||
import usePropsUpdated from './hooks/usePropsUpdated';
|
||||
import useHistoryUpdated from './hooks/useHistoryUpdated';
|
||||
import useMode from './hooks/useMode';
|
||||
// Blocksuite has to be imported dynamically since it has a lot of effects
|
||||
const DynamicEditor = dynamic(() => import('./editor-reactor'), {
|
||||
ssr: false,
|
||||
});
|
||||
|
||||
type EditorContextValue = {
|
||||
mode: EditorContainer['mode'];
|
||||
setMode: (mode: EditorContainer['mode']) => void;
|
||||
currentPage: Page | void;
|
||||
editor: EditorContainer | void;
|
||||
pageList: PageMeta[];
|
||||
} & EditorHandlers;
|
||||
|
||||
type EditorContextProps = PropsWithChildren<{}>;
|
||||
|
||||
export const EditorContext = createContext<EditorContextValue>({
|
||||
mode: 'page',
|
||||
setMode: () => {},
|
||||
pageList: [],
|
||||
currentPage: undefined,
|
||||
page: undefined,
|
||||
onPropsUpdated: () => {},
|
||||
onHistoryUpdated: () => {},
|
||||
editor: undefined,
|
||||
...({} as EditorHandlers),
|
||||
});
|
||||
@@ -37,17 +36,24 @@ export const EditorProvider = ({
|
||||
children,
|
||||
}: PropsWithChildren<EditorContextProps>) => {
|
||||
const [workspace, setWorkspace] = useState<Workspace>();
|
||||
const [currentPage, setCurrentPage] = useState<Page>();
|
||||
const [page, setPage] = useState<Page>();
|
||||
const [pageList, setPageList] = useState<PageMeta[]>([]);
|
||||
const [editor, setEditor] = useState<EditorContainer>();
|
||||
const [mode, setMode] = useState<EditorContainer['mode']>('page');
|
||||
|
||||
const editorHandlers = useEditorHandler(workspace);
|
||||
const { mode, setMode } = useMode({ workspace, page });
|
||||
|
||||
const editorHandlers = useEditorHandler({ workspace, editor });
|
||||
const onPropsUpdated = usePropsUpdated(editor);
|
||||
const onHistoryUpdated = useHistoryUpdated(page);
|
||||
// Modify the updatedDate when history change
|
||||
useEffect(() => {
|
||||
const event = new CustomEvent('affine.switch-mode', { detail: mode });
|
||||
window.dispatchEvent(event);
|
||||
}, [mode]);
|
||||
if (!workspace) {
|
||||
return;
|
||||
}
|
||||
onHistoryUpdated(page => {
|
||||
workspace.setPageMeta(page.id, { updatedDate: +new Date() });
|
||||
});
|
||||
}, [workspace, onHistoryUpdated]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!workspace) {
|
||||
@@ -67,21 +73,23 @@ export const EditorProvider = ({
|
||||
<EditorContext.Provider
|
||||
value={{
|
||||
editor,
|
||||
currentPage,
|
||||
page,
|
||||
mode,
|
||||
setMode,
|
||||
pageList,
|
||||
onHistoryUpdated,
|
||||
onPropsUpdated,
|
||||
...editorHandlers,
|
||||
}}
|
||||
>
|
||||
<DynamicEditor
|
||||
workspace={workspace}
|
||||
currentPage={currentPage}
|
||||
currentPage={page}
|
||||
setEditor={setEditor}
|
||||
setWorkspace={setWorkspace}
|
||||
setCurrentPage={setCurrentPage}
|
||||
setCurrentPage={setPage}
|
||||
/>
|
||||
{workspace && currentPage && editor ? children : <Loading />}
|
||||
{workspace && page && editor ? children : <Loading />}
|
||||
</EditorContext.Provider>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -89,7 +89,7 @@ const EditorReactor = ({
|
||||
|
||||
const savedPageId = workspace.meta.pageMetas[0]?.id;
|
||||
if (savedPageId) {
|
||||
setCurrentPage(workspace.getPage(savedPageId));
|
||||
setCurrentPage(workspace.getPage(savedPageId) as Page);
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -103,8 +103,18 @@ const EditorReactor = ({
|
||||
if (!currentPage) {
|
||||
return;
|
||||
}
|
||||
setEditor(createEditor(currentPage));
|
||||
}, [currentPage, setEditor]);
|
||||
const editor = createEditor(currentPage);
|
||||
const pageMeta = workspace?.meta.pageMetas.find(
|
||||
p => p.id === currentPage.pageId.replace('space:', '')
|
||||
);
|
||||
|
||||
if (pageMeta?.mode) {
|
||||
// @ts-ignore
|
||||
editor.mode = pageMeta.mode;
|
||||
}
|
||||
|
||||
setEditor(editor);
|
||||
}, [workspace, currentPage, setEditor]);
|
||||
|
||||
useEffect(() => {
|
||||
const version = pkg.dependencies['@blocksuite/editor'].substring(1);
|
||||
|
||||
+21
-6
@@ -1,10 +1,17 @@
|
||||
import { QueryContent } from '@blocksuite/store/dist/workspace/search';
|
||||
import { createPage, initialPage, generateDefaultPageId } from './utils';
|
||||
import { createPage, initialPage, generateDefaultPageId } from '../utils';
|
||||
import { Workspace } from '@blocksuite/store';
|
||||
import { useRouter } from 'next/router';
|
||||
import { EditorHandlers } from './interface';
|
||||
import { EditorHandlers, PageMeta } from '../interface';
|
||||
import { EditorContainer } from '@blocksuite/editor';
|
||||
|
||||
export const useEditorHandler = (workspace?: Workspace): EditorHandlers => {
|
||||
export const useEditorHandler = ({
|
||||
editor,
|
||||
workspace,
|
||||
}: {
|
||||
workspace?: Workspace;
|
||||
editor?: EditorContainer;
|
||||
}): EditorHandlers => {
|
||||
const router = useRouter();
|
||||
|
||||
return {
|
||||
@@ -15,7 +22,9 @@ export const useEditorHandler = (workspace?: Workspace): EditorHandlers => {
|
||||
},
|
||||
getPageMeta(pageId: string) {
|
||||
pageId = pageId.replace('space:', '');
|
||||
return workspace!.meta.pageMetas.find(page => page.id === pageId);
|
||||
return workspace!.meta.pageMetas.find(
|
||||
page => page.id === pageId
|
||||
) as PageMeta;
|
||||
},
|
||||
openPage: (pageId, query = {}) => {
|
||||
return router.push({
|
||||
@@ -29,8 +38,10 @@ export const useEditorHandler = (workspace?: Workspace): EditorHandlers => {
|
||||
toggleDeletePage: pageId => {
|
||||
const pageMeta = workspace!.meta.pageMetas.find(p => p.id === pageId);
|
||||
if (pageMeta) {
|
||||
workspace!.meta.setPage(pageId, { trashDate: new Date().getTime() });
|
||||
workspace!.setPageMeta(pageId, { trash: !pageMeta.trash });
|
||||
workspace!.setPageMeta(pageId, {
|
||||
trash: !pageMeta.trash,
|
||||
trashDate: +new Date(),
|
||||
});
|
||||
}
|
||||
},
|
||||
favoritePage: pageId => {
|
||||
@@ -52,6 +63,10 @@ export const useEditorHandler = (workspace?: Workspace): EditorHandlers => {
|
||||
search: (query: QueryContent) => {
|
||||
return workspace!.search(query);
|
||||
},
|
||||
changeEditorMode: (pageId: string) => {
|
||||
editor!.mode = editor!.mode === 'page' ? 'edgeless' : 'page';
|
||||
workspace?.setPageMeta(pageId, { mode: editor!.mode });
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
@@ -0,0 +1,34 @@
|
||||
import { useEffect, useRef } from 'react';
|
||||
import { Page } from '@blocksuite/store';
|
||||
import { EventCallBack } from '../interface';
|
||||
|
||||
export type UseHistoryUpdated = (page?: Page) => EventCallBack<Page>;
|
||||
|
||||
export const useHistoryUpdate: UseHistoryUpdated = page => {
|
||||
const callbackQueue = useRef<((page: Page) => void)[]>([]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!page) {
|
||||
return;
|
||||
}
|
||||
|
||||
setTimeout(() => {
|
||||
page.signals.historyUpdated.on(() => {
|
||||
callbackQueue.current.forEach(callback => {
|
||||
callback(page);
|
||||
});
|
||||
});
|
||||
}, 300);
|
||||
|
||||
return () => {
|
||||
callbackQueue.current = [];
|
||||
page.signals.historyUpdated.dispose();
|
||||
};
|
||||
}, [page]);
|
||||
|
||||
return callback => {
|
||||
callbackQueue.current.push(callback);
|
||||
};
|
||||
};
|
||||
|
||||
export default useHistoryUpdate;
|
||||
@@ -0,0 +1,43 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import { Page, Workspace } from '@blocksuite/store';
|
||||
import { EditorContainer } from '@blocksuite/editor';
|
||||
|
||||
export const useMode = ({
|
||||
page,
|
||||
workspace,
|
||||
}: {
|
||||
page?: Page;
|
||||
workspace?: Workspace;
|
||||
}) => {
|
||||
const [mode, setMode] = useState<EditorContainer['mode']>('page');
|
||||
|
||||
useEffect(() => {
|
||||
if (!page || !workspace) {
|
||||
return;
|
||||
}
|
||||
const pageMeta = workspace.meta.pageMetas.find(
|
||||
p => p.id === page.pageId.replace('space:', '')
|
||||
);
|
||||
|
||||
if (pageMeta?.mode) {
|
||||
// @ts-ignore
|
||||
setMode(pageMeta.mode);
|
||||
}
|
||||
}, [page, workspace]);
|
||||
|
||||
useEffect(() => {
|
||||
// FIXME
|
||||
const editorContainer = document.querySelector('editor-container');
|
||||
editorContainer?.setAttribute('mode', mode as string);
|
||||
if (page && workspace) {
|
||||
workspace.setPageMeta(page.id, { mode });
|
||||
}
|
||||
}, [workspace, page, mode]);
|
||||
|
||||
return {
|
||||
mode,
|
||||
setMode,
|
||||
};
|
||||
};
|
||||
|
||||
export default useMode;
|
||||
@@ -0,0 +1,36 @@
|
||||
import { useEffect, useRef } from 'react';
|
||||
import { EditorContainer } from '@blocksuite/editor';
|
||||
import { EventCallBack } from '../interface';
|
||||
|
||||
export type UsePropsUpdated = (
|
||||
editor?: EditorContainer
|
||||
) => EventCallBack<EditorContainer>;
|
||||
|
||||
export const usePropsUpdated: UsePropsUpdated = editor => {
|
||||
const callbackQueue = useRef<((editor: EditorContainer) => void)[]>([]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!editor?.model) {
|
||||
return;
|
||||
}
|
||||
|
||||
setTimeout(() => {
|
||||
editor.model?.propsUpdated.on(() => {
|
||||
callbackQueue.current.forEach(callback => {
|
||||
callback(editor);
|
||||
});
|
||||
});
|
||||
}, 300);
|
||||
|
||||
return () => {
|
||||
callbackQueue.current = [];
|
||||
editor?.model?.propsUpdated.dispose();
|
||||
};
|
||||
}, [editor]);
|
||||
|
||||
return callback => {
|
||||
callbackQueue.current.push(callback);
|
||||
};
|
||||
};
|
||||
|
||||
export default usePropsUpdated;
|
||||
@@ -1,14 +1,29 @@
|
||||
import { PropsWithChildren } from 'react';
|
||||
import { Page } from '@blocksuite/store';
|
||||
import { QueryContent } from '@blocksuite/store/dist/workspace/search';
|
||||
import { PageMeta as OriginalPageMeta } from '@blocksuite/store';
|
||||
import { EditorContainer } from '@blocksuite/editor';
|
||||
|
||||
export interface PageMeta {
|
||||
id: string;
|
||||
title: string;
|
||||
export type EventCallBack<T> = (callback: (props: T) => void) => void;
|
||||
export type EditorContextProps = PropsWithChildren<{}>;
|
||||
|
||||
export type EditorContextValue = {
|
||||
mode: EditorContainer['mode'];
|
||||
setMode: (mode: EditorContainer['mode']) => void;
|
||||
page: Page | void;
|
||||
editor: EditorContainer | void;
|
||||
pageList: PageMeta[];
|
||||
onHistoryUpdated: EventCallBack<Page>;
|
||||
onPropsUpdated: EventCallBack<EditorContainer>;
|
||||
} & EditorHandlers;
|
||||
|
||||
export type PageMeta = {
|
||||
favorite: boolean;
|
||||
trash: boolean;
|
||||
createDate: number;
|
||||
trashDate: number | null;
|
||||
}
|
||||
trashDate: number | void;
|
||||
updatedDate: number | void;
|
||||
mode: EditorContainer['mode'];
|
||||
} & OriginalPageMeta;
|
||||
|
||||
export type EditorHandlers = {
|
||||
createPage: (pageId?: string) => Promise<Page>;
|
||||
@@ -23,4 +38,5 @@ export type EditorHandlers = {
|
||||
toggleFavoritePage: (pageId: string) => void;
|
||||
permanentlyDeletePage: (pageId: string) => void;
|
||||
search: (query: QueryContent) => Map<string, string | undefined>;
|
||||
changeEditorMode: (pageId: string) => void;
|
||||
};
|
||||
|
||||
@@ -21,7 +21,7 @@ export const createPage = (
|
||||
workspace.createPage(pageId);
|
||||
workspace.signals.pageAdded.once(addedPageId => {
|
||||
const page = workspace!.getPage(addedPageId);
|
||||
resolve(page);
|
||||
resolve(page as Page);
|
||||
});
|
||||
});
|
||||
};
|
||||
@@ -36,3 +36,13 @@ export const initialPage = (page: Page) => {
|
||||
export const generateDefaultPageId = () => {
|
||||
return new Date().getTime().toString();
|
||||
};
|
||||
|
||||
export const getEditorMode = () => {
|
||||
const editorContainer = document.querySelector('editor-container');
|
||||
return editorContainer?.mode;
|
||||
};
|
||||
|
||||
export const setEditorMode = (mode: EditorContainer['mode']) => {
|
||||
const editorContainer = document.querySelector('editor-container');
|
||||
editorContainer?.setAttribute('mode', mode as string);
|
||||
};
|
||||
|
||||
Generated
+24
-17
@@ -22,10 +22,10 @@ importers:
|
||||
|
||||
packages/app:
|
||||
specifiers:
|
||||
'@blocksuite/blocks': 0.3.0-alpha.7
|
||||
'@blocksuite/editor': 0.3.0-alpha.7
|
||||
'@blocksuite/blocks': 0.3.0-alpha.8
|
||||
'@blocksuite/editor': 0.3.0-alpha.8
|
||||
'@blocksuite/icons': ^2.0.0
|
||||
'@blocksuite/store': 0.3.0-alpha.7
|
||||
'@blocksuite/store': 0.3.0-alpha.8
|
||||
'@emotion/css': ^11.10.0
|
||||
'@emotion/react': ^11.10.4
|
||||
'@emotion/server': ^11.10.0
|
||||
@@ -55,10 +55,10 @@ importers:
|
||||
react-dom: 18.2.0
|
||||
typescript: 4.8.3
|
||||
dependencies:
|
||||
'@blocksuite/blocks': 0.3.0-alpha.7
|
||||
'@blocksuite/editor': 0.3.0-alpha.7
|
||||
'@blocksuite/blocks': 0.3.0-alpha.8
|
||||
'@blocksuite/editor': 0.3.0-alpha.8
|
||||
'@blocksuite/icons': 2.0.0_w5j4k42lgipnm43s3brx6h3c34
|
||||
'@blocksuite/store': 0.3.0-alpha.7
|
||||
'@blocksuite/store': 0.3.0-alpha.8
|
||||
'@emotion/css': 11.10.0
|
||||
'@emotion/react': 11.10.4_w5j4k42lgipnm43s3brx6h3c34
|
||||
'@emotion/server': 11.10.0_@emotion+css@11.10.0
|
||||
@@ -176,10 +176,11 @@ packages:
|
||||
to-fast-properties: 2.0.0
|
||||
dev: false
|
||||
|
||||
/@blocksuite/blocks/0.3.0-alpha.7:
|
||||
resolution: {integrity: sha512-RV6yiKSVIr3hRkT1MYp15Bt7i615aahqQ7CEJZQAuDMr2OVRzAGeXJpjt3e69HWW5os4fs4yOsC1PiS8VuuWRg==}
|
||||
/@blocksuite/blocks/0.3.0-alpha.8:
|
||||
resolution: {integrity: sha512-Q7md4N1H0lTMG0nX1PnAdSlTjBfNX4nFLlcX3SrdgjSM9QOu0G6E6OvfHHHCj4SJPnzyHH5xb6Lb0jU9Lpas6Q==}
|
||||
dependencies:
|
||||
'@blocksuite/store': 0.3.0-alpha.7
|
||||
'@blocksuite/store': 0.3.0-alpha.8
|
||||
'@tldraw/intersect': 1.8.0
|
||||
'@tldraw/vec': 1.8.0
|
||||
hotkeys-js: 3.10.0
|
||||
lit: 2.4.0
|
||||
@@ -192,11 +193,11 @@ packages:
|
||||
- utf-8-validate
|
||||
dev: false
|
||||
|
||||
/@blocksuite/editor/0.3.0-alpha.7:
|
||||
resolution: {integrity: sha512-vq5xgg2Ea1kbYDCYogBnmccg3Opw2DfQeiEQM5JRxqRBe6E2R4lZqZvksVj5fekY5Pl2Nrr73VgxTutjGS1u2g==}
|
||||
/@blocksuite/editor/0.3.0-alpha.8:
|
||||
resolution: {integrity: sha512-Sx5E69LMZkUcc37q2PLXAnNTHy9okn/UFBfcWG8i5LO/T8QpYJgbllZGJDx7A3qP8Uz+BQyhgI5gp8S/dnra7g==}
|
||||
dependencies:
|
||||
'@blocksuite/blocks': 0.3.0-alpha.7
|
||||
'@blocksuite/store': 0.3.0-alpha.7
|
||||
'@blocksuite/blocks': 0.3.0-alpha.8
|
||||
'@blocksuite/store': 0.3.0-alpha.8
|
||||
lit: 2.4.0
|
||||
marked: 4.1.1
|
||||
turndown: 7.1.1
|
||||
@@ -216,8 +217,8 @@ packages:
|
||||
react: 18.2.0
|
||||
dev: false
|
||||
|
||||
/@blocksuite/store/0.3.0-alpha.7:
|
||||
resolution: {integrity: sha512-dO+hx/6V5aun5+U1M7qRSQLdHpXYNa2TDr9747f+Xy8CoToyYQ5jTJ/KcjKEdNm36xg66N3sNBDarhAUzs3QOg==}
|
||||
/@blocksuite/store/0.3.0-alpha.8:
|
||||
resolution: {integrity: sha512-u63FWZSiYID8++tEIaQZ5FSj7NZu9XM2ZdTaTU+7PDEwucK5Gqo8+YrEC9gVl+2jkSW5cp43pxf2kZolUgkyYg==}
|
||||
dependencies:
|
||||
buffer: 6.0.3
|
||||
flexsearch: 0.7.21
|
||||
@@ -1091,6 +1092,12 @@ packages:
|
||||
tslib: 2.4.0
|
||||
dev: false
|
||||
|
||||
/@tldraw/intersect/1.8.0:
|
||||
resolution: {integrity: sha512-0UarshNpyq2+O4o0xHMJIBgF0E630mes5CkMoO+D5xgYppSBIkeqYDcv0ujsmAhMKX1O6Y0ShuuHeflBEULUoQ==}
|
||||
dependencies:
|
||||
'@tldraw/vec': 1.8.0
|
||||
dev: false
|
||||
|
||||
/@tldraw/vec/1.8.0:
|
||||
resolution: {integrity: sha512-GiS5Df3CzXY/fPBFcM0CKFERZfI4Cg1X33VPZX+NLo7Fwm/h9zu/aU24N1mG75Q9LuMnwKm7woxKr8BiUXGYCg==}
|
||||
dev: false
|
||||
@@ -1883,7 +1890,7 @@ packages:
|
||||
eslint-import-resolver-webpack:
|
||||
optional: true
|
||||
dependencies:
|
||||
'@typescript-eslint/parser': 5.38.0_76twfck5d7crjqrmw4yltga7zm
|
||||
'@typescript-eslint/parser': 5.38.0_eslint@8.22.0
|
||||
debug: 3.2.7
|
||||
eslint: 8.22.0
|
||||
eslint-import-resolver-node: 0.3.6
|
||||
@@ -1902,7 +1909,7 @@ packages:
|
||||
'@typescript-eslint/parser':
|
||||
optional: true
|
||||
dependencies:
|
||||
'@typescript-eslint/parser': 5.38.0_76twfck5d7crjqrmw4yltga7zm
|
||||
'@typescript-eslint/parser': 5.38.0_eslint@8.22.0
|
||||
array-includes: 3.1.5
|
||||
array.prototype.flat: 1.3.0
|
||||
debug: 2.6.9
|
||||
|
||||
Reference in New Issue
Block a user