diff --git a/.cz-config.js b/.cz-config.js index e282d831ee..a0608d5afa 100644 --- a/.cz-config.js +++ b/.cz-config.js @@ -26,7 +26,7 @@ module.exports = { ], scopes: [ { name: 'selection' }, - { name: 'whiteboard' }, + { name: 'edgeless' }, { name: 'point' }, { name: 'group' }, { name: 'page' }, diff --git a/apps/ligo-virgo/src/pages/workspace/Whiteboard.tsx b/apps/ligo-virgo/src/pages/workspace/Edgeless.tsx similarity index 92% rename from apps/ligo-virgo/src/pages/workspace/Whiteboard.tsx rename to apps/ligo-virgo/src/pages/workspace/Edgeless.tsx index 7059a264c3..c84ceda481 100644 --- a/apps/ligo-virgo/src/pages/workspace/Whiteboard.tsx +++ b/apps/ligo-virgo/src/pages/workspace/Edgeless.tsx @@ -9,11 +9,11 @@ const MemoAffineBoard = memo(AffineBoard, (prev, next) => { return prev.rootBlockId === next.rootBlockId; }); -type WhiteboardProps = { +type EdgelessProps = { workspace: string; }; -export const Whiteboard = (props: WhiteboardProps) => { +export const Edgeless = (props: EdgelessProps) => { const { page_id } = useParams(); const { user } = useUserAndSpaces(); diff --git a/apps/ligo-virgo/src/pages/workspace/Home.tsx b/apps/ligo-virgo/src/pages/workspace/Home.tsx index 31de316209..d0ac1f3872 100644 --- a/apps/ligo-virgo/src/pages/workspace/Home.tsx +++ b/apps/ligo-virgo/src/pages/workspace/Home.tsx @@ -22,7 +22,7 @@ export function WorkspaceHome() { workspace_id, user_initial_page_id, TemplateFactory.generatePageTemplateByGroupKeys({ - name: '👋 Get Started with AFFINE', + name: '👋 Get Started with AFFiNE', groupKeys: [ 'getStartedGroup0', 'getStartedGroup1', diff --git a/apps/ligo-virgo/src/pages/workspace/WorkspaceContainer.tsx b/apps/ligo-virgo/src/pages/workspace/WorkspaceContainer.tsx index f8cdb7a242..8e83c601a0 100644 --- a/apps/ligo-virgo/src/pages/workspace/WorkspaceContainer.tsx +++ b/apps/ligo-virgo/src/pages/workspace/WorkspaceContainer.tsx @@ -4,10 +4,10 @@ import { useUserAndSpaces } from '@toeverything/datasource/state'; import { WorkspaceRootContainer } from './Container'; import { Page } from './docs'; +import { Edgeless } from './Edgeless'; import { WorkspaceHome } from './Home'; import Labels from './labels'; import Pages from './pages'; -import { Whiteboard } from './Whiteboard'; export function WorkspaceContainer() { const { workspace_id } = useParams(); @@ -26,8 +26,8 @@ export function WorkspaceContainer() { } /> } /> } + path="/:page_id/edgeless" + element={} /> (null); const { setCurrentEditors } = useCurrentEditors(); ref.current ??= { - data: createEditor(workspace, rootBlockId, isWhiteboard), + data: createEditor(workspace, rootBlockId, isEdgeless), onInit: true, }; @@ -42,18 +42,14 @@ function _useConstantWithDispose( if (ref.current.onInit) { ref.current.onInit = false; } else { - ref.current.data = createEditor( - workspace, - rootBlockId, - isWhiteboard - ); + ref.current.data = createEditor(workspace, rootBlockId, isEdgeless); } setCurrentEditors(prev => ({ ...prev, [rootBlockId]: ref.current.data, })); return () => ref.current.data.dispose(); - }, [workspace, rootBlockId, isWhiteboard, setCurrentEditors]); + }, [workspace, rootBlockId, isEdgeless, setCurrentEditors]); return ref.current.data; } @@ -64,7 +60,7 @@ export const AffineEditor = forwardRef( workspace, rootBlockId, scrollBlank = true, - isWhiteboard, + isEdgeless, scrollController, scrollContainer, }, @@ -73,7 +69,7 @@ export const AffineEditor = forwardRef( const editor = _useConstantWithDispose( workspace, rootBlockId, - isWhiteboard + isEdgeless ); useEffect(() => { diff --git a/libs/components/affine-editor/src/create-editor.ts b/libs/components/affine-editor/src/create-editor.ts index c976c9ef46..6075e7a9af 100644 --- a/libs/components/affine-editor/src/create-editor.ts +++ b/libs/components/affine-editor/src/create-editor.ts @@ -30,7 +30,7 @@ import { BlockEditor } from '@toeverything/framework/virgo'; export const createEditor = ( workspace: string, rootBlockId: string, - isWhiteboard?: boolean + isEdgeless?: boolean ) => { const blockEditor = new BlockEditor({ workspace, @@ -61,7 +61,7 @@ export const createEditor = ( [Protocol.Block.Type.groupDivider]: new GroupDividerBlock(), }, plugins, - isWhiteboard, + isEdgeless, }); return blockEditor; diff --git a/libs/components/board-shapes/src/editor-util/EditorUtil.tsx b/libs/components/board-shapes/src/editor-util/EditorUtil.tsx index f8b032dc17..6e6f123a72 100644 --- a/libs/components/board-shapes/src/editor-util/EditorUtil.tsx +++ b/libs/components/board-shapes/src/editor-util/EditorUtil.tsx @@ -148,7 +148,7 @@ export class EditorUtil extends TDShapeUtil { workspace={workspace} rootBlockId={rootBlockId} scrollBlank={false} - isWhiteboard + isEdgeless /> {editingText ? null : } diff --git a/libs/components/editor-blocks/src/blocks/group/GroupView.tsx b/libs/components/editor-blocks/src/blocks/group/GroupView.tsx index 826a81cad7..791059e36c 100644 --- a/libs/components/editor-blocks/src/blocks/group/GroupView.tsx +++ b/libs/components/editor-blocks/src/blocks/group/GroupView.tsx @@ -103,7 +103,7 @@ export const GroupView = (props: CreateView) => { - {editor.isWhiteboard ? null : ( + {editor.isEdgeless ? null : ( )} diff --git a/libs/components/editor-blocks/src/components/source-view/format-url/affine.ts b/libs/components/editor-blocks/src/components/source-view/format-url/affine.ts index e31e1759cc..33974553cf 100644 --- a/libs/components/editor-blocks/src/components/source-view/format-url/affine.ts +++ b/libs/components/editor-blocks/src/components/source-view/format-url/affine.ts @@ -1,5 +1,5 @@ const _regex = - /^(https?:\/\/(localhost:4200|(nightly|app)\.affine\.pro|.*?\.ligo-virgo\.pages\.dev)\/\w{28}\/)?(affine\w{16})(\/whiteboard)?$/; + /^(https?:\/\/(localhost:4200|(nightly|app)\.affine\.pro|.*?\.ligo-virgo\.pages\.dev)\/\w{28}\/)?(affine\w{16})(\/edgeless)?$/; export const isAffineUrl = (url?: string) => { if (!url) return false; diff --git a/libs/components/editor-core/src/RenderRoot.tsx b/libs/components/editor-core/src/RenderRoot.tsx index 93ae57a6f0..cbafd3ea75 100644 --- a/libs/components/editor-core/src/RenderRoot.tsx +++ b/libs/components/editor-core/src/RenderRoot.tsx @@ -1,16 +1,16 @@ -import type { BlockEditor } from './editor'; import { styled, usePatchNodes } from '@toeverything/components/ui'; -import type { PropsWithChildren } from 'react'; -import React, { useEffect, useRef, useState, useCallback } from 'react'; -import { EditorProvider } from './Contexts'; -import { SelectionRect, SelectionRef } from './Selection'; import { Protocol, services, type ReturnUnobserve, } from '@toeverything/datasource/db-service'; -import { addNewGroup, appendNewGroup } from './recast-block'; +import type { PropsWithChildren } from 'react'; +import React, { useCallback, useEffect, useRef, useState } from 'react'; +import { EditorProvider } from './Contexts'; +import type { BlockEditor } from './editor'; import { useIsOnDrag } from './hooks'; +import { addNewGroup, appendNewGroup } from './recast-block'; +import { SelectionRect, SelectionRef } from './Selection'; interface RenderRootProps { editor: BlockEditor; @@ -160,7 +160,7 @@ export const RenderRoot = ({ return ( { if (ref != null && ref !== editor.container) { editor.container = ref; @@ -188,7 +188,7 @@ export const RenderRoot = ({ {/** TODO: remove selectionManager insert */} {editor && } - {editor.isWhiteboard ? null : } + {editor.isEdgeless ? null : } {patchedNodes} @@ -262,16 +262,10 @@ function ScrollBlank({ editor }: { editor: BlockEditor }) { const PADDING_X = 150; const Container = styled('div')( - ({ - isWhiteboard, - isOnDrag, - }: { - isWhiteboard: boolean; - isOnDrag: boolean; - }) => ({ + ({ isEdgeless, isOnDrag }: { isEdgeless: boolean; isOnDrag: boolean }) => ({ width: '100%', - padding: isWhiteboard ? 0 : `72px ${PADDING_X}px 0 ${PADDING_X}px`, - minWidth: isWhiteboard ? 'unset' : '940px', + padding: isEdgeless ? 0 : `72px ${PADDING_X}px 0 ${PADDING_X}px`, + minWidth: isEdgeless ? 'unset' : '940px', position: 'relative', ...(isOnDrag && { cursor: 'grabbing', diff --git a/libs/components/editor-core/src/editor/editor.ts b/libs/components/editor-core/src/editor/editor.ts index 24854735f4..8643421241 100644 --- a/libs/components/editor-core/src/editor/editor.ts +++ b/libs/components/editor-core/src/editor/editor.ts @@ -2,47 +2,47 @@ import HotKeys from 'hotkeys-js'; import LRUCache from 'lru-cache'; -import { services } from '@toeverything/datasource/db-service'; +import type { PatchNode } from '@toeverything/components/ui'; import type { BlockFlavors, ReturnEditorBlock, UpdateEditorBlock, } from '@toeverything/datasource/db-service'; -import type { PatchNode } from '@toeverything/components/ui'; +import { services } from '@toeverything/datasource/db-service'; -import { AsyncBlock } from './block'; -import type { WorkspaceAndBlockId } from './block'; -import type { BaseView } from './views/base-view'; -import { SelectionManager } from './selection'; -import { Hooks, PluginManager } from './plugin'; -import { EditorCommands } from './commands'; -import { - Virgo, - HooksRunner, - PluginHooks, - PluginCreator, - StorageManager, - VirgoSelection, - PluginManagerInterface, -} from './types'; -import { KeyboardManager } from './keyboard'; -import { MouseManager } from './mouse'; -import { ScrollManager } from './scroll'; -import assert from 'assert'; -import { domToRect, last, Point, sleep } from '@toeverything/utils'; import { Commands } from '@toeverything/datasource/commands'; +import { domToRect, last, Point, sleep } from '@toeverything/utils'; +import assert from 'assert'; +import type { WorkspaceAndBlockId } from './block'; +import { AsyncBlock } from './block'; +import { BlockHelper } from './block/block-helper'; import { BrowserClipboard } from './clipboard/browser-clipboard'; import { ClipboardPopulator } from './clipboard/clipboard-populator'; -import { BlockHelper } from './block/block-helper'; -import { DragDropManager } from './drag-drop'; +import { EditorCommands } from './commands'; import { EditorConfig } from './config'; +import { DragDropManager } from './drag-drop'; +import { KeyboardManager } from './keyboard'; +import { MouseManager } from './mouse'; +import { Hooks, PluginManager } from './plugin'; +import { ScrollManager } from './scroll'; +import { SelectionManager } from './selection'; +import { + HooksRunner, + PluginCreator, + PluginHooks, + PluginManagerInterface, + StorageManager, + Virgo, + VirgoSelection, +} from './types'; +import type { BaseView } from './views/base-view'; export interface EditorCtorProps { workspace: string; views: Partial>; plugins: PluginCreator[]; rootBlockId: string; - isWhiteboard?: boolean; + isEdgeless?: boolean; } export class Editor implements Virgo { @@ -75,7 +75,7 @@ export class Editor implements Virgo { render: PatchNode; has: (key: string) => boolean; }; - public isWhiteboard = false; + public isEdgeless = false; private _isDisposed = false; constructor(props: EditorCtorProps) { @@ -85,8 +85,8 @@ export class Editor implements Virgo { this.hooks = new Hooks(); this.plugin_manager = new PluginManager(this, this.hooks); this.plugin_manager.registerAll(props.plugins); - if (props.isWhiteboard) { - this.isWhiteboard = true; + if (props.isEdgeless) { + this.isEdgeless = true; } for (const [name, block] of Object.entries(props.views)) { services.api.editorBlock.registerContentExporter( diff --git a/libs/components/editor-core/src/editor/types.ts b/libs/components/editor-core/src/editor/types.ts index 44befc97c6..1b97cf0f86 100644 --- a/libs/components/editor-core/src/editor/types.ts +++ b/libs/components/editor-core/src/editor/types.ts @@ -107,7 +107,7 @@ export interface Virgo { getBlockDomById: (id: string) => Promise; getBlockByPoint: (point: Point) => Promise; getGroupBlockByPoint: (point: Point) => Promise; - isWhiteboard: boolean; + isEdgeless: boolean; mouseManager: MouseManager; } diff --git a/libs/components/editor-core/src/recast-block/types/view.ts b/libs/components/editor-core/src/recast-block/types/view.ts index 3f03187bce..fa30c07861 100644 --- a/libs/components/editor-core/src/recast-block/types/view.ts +++ b/libs/components/editor-core/src/recast-block/types/view.ts @@ -7,7 +7,6 @@ export enum RecastScene { Page = 'page', Kanban = 'kanban', Table = 'table', - // Whiteboard = 'whiteboard', } export type RecastViewId = string & { diff --git a/libs/components/editor-plugins/src/menu/group-menu/Plugin.tsx b/libs/components/editor-plugins/src/menu/group-menu/Plugin.tsx index 115e754202..6d4561d667 100644 --- a/libs/components/editor-plugins/src/menu/group-menu/Plugin.tsx +++ b/libs/components/editor-plugins/src/menu/group-menu/Plugin.tsx @@ -14,7 +14,7 @@ export class GroupMenuPlugin extends BasePlugin { } protected override _onRender(): void { - if (this.editor.isWhiteboard) return; + if (this.editor.isEdgeless) return; this.root = new PluginRenderRoot({ name: PLUGIN_NAME, render: this.editor.reactRenderRoot.render, diff --git a/libs/components/layout/src/header/EditorBoardSwitcher/Switcher.tsx b/libs/components/layout/src/header/EditorBoardSwitcher/Switcher.tsx index 78239dac9e..6c8ab70372 100644 --- a/libs/components/layout/src/header/EditorBoardSwitcher/Switcher.tsx +++ b/libs/components/layout/src/header/EditorBoardSwitcher/Switcher.tsx @@ -4,7 +4,7 @@ import { StatusText } from './StatusText'; import { StatusTrack } from './StatusTrack'; import { DocMode } from './type'; -const isBoard = (pathname: string): boolean => pathname.endsWith('/whiteboard'); +const isBoard = (pathname: string): boolean => pathname.endsWith('/edgeless'); export const Switcher = () => { const navigate = useNavigate(); @@ -20,11 +20,11 @@ export const Switcher = () => { /** * There are two possible modes: * Page mode: /{workspaceId}/{pageId} - * Board mode: /{workspaceId}/{pageId}/whiteboard + * Board mode: /{workspaceId}/{pageId}/edgeless */ const pageId = params['*'].split('/')[0]; const targetUrl = `/${workspaceId}/${pageId}${ - targetViewMode === DocMode.board ? '/whiteboard' : '' + targetViewMode === DocMode.board ? '/edgeless' : '' }`; navigate(targetUrl); }; diff --git a/libs/components/layout/src/header/Header.tsx b/libs/components/layout/src/header/Header.tsx index 36c82f7361..0f9028b9ae 100644 --- a/libs/components/layout/src/header/Header.tsx +++ b/libs/components/layout/src/header/Header.tsx @@ -26,7 +26,7 @@ function hideAffineHeader(pathname: string): boolean { } type HeaderIconProps = { - isWhiteboardView?: boolean; + isEdgelessView?: boolean; }; export const AffineHeader = () => { @@ -38,7 +38,7 @@ export const AffineHeader = () => { const { toggleSettingsSidebar: toggleInfoSidebar } = useShowSettingsSidebar(); const theme = useTheme(); - const isWhiteboardView = pathname.endsWith('/whiteboard'); + const isEdgelessView = pathname.endsWith('/edgeless'); const pageHistoryPortalFlag = useFlag('BooleanPageHistoryPortal', false); const pageSettingPortalFlag = useFlag('PageSettingPortal', false); const BooleanPageSharePortal = useFlag('BooleanPageSharePortal', false); @@ -77,9 +77,9 @@ export const AffineHeader = () => { - isWhiteboardView + isEdgelessView ? navigate( `/${ params['workspace_id'] || @@ -100,17 +100,17 @@ export const AffineHeader = () => { - + - isWhiteboardView + isEdgelessView ? null : navigate( `/${ params['workspace_id'] || 'space' - }/${params['*']}` + '/whiteboard' + }/${params['*']}` + '/edgeless' ) } > @@ -166,14 +166,14 @@ const StyledHeaderRight = styled('div')` `; const HeaderIcon = styled(IconButton, { - shouldForwardProp: (prop: string) => prop !== 'isWhiteboardView', -})(({ isWhiteboardView = false }) => ({ + shouldForwardProp: (prop: string) => prop !== 'isEdgelessView', +})(({ isEdgelessView = false }) => ({ color: '#98ACBD', minWidth: 48, width: 48, height: 36, borderRadius: '8px', - ...(isWhiteboardView && { + ...(isEdgelessView && { color: '#fff', backgroundColor: '#3E6FDB', '&:hover': { diff --git a/libs/datasource/db-service/src/protocol/index.ts b/libs/datasource/db-service/src/protocol/index.ts index 606988c683..328cc03bc3 100644 --- a/libs/datasource/db-service/src/protocol/index.ts +++ b/libs/datasource/db-service/src/protocol/index.ts @@ -22,7 +22,6 @@ const Protocol = { quote: 'quote', toc: 'toc', database: 'database', - whiteboard: 'whiteboard', template: 'template', discussion: 'discussion', comment: 'comment', diff --git a/libs/datasource/db-service/src/services/editor-block/utils/column/default-config.ts b/libs/datasource/db-service/src/services/editor-block/utils/column/default-config.ts index 13c5e6e4c2..f2d1c861b6 100644 --- a/libs/datasource/db-service/src/services/editor-block/utils/column/default-config.ts +++ b/libs/datasource/db-service/src/services/editor-block/utils/column/default-config.ts @@ -16,7 +16,6 @@ export enum GroupScene { page = 'page', table = 'table', kanban = 'kanban', - whiteboard = 'whiteboard', } /** diff --git a/libs/datasource/jwt/src/types/block.ts b/libs/datasource/jwt/src/types/block.ts index cd0300e5a1..3b04dc7830 100644 --- a/libs/datasource/jwt/src/types/block.ts +++ b/libs/datasource/jwt/src/types/block.ts @@ -37,7 +37,6 @@ export const BlockFlavors = { quote: 'quote' as const, // quote toc: 'toc' as const, //directory database: 'database' as const, //Multidimensional table - whiteboard: 'whiteboard' as const, // whiteboard template: 'template' as const, // template discussion: 'discussion' as const, // comment header comment: 'comment' as const, // comment details