mirror of
https://github.com/toeverything/AFFiNE.git
synced 2025-01-05 15:43:11 +03:00
fix: remove pageMode from pageMeta (#1647)
This commit is contained in:
parent
e7d6bda7a5
commit
45260543e1
apps/web/src
@ -1,4 +1,5 @@
|
||||
import type { EditorContainer } from '@blocksuite/editor';
|
||||
import type { Page } from '@blocksuite/store';
|
||||
import { assertExists } from '@blocksuite/store';
|
||||
import { atom, createStore } from 'jotai';
|
||||
import { atomWithStorage } from 'jotai/utils';
|
||||
@ -72,6 +73,12 @@ export const workspaceRecentViewsAtom = atomWithStorage<WorkspaceRecentViews>(
|
||||
{}
|
||||
);
|
||||
|
||||
export type PreferredModeRecord = Record<Page['id'], 'page' | 'edgeless'>;
|
||||
export const workspacePreferredModeAtom = atomWithStorage<PreferredModeRecord>(
|
||||
'preferredMode',
|
||||
{}
|
||||
);
|
||||
|
||||
export const workspaceRecentViresWriteAtom = atom<null, [string, View], View[]>(
|
||||
null,
|
||||
(get, set, id, value) => {
|
||||
|
@ -19,9 +19,11 @@ import {
|
||||
useTheme as useMuiTheme,
|
||||
useTheme,
|
||||
} from '@mui/material';
|
||||
import { useAtomValue } from 'jotai';
|
||||
import type React from 'react';
|
||||
import { useMemo } from 'react';
|
||||
|
||||
import { workspacePreferredModeAtom } from '../../../../atoms';
|
||||
import {
|
||||
usePageMeta,
|
||||
usePageMetaHelper,
|
||||
@ -102,6 +104,7 @@ export const PageList: React.FC<PageListProps> = ({
|
||||
const theme = useMuiTheme();
|
||||
const matches = useMediaQuery(theme.breakpoints.up('sm'));
|
||||
const isTrash = listType === 'trash';
|
||||
const record = useAtomValue(workspacePreferredModeAtom);
|
||||
const list = useMemo(
|
||||
() => pageList.filter(filter[listType ?? 'all']),
|
||||
[pageList, listType]
|
||||
@ -141,7 +144,7 @@ export const PageList: React.FC<PageListProps> = ({
|
||||
>
|
||||
<StyledTitleWrapper>
|
||||
<StyledTitleLink>
|
||||
{pageMeta.mode === 'edgeless' ? (
|
||||
{record[pageMeta.id] === 'edgeless' ? (
|
||||
<EdgelessIcon />
|
||||
) : (
|
||||
<PageIcon />
|
||||
|
@ -1,11 +1,10 @@
|
||||
import { toast } from '@affine/component';
|
||||
import { assertExists } from '@blocksuite/store';
|
||||
import { useAtomValue, useSetAtom } from 'jotai';
|
||||
import type { CSSProperties } from 'react';
|
||||
|
||||
import {
|
||||
usePageMeta,
|
||||
usePageMetaHelper,
|
||||
} from '../../../../hooks/use-page-meta';
|
||||
import { workspacePreferredModeAtom } from '../../../../atoms';
|
||||
import { usePageMeta } from '../../../../hooks/use-page-meta';
|
||||
import type { BlockSuiteWorkspace } from '../../../../shared';
|
||||
import { StyledEditorModeSwitch } from './style';
|
||||
import { EdgelessSwitchItem, PageSwitchItem } from './switch-items';
|
||||
@ -22,34 +21,36 @@ export const EditorModeSwitch = ({
|
||||
blockSuiteWorkspace,
|
||||
pageId,
|
||||
}: EditorModeSwitchProps) => {
|
||||
const { setPageMeta } = usePageMetaHelper(blockSuiteWorkspace);
|
||||
const currentMode =
|
||||
useAtomValue(workspacePreferredModeAtom)[pageId] ?? 'page';
|
||||
const setMode = useSetAtom(workspacePreferredModeAtom);
|
||||
const pageMeta = usePageMeta(blockSuiteWorkspace).find(
|
||||
meta => meta.id === pageId
|
||||
);
|
||||
assertExists(pageMeta);
|
||||
const { trash, mode = 'page' } = pageMeta;
|
||||
const { trash } = pageMeta;
|
||||
|
||||
return (
|
||||
<StyledEditorModeSwitch
|
||||
style={style}
|
||||
switchLeft={mode === 'page'}
|
||||
switchLeft={currentMode === 'page'}
|
||||
showAlone={trash}
|
||||
>
|
||||
<PageSwitchItem
|
||||
data-testid="switch-page-mode-button"
|
||||
active={mode === 'page'}
|
||||
hide={trash && mode !== 'page'}
|
||||
active={currentMode === 'page'}
|
||||
hide={trash && currentMode !== 'page'}
|
||||
onClick={() => {
|
||||
setPageMeta(pageId, { mode: 'page' });
|
||||
setMode(mode => ({ ...mode, [pageMeta.id]: 'page' }));
|
||||
toast('Page mode');
|
||||
}}
|
||||
/>
|
||||
<EdgelessSwitchItem
|
||||
data-testid="switch-edgeless-mode-button"
|
||||
active={mode === 'edgeless'}
|
||||
hide={trash && mode !== 'edgeless'}
|
||||
active={currentMode === 'edgeless'}
|
||||
hide={trash && currentMode !== 'edgeless'}
|
||||
onClick={() => {
|
||||
setPageMeta(pageId, { mode: 'edgeless' });
|
||||
setMode(mode => ({ ...mode, [pageMeta.id]: 'edgeless' }));
|
||||
toast('Edgeless mode');
|
||||
}}
|
||||
/>
|
||||
|
@ -1,13 +1,13 @@
|
||||
import type { EditorContainer } from '@blocksuite/editor';
|
||||
import type { Page } from '@blocksuite/store';
|
||||
import { assertExists } from '@blocksuite/store';
|
||||
import { useSetAtom } from 'jotai';
|
||||
import { useAtomValue, useSetAtom } from 'jotai';
|
||||
import dynamic from 'next/dynamic';
|
||||
import Head from 'next/head';
|
||||
import type React from 'react';
|
||||
import { useCallback } from 'react';
|
||||
|
||||
import { currentEditorAtom } from '../atoms';
|
||||
import { currentEditorAtom, workspacePreferredModeAtom } from '../atoms';
|
||||
import { useBlockSuiteWorkspacePageTitle } from '../hooks/use-blocksuite-workspace-page-title';
|
||||
import { usePageMeta } from '../hooks/use-page-meta';
|
||||
import type { BlockSuiteWorkspace } from '../shared';
|
||||
@ -49,6 +49,8 @@ export const PageDetailEditor: React.FC<PageDetailEditorProps> = ({
|
||||
const meta = usePageMeta(blockSuiteWorkspace).find(
|
||||
meta => meta.id === pageId
|
||||
);
|
||||
const currentMode =
|
||||
useAtomValue(workspacePreferredModeAtom)[pageId] ?? 'page';
|
||||
const setEditor = useSetAtom(currentEditorAtom);
|
||||
assertExists(meta);
|
||||
return (
|
||||
@ -70,8 +72,7 @@ export const PageDetailEditor: React.FC<PageDetailEditorProps> = ({
|
||||
}}
|
||||
key={pageId}
|
||||
blockSuiteWorkspace={blockSuiteWorkspace}
|
||||
// fixme: remove mode from meta
|
||||
mode={isPublic ? 'page' : meta.mode ?? 'page'}
|
||||
mode={isPublic ? 'page' : currentMode}
|
||||
page={page}
|
||||
onInit={useCallback(
|
||||
(page: Page, editor: Readonly<EditorContainer>) => {
|
||||
|
@ -3,6 +3,7 @@ import type { NextRouter } from 'next/router';
|
||||
import { useEffect } from 'react';
|
||||
|
||||
import {
|
||||
workspacePreferredModeAtom,
|
||||
workspaceRecentViewsAtom,
|
||||
workspaceRecentViresWriteAtom,
|
||||
} from '../../atoms';
|
||||
@ -27,13 +28,16 @@ export function useSyncRecentViewsWithRouter(router: NextRouter) {
|
||||
const meta = usePageMeta(blockSuiteWorkspace).find(
|
||||
meta => meta.id === pageId
|
||||
);
|
||||
const currentMode = useAtomValue(workspacePreferredModeAtom)[
|
||||
pageId as string
|
||||
];
|
||||
useEffect(() => {
|
||||
if (!workspaceId) return;
|
||||
if (pageId && meta) {
|
||||
set(workspaceId, {
|
||||
id: pageId as string,
|
||||
mode: meta.mode || 'page',
|
||||
mode: currentMode ?? 'page',
|
||||
});
|
||||
}
|
||||
}, [pageId, meta, workspaceId, set]);
|
||||
}, [pageId, meta, workspaceId, set, currentMode]);
|
||||
}
|
||||
|
@ -5,7 +5,6 @@ import type { BlockSuiteWorkspace } from '../shared';
|
||||
|
||||
declare module '@blocksuite/store' {
|
||||
interface PageMeta {
|
||||
mode?: 'page' | 'edgeless';
|
||||
favorite?: boolean;
|
||||
trash?: boolean;
|
||||
trashDate?: number;
|
||||
|
@ -6,14 +6,14 @@ import {
|
||||
ThemeProvider as AffineThemeProvider,
|
||||
} from '@affine/component';
|
||||
import { GlobalStyles } from '@mui/material';
|
||||
import { useAtomValue } from 'jotai';
|
||||
import { ThemeProvider as NextThemeProvider, useTheme } from 'next-themes';
|
||||
import type { PropsWithChildren } from 'react';
|
||||
import type React from 'react';
|
||||
import { memo, useEffect, useMemo, useState } from 'react';
|
||||
|
||||
import { workspacePreferredModeAtom } from '../atoms';
|
||||
import { useCurrentPage } from '../hooks/current/use-current-page-id';
|
||||
import { useCurrentWorkspace } from '../hooks/current/use-current-workspace';
|
||||
import { usePageMeta } from '../hooks/use-page-meta';
|
||||
|
||||
const ThemeInjector = memo<{
|
||||
themeStyle: AffineTheme;
|
||||
@ -40,11 +40,9 @@ const ThemeInjector = memo<{
|
||||
const ThemeProviderInner = memo<React.PropsWithChildren>(
|
||||
function ThemeProviderInner({ children }) {
|
||||
const { resolvedTheme: theme } = useTheme();
|
||||
const [currentWorkspace] = useCurrentWorkspace();
|
||||
const currentPage = useCurrentPage();
|
||||
const pageMeta = usePageMeta(currentWorkspace?.blockSuiteWorkspace ?? null);
|
||||
const editorMode =
|
||||
pageMeta.find(page => page.id === currentPage?.id)?.mode ?? 'page';
|
||||
const record = useAtomValue(workspacePreferredModeAtom);
|
||||
const editorMode = currentPage ? record[currentPage.id] ?? 'page' : 'page';
|
||||
const themeStyle = useMemo(() => getLightTheme(editorMode), [editorMode]);
|
||||
const darkThemeStyle = useMemo(
|
||||
() => getDarkTheme(editorMode),
|
||||
|
Loading…
Reference in New Issue
Block a user