chore: remove useEditor

This commit is contained in:
QiShaoXuan
2022-12-20 19:30:38 +08:00
parent dacdb4f7d4
commit 2ede288724
28 changed files with 303 additions and 141 deletions
@@ -16,7 +16,9 @@ import {
} from './icons';
import { Tooltip } from '@/ui/tooltip';
import Slide from '@mui/material/Slide';
import { useEditor } from '@/providers/editor-provider';
import useCurrentPageMeta from '@/hooks/use-current-page-meta';
import { useAppState } from '@/providers/app-state-provider';
import useHistoryUpdated from '@/hooks/use-history-update';
const toolbarList1 = [
{
@@ -95,7 +97,8 @@ const toolbarList2 = [
const UndoRedo = () => {
const [canUndo, setCanUndo] = useState(false);
const [canRedo, setCanRedo] = useState(false);
const { onHistoryUpdated, page } = useEditor();
const { currentPage } = useAppState();
const onHistoryUpdated = useHistoryUpdated();
useEffect(() => {
onHistoryUpdated(page => {
@@ -110,7 +113,7 @@ const UndoRedo = () => {
<StyledToolbarItem
disable={!canUndo}
onClick={() => {
page?.undo();
currentPage?.undo();
}}
>
<UndoIcon />
@@ -120,7 +123,7 @@ const UndoRedo = () => {
<StyledToolbarItem
disable={!canRedo}
onClick={() => {
page?.redo();
currentPage?.redo();
}}
>
<RedoIcon />
@@ -131,7 +134,7 @@ const UndoRedo = () => {
};
export const EdgelessToolbar = () => {
const { mode } = useEditor();
const { mode } = useCurrentPageMeta() || {};
return (
<Slide
@@ -13,8 +13,8 @@ import type {
} from './type';
import { useTheme } from '@/providers/themeProvider';
import { EdgelessIcon, PaperIcon } from './icons';
import { useEditor } from '@/providers/editor-provider';
import { useAppState } from '@/providers/app-state-provider/context';
import useCurrentPageMeta from '@/hooks/use-current-page-meta';
import { usePageHelper } from '@/hooks/use-page-helper';
const PaperItem = ({ active }: { active?: boolean }) => {
const {
@@ -67,9 +67,8 @@ export const EditorModeSwitch = ({
style = {},
}: AnimateRadioProps) => {
const { mode: themeMode } = useTheme();
const { getPageMeta, currentPage } = useAppState();
const { mode, setMode } = useEditor();
const pageMeta = currentPage?.pageId ? getPageMeta(currentPage.pageId) : null;
const { changePageMode } = usePageHelper();
const { trash, mode = 'page', id = '' } = useCurrentPageMeta() || {};
const modifyRadioItemStatus = (): RadioItemStatus => {
return {
@@ -103,7 +102,7 @@ export const EditorModeSwitch = ({
data-testid="editor-mode-switcher"
shrink={!isHover}
style={style}
disabled={!!pageMeta?.trash}
disabled={!!trash}
>
<AnimateRadioItem
isLeft={true}
@@ -112,7 +111,7 @@ export const EditorModeSwitch = ({
active={mode === 'page'}
status={radioItemStatus.left}
onClick={() => {
setMode('page');
changePageMode(id, 'page');
}}
onMouseEnter={() => {
setRadioItemStatus({
@@ -132,7 +131,7 @@ export const EditorModeSwitch = ({
active={mode === 'edgeless'}
status={radioItemStatus.right}
onClick={() => {
setMode('edgeless');
changePageMode(id, 'edgeless');
}}
onMouseEnter={() => {
setRadioItemStatus({
@@ -6,18 +6,19 @@ import {
StyledTitleWrapper,
} from './styles';
import { Content } from '@/ui/layout';
import { useEditor } from '@/providers/editor-provider';
import { useAppState } from '@/providers/app-state-provider/context';
import EditorModeSwitch from '@/components/editor-mode-switch';
import QuickSearchButton from './quick-search-button';
import Header from './header';
import usePropsUpdated from '@/hooks/use-props-updated';
import useCurrentPageMeta from '@/hooks/use-current-page-meta';
export const EditorHeader = () => {
const [title, setTitle] = useState('');
const [isHover, setIsHover] = useState(false);
const { getPageMeta, currentPage, editor } = useAppState();
const { onPropsUpdated } = useEditor();
const { editor } = useAppState();
const pageMeta = useCurrentPageMeta();
const onPropsUpdated = usePropsUpdated();
useEffect(() => {
onPropsUpdated(editor => {
@@ -32,8 +33,6 @@ export const EditorHeader = () => {
}, 300);
}, [editor]);
const pageMeta = currentPage?.pageId ? getPageMeta(currentPage.pageId) : null;
return (
<Header>
{title && (
+13 -17
View File
@@ -17,7 +17,6 @@ import {
FavouritedIcon,
TrashIcon,
} from '@blocksuite/icons';
import { useEditor } from '@/providers/editor-provider';
import { useAppState } from '@/providers/app-state-provider/context';
import ThemeModeSwitch from '@/components/theme-mode-switch';
import { IconButton, Button } from '@/ui/button';
@@ -31,18 +30,16 @@ import { toast } from '@/components/toast';
import useCurrentPageMeta from '@/hooks/use-current-page-meta';
import { usePageHelper } from '@/hooks/use-page-helper';
const PopoverContent = () => {
const { getPageMeta, editor, currentPage } = useAppState();
const { editor } = useAppState();
const { toggleFavoritePage, toggleDeletePage } = usePageHelper();
const { mode, setMode } = useEditor();
const { changePageMode } = usePageHelper();
const { confirm } = useConfirm();
const { id, favorite, title } = (currentPage?.id
? getPageMeta(currentPage.id)
: null) ?? {
id: '',
favorite: false,
title: '',
};
const {
mode = 'page',
id = '',
favorite = false,
title = '',
} = useCurrentPageMeta() || {};
return (
<>
@@ -58,7 +55,7 @@ const PopoverContent = () => {
<MenuItem
icon={mode === 'page' ? <EdgelessIcon /> : <PaperIcon />}
onClick={() => {
setMode(mode === 'page' ? 'edgeless' : 'page');
changePageMode(id);
}}
>
Convert to {mode === 'page' ? 'Edgeless' : 'Page'}
@@ -128,11 +125,12 @@ const BrowserWarning = ({
};
const HeaderRight = () => {
const { pageList, permanentlyDeletePage } = useEditor();
const { currentWorkspaceId, toggleDeletePage } = useAppState();
const { permanentlyDeletePage } = usePageHelper();
const { currentWorkspaceId } = useAppState();
const { toggleDeletePage } = usePageHelper();
const { confirm } = useConfirm();
const router = useRouter();
const currentPageMeta = pageList.find(p => p.id === router.query.pageId);
const currentPageMeta = useCurrentPageMeta();
const isTrash = !!currentPageMeta?.trash;
if (isTrash) {
@@ -188,8 +186,6 @@ const HeaderRight = () => {
export const Header = ({ children }: PropsWithChildren<{}>) => {
const [showWarning, setShowWarning] = useState(shouldShowWarning());
const currentPageMeta = useCurrentPageMeta();
console.log('currentPageMeta', currentPageMeta);
return (
<StyledHeaderContainer hasWarning={showWarning}>
<BrowserWarning
@@ -8,12 +8,11 @@ import {
import { CloseIcon, ContactIcon, HelpIcon, KeyboardIcon } from './icons';
import Grow from '@mui/material/Grow';
import { Tooltip } from '@/ui/tooltip';
import { useEditor } from '@/providers/editor-provider';
import { useModal } from '@/providers/global-modal-provider';
import { useTheme } from '@/providers/themeProvider';
import useCurrentPageMeta from '@/hooks/use-current-page-meta';
export type IslandItemNames = 'contact' | 'shortcuts';
// export type IslandShowMap = Record<IslandItemNames, boolean>;
export const HelpIsland = ({
showList = ['contact', 'shortcuts'],
@@ -22,7 +21,7 @@ export const HelpIsland = ({
}) => {
const [showContent, setShowContent] = useState(false);
const { mode } = useTheme();
const { mode: editorMode } = useEditor();
const { mode: editorMode } = useCurrentPageMeta() || {};
const { triggerShortcutsModal, triggerContactModal } = useModal();
const isEdgelessDark = mode === 'dark' && editorMode === 'edgeless';
@@ -1,6 +1,6 @@
import localizedFormat from 'dayjs/plugin/localizedFormat';
import dayjs from 'dayjs';
import { PageMeta } from '@/providers/editor-provider';
import { PageMeta } from '@/providers/app-state-provider';
import { TableCell } from '@/ui/table';
import React from 'react';
@@ -1,4 +1,4 @@
import { PageMeta, useEditor } from '@/providers/editor-provider';
import { PageMeta } from '@/providers/app-state-provider';
import {
FavouritedIcon,
FavouritesIcon,
@@ -1,7 +1,5 @@
import { PageMeta, useEditor } from '@/providers/editor-provider';
import { useConfirm } from '@/providers/confirm-provider';
import { useAppState } from '@/providers/app-state-provider/context';
import { useGoToPage } from '@/providers/app-state-provider/hooks';
import { useAppState, PageMeta } from '@/providers/app-state-provider';
import { Menu, MenuItem } from '@/ui/menu';
import { Wrapper } from '@/ui/layout';
import { IconButton } from '@/ui/button';
@@ -19,7 +17,7 @@ import { usePageHelper } from '@/hooks/use-page-helper';
export const OperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
const { id, favorite } = pageMeta;
const goToPage = useGoToPage();
const { openPage } = usePageHelper();
const { toggleFavoritePage, toggleDeletePage } = usePageHelper();
const { confirm } = useConfirm();
@@ -36,7 +34,7 @@ export const OperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
</MenuItem>
<MenuItem
onClick={() => {
goToPage(id);
openPage(id);
}}
icon={<OpenInNewIcon />}
>
@@ -73,9 +71,9 @@ export const OperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
export const TrashOperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
const { id } = pageMeta;
const goToPage = useGoToPage();
const { getPageMeta, toggleDeletePage } = useAppState();
const { permanentlyDeletePage } = useEditor();
const { openPage } = usePageHelper();
const { getPageMeta } = useAppState();
const { toggleDeletePage, permanentlyDeletePage } = usePageHelper();
const { confirm } = useConfirm();
return (
@@ -86,7 +84,7 @@ export const TrashOperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
onClick={() => {
toggleDeletePage(id);
toast(`${getPageMeta(id)?.title || 'Untitled'} restored`);
goToPage(id);
openPage(id);
}}
>
<RestoreIcon />
@@ -4,12 +4,12 @@ import { StyledModalFooterContent } from './style';
import { useModal } from '@/providers/global-modal-provider';
import { useAppState } from '@/providers/app-state-provider/context';
import { Command } from 'cmdk';
import { useGoToPage } from '@/providers/app-state-provider/hooks';
import { usePageHelper } from '@/hooks/use-page-helper';
export const Footer = (props: { query: string }) => {
const { createPage } = useAppState();
const { triggerQuickSearchModal } = useModal();
const goToPage = useGoToPage();
const { openPage } = usePageHelper();
const query = props.query;
return (
@@ -18,7 +18,7 @@ export const Footer = (props: { query: string }) => {
onSelect={async () => {
const pageId = await createPage?.current?.();
if (pageId) {
goToPage(pageId);
openPage(pageId);
}
triggerQuickSearchModal();
@@ -6,7 +6,6 @@ import { Dispatch, SetStateAction, useEffect, useState } from 'react';
import { useAppState } from '@/providers/app-state-provider/context';
import { useRouter } from 'next/router';
import { config } from './config';
import { useGoToPage } from '@/providers/app-state-provider/hooks';
import { usePageList } from '@/providers/app-state-provider/usePageList';
import { useLoadWorkspace } from '@/providers/app-state-provider/hooks';
import { NoResultSVG } from './noResultSVG';
@@ -24,7 +23,7 @@ export const Results = (props: {
const { triggerQuickSearchModal } = useModal();
const workspace = useLoadWorkspace();
const pageList = usePageList(workspace);
const goToPage = useGoToPage();
const { openPage } = usePageHelper();
const router = useRouter();
const { currentWorkspaceId } = useAppState();
const { search } = usePageHelper();
@@ -55,7 +54,7 @@ export const Results = (props: {
<Command.Item
key={result.id}
onSelect={() => {
goToPage(result.id);
openPage(result.id);
triggerQuickSearchModal();
}}
value={result.id}
@@ -23,17 +23,19 @@ import {
} from '@blocksuite/icons';
import Link from 'next/link';
import { Tooltip } from '@/ui/tooltip';
import { useEditor } from '@/providers/editor-provider';
import { useModal } from '@/providers/global-modal-provider';
import { useGoToPage } from '@/providers/app-state-provider/hooks';
import { useAppState } from '@/providers/app-state-provider/context';
import { IconButton } from '@/ui/button';
import { WorkspaceSelector } from './WorkspaceSelector';
import useLocalStorage from '@/hooks/use-local-storage';
import { useTranslation } from '@/libs/i18n';
import usePageMetaList from '@/hooks/use-page-meta-list';
import { usePageHelper } from '@/hooks/use-page-helper';
const FavoriteList = ({ showList }: { showList: boolean }) => {
const { pageList, openPage } = useEditor();
const { openPage } = usePageHelper();
const pageList = usePageMetaList();
const router = useRouter();
const favoriteList = pageList.filter(p => p.favorite && !p.trash);
@@ -66,7 +68,7 @@ export const WorkSpaceSliderBar = () => {
const { triggerQuickSearchModal } = useModal();
const [showSubFavorite, setShowSubFavorite] = useState(true);
const { createPage, currentWorkspaceId } = useAppState();
const goToPage = useGoToPage();
const { openPage } = usePageHelper();
const router = useRouter();
const [showTip, setShowTip] = useState(false);
@@ -142,9 +144,8 @@ export const WorkSpaceSliderBar = () => {
<StyledNewPageButton
onClick={async () => {
const pageId = await createPage?.current?.();
console.log('pageID', pageId);
if (pageId) {
goToPage(pageId);
openPage(pageId);
}
}}
>