diff --git a/libs/components/editor-blocks/src/blocks/group/scene-kanban/CardContext.tsx b/libs/components/editor-blocks/src/blocks/group/scene-kanban/CardContext.tsx
index f7f05b37d4..cb313d14ee 100644
--- a/libs/components/editor-blocks/src/blocks/group/scene-kanban/CardContext.tsx
+++ b/libs/components/editor-blocks/src/blocks/group/scene-kanban/CardContext.tsx
@@ -25,7 +25,7 @@ const AddCard = ({ group }: { group: KanbanGroup }) => {
const { addCard } = useKanban();
const handleClick = useCallback(async () => {
await addCard(group);
- }, [addCard, group]);
+ }, [addCard]);
return +;
};
diff --git a/libs/components/editor-blocks/src/blocks/group/scene-kanban/CardItem.tsx b/libs/components/editor-blocks/src/blocks/group/scene-kanban/CardItem.tsx
index 76220d7ff0..f26374e4c3 100644
--- a/libs/components/editor-blocks/src/blocks/group/scene-kanban/CardItem.tsx
+++ b/libs/components/editor-blocks/src/blocks/group/scene-kanban/CardItem.tsx
@@ -1,11 +1,6 @@
import type { KanbanCard } from '@toeverything/components/editor-core';
-import {
- RenderBlock,
- useKanban,
- useRefPage,
-} from '@toeverything/components/editor-core';
+import { RenderBlock, useKanban } from '@toeverything/components/editor-core';
import { styled } from '@toeverything/components/ui';
-import { useFlag } from '@toeverything/datasource/feature-flags';
const CardContent = styled('div')({
margin: '20px',
@@ -63,24 +58,18 @@ export const CardItem = ({
block: KanbanCard['block'];
}) => {
const { addSubItem } = useKanban();
- const { openSubPage } = useRefPage();
- const showKanbanRefPageFlag = useFlag('ShowKanbanRefPage', false);
const onAddItem = async () => {
await addSubItem(block);
};
- const onClickCard = async () => {
- showKanbanRefPageFlag && openSubPage(id);
- };
-
return (
-
+
- Add a sub-block
+ Add item
);
diff --git a/libs/components/editor-core/src/RenderRoot.tsx b/libs/components/editor-core/src/RenderRoot.tsx
index e4534b813d..1d08db0b16 100644
--- a/libs/components/editor-core/src/RenderRoot.tsx
+++ b/libs/components/editor-core/src/RenderRoot.tsx
@@ -2,7 +2,7 @@ import type { BlockEditor } from './editor';
import { styled, usePatchNodes } from '@toeverything/components/ui';
import type { FC, PropsWithChildren } from 'react';
import React, { useEffect, useRef, useState, useCallback } from 'react';
-import { EditorProvider } from './Contexts';
+import { RootContext } from './contexts';
import { SelectionRect, SelectionRef } from './Selection';
import {
Protocol,
@@ -151,7 +151,7 @@ export const RenderRoot: FC> = ({
};
return (
-
+
{
@@ -183,7 +183,7 @@ export const RenderRoot: FC> = ({
{editor.isWhiteboard ? null : }
{patchedNodes}
-
+
);
};
diff --git a/libs/components/editor-core/src/Contexts.tsx b/libs/components/editor-core/src/contexts.tsx
similarity index 70%
rename from libs/components/editor-core/src/Contexts.tsx
rename to libs/components/editor-core/src/contexts.tsx
index 418fe0e8b4..cdd4dbf305 100644
--- a/libs/components/editor-core/src/Contexts.tsx
+++ b/libs/components/editor-core/src/contexts.tsx
@@ -1,8 +1,9 @@
import { createContext, useContext } from 'react';
import type { BlockEditor, AsyncBlock } from './editor';
+import type { Column } from '@toeverything/datasource/db-service';
import { genErrorObj } from '@toeverything/utils';
-const RootContext = createContext<{
+export const RootContext = createContext<{
editor: BlockEditor;
// TODO: Temporary fix, dependencies in the new architecture are bottom-up, editors do not need to be passed down from the top
editorElement: () => JSX.Element;
@@ -13,8 +14,6 @@ const RootContext = createContext<{
) as any
);
-export const EditorProvider = RootContext.Provider;
-
export const useEditor = () => {
return useContext(RootContext);
};
@@ -23,3 +22,16 @@ export const useEditor = () => {
* @deprecated
*/
export const BlockContext = createContext(null as any);
+
+/**
+ * Context of column information
+ *
+ * @deprecated
+ */
+export const ColumnsContext = createContext<{
+ fromId: string;
+ columns: Column[];
+}>({
+ fromId: '',
+ columns: [],
+});
diff --git a/libs/components/editor-core/src/hooks.ts b/libs/components/editor-core/src/hooks.ts
index f0af8a0f87..d7d1a00cef 100644
--- a/libs/components/editor-core/src/hooks.ts
+++ b/libs/components/editor-core/src/hooks.ts
@@ -1,6 +1,3 @@
-import { noop, Point } from '@toeverything/utils';
-import { useCallback, useEffect, useRef, useState } from 'react';
-import { useEditor } from './Contexts';
import {
AsyncBlock,
BlockEditor,
@@ -8,6 +5,9 @@ import {
SelectionInfo,
SelectionSettingsMap,
} from './editor';
+import { noop, Point } from '@toeverything/utils';
+import { useCallback, useContext, useEffect, useRef, useState } from 'react';
+import { RootContext } from './contexts';
function useRequestReRender() {
const [, setUpdateCounter] = useState(0);
@@ -56,7 +56,7 @@ function useRequestReRender() {
export const useBlock = (blockId: string) => {
const [block, setBlock] = useState();
const requestReRender = useRequestReRender();
- const { editor } = useEditor();
+ const { editor } = useContext(RootContext);
useEffect(() => {
if (!blockId) {
return undefined;
@@ -95,7 +95,7 @@ export const useOnSelect = (
blockId: string,
cb: (isSelect: boolean) => void
) => {
- const { editor } = useEditor();
+ const { editor } = useContext(RootContext);
useEffect(() => {
editor.selectionManager.observe(blockId, SelectEventTypes.onSelect, cb);
return () => {
@@ -117,7 +117,7 @@ export const useOnSelectActive = (
blockId: string,
cb: (position: Point | undefined) => void
) => {
- const { editor } = useEditor();
+ const { editor } = useContext(RootContext);
useEffect(() => {
editor.selectionManager.observe(blockId, SelectEventTypes.active, cb);
return () => {
@@ -139,7 +139,7 @@ export const useOnSelectSetSelection = (
blockId: string,
cb: (args: SelectionSettingsMap[T]) => void
) => {
- const { editor } = useEditor();
+ const { editor } = useContext(RootContext);
useEffect(() => {
editor.selectionManager.observe(
blockId,
@@ -162,7 +162,7 @@ export const useOnSelectSetSelection = (
* @export
*/
export const useOnSelectChange = (cb: (info: SelectionInfo) => void) => {
- const { editor } = useEditor();
+ const { editor } = useContext(RootContext);
useEffect(() => {
editor.selectionManager.onSelectionChange(cb);
return () => {
@@ -177,7 +177,7 @@ export const useOnSelectChange = (cb: (info: SelectionInfo) => void) => {
* @export
*/
export const useOnSelectEnd = (cb: (info: SelectionInfo) => void) => {
- const { editor } = useEditor();
+ const { editor } = useContext(RootContext);
useEffect(() => {
editor.selectionManager.onSelectEnd(cb);
return () => {
@@ -195,7 +195,7 @@ export const useOnSelectStartWith = (
blockId: string,
cb: (args: MouseEvent) => void
) => {
- const { editor } = useEditor();
+ const { editor } = useContext(RootContext);
useEffect(() => {
editor.mouseManager.onSelectStartWith(blockId, cb);
return () => {
diff --git a/libs/components/editor-core/src/index.ts b/libs/components/editor-core/src/index.ts
index bea2fed3a0..6cdd358058 100644
--- a/libs/components/editor-core/src/index.ts
+++ b/libs/components/editor-core/src/index.ts
@@ -1,3 +1,4 @@
+export { ColumnsContext, RootContext } from './contexts';
export { RenderRoot, MIN_PAGE_WIDTH } from './RenderRoot';
export * from './render-block';
export * from './hooks';
@@ -15,5 +16,3 @@ export * from './kanban/types';
export * from './utils';
export * from './editor';
-
-export { RefPageProvider, useRefPage } from './ref-page';
diff --git a/libs/components/editor-core/src/kanban/kanban.ts b/libs/components/editor-core/src/kanban/kanban.ts
index 218476ac44..ff33b17f1d 100644
--- a/libs/components/editor-core/src/kanban/kanban.ts
+++ b/libs/components/editor-core/src/kanban/kanban.ts
@@ -1,6 +1,6 @@
import { Protocol } from '@toeverything/datasource/db-service';
import { useCallback, useContext, useEffect, useState } from 'react';
-import { useEditor } from '../Contexts';
+import { useEditor } from '../contexts';
import { AsyncBlock } from '../editor';
import { useRecastView } from '../recast-block';
import { useRecastBlock } from '../recast-block/Context';
diff --git a/libs/components/editor-core/src/recast-block/Context.tsx b/libs/components/editor-core/src/recast-block/Context.tsx
index 47ec6cfcdb..55d334039b 100644
--- a/libs/components/editor-core/src/recast-block/Context.tsx
+++ b/libs/components/editor-core/src/recast-block/Context.tsx
@@ -2,7 +2,6 @@ import { Protocol } from '@toeverything/datasource/db-service';
import { AsyncBlock } from '../editor';
import { ComponentType, createContext, ReactNode, useContext } from 'react';
import { RecastBlock } from './types';
-import { RefPageProvider } from '../ref-page';
/**
* Determine whether the block supports RecastBlock
@@ -48,7 +47,7 @@ export const RecastBlockProvider = ({
return (
- {children}
+ {children}
);
};
@@ -61,7 +60,7 @@ export const useRecastBlock = () => {
const recastBlock = useContext(RecastBlockContext);
if (!recastBlock) {
throw new Error(
- 'Failed to find recastBlock! Please use the hook under `RecastBlockProvider`.'
+ 'Failed to find recastBlock! Please use the hook under `RecastTableProvider`.'
);
}
return recastBlock;
diff --git a/libs/components/editor-core/src/recast-block/README.md b/libs/components/editor-core/src/recast-block/README.md
index 489412eab3..59aed91be7 100644
--- a/libs/components/editor-core/src/recast-block/README.md
+++ b/libs/components/editor-core/src/recast-block/README.md
@@ -49,3 +49,22 @@ const SomeBlock = () => {
return ...
;
};
```
+
+## Scene
+
+**Notice: The scene API will refactor at next version.**
+
+```tsx
+const SomeBlock = () => {
+ const { scene, setScene, setPage, setTable, setKanban } =
+ useRecastBlockScene();
+
+ return (
+ <>
+ Scene: {scene}
+
+
+ >
+ );
+};
+```
diff --git a/libs/components/editor-core/src/recast-block/group.ts b/libs/components/editor-core/src/recast-block/group.ts
index 9879ba43df..ae846fc238 100644
--- a/libs/components/editor-core/src/recast-block/group.ts
+++ b/libs/components/editor-core/src/recast-block/group.ts
@@ -32,7 +32,7 @@ export const mergeGroup = async (...groups: AsyncBlock[]) => {
);
}
- await mergeGroupProperties(...(groups as unknown as RecastBlock[]));
+ await mergeGroupProperties(...(groups as RecastBlock[]));
const [headGroup, ...restGroups] = groups;
// Add all children to the head group
@@ -174,7 +174,7 @@ export const splitGroup = async (
}
splitGroupProperties(
- group as unknown as RecastBlock,
+ group as RecastBlock,
newGroupBlock as unknown as RecastBlock
);
await group.after(newGroupBlock);
diff --git a/libs/components/editor-core/src/ref-page/ModalPage.tsx b/libs/components/editor-core/src/ref-page/ModalPage.tsx
deleted file mode 100644
index 276d5984d6..0000000000
--- a/libs/components/editor-core/src/ref-page/ModalPage.tsx
+++ /dev/null
@@ -1,90 +0,0 @@
-import { MuiBackdrop, styled, useTheme } from '@toeverything/components/ui';
-import { createContext, ReactNode, useContext, useState } from 'react';
-import { createPortal } from 'react-dom';
-import { useEditor } from '../Contexts';
-import { RenderBlock } from '../render-block';
-
-const Dialog = styled('div')({
- flex: 1,
- width: '880px',
- margin: '72px auto',
- background: '#fff',
- boxShadow: '0px 1px 10px rgba(152, 172, 189, 0.6)',
- borderRadius: '10px',
- padding: '72px 120px',
- overflow: 'scroll',
-});
-
-const Modal = ({ open, children }: { open: boolean; children?: ReactNode }) => {
- const theme = useTheme();
- const { closeSubPage } = useRefPage();
-
- return createPortal(
-
-
- ,
-
- document.body
- );
-};
-
-const ModalPage = ({ blockId }: { blockId: string | null }) => {
- const { editor } = useEditor();
-
- return (
-
- {blockId && }
-
- );
-};
-
-const RefPageContext = createContext<
- ReturnType> | undefined
->(undefined);
-
-export const RefPageProvider = ({ children }: { children: ReactNode }) => {
- const state = useState();
- const [blockId, setBlockId] = state;
-
- return (
-
- {children}
-
-
- );
-};
-
-export const useRefPage = () => {
- const context = useContext(RefPageContext);
- if (!context) {
- throw new Error(
- 'Wrap your app inside of a `SubPageProvider` to have access to the hook context!'
- );
- }
- const [blockId, setBlockId] = context;
- const openSubPage = (blockId: string) => {
- setBlockId(blockId);
- };
- const closeSubPage = () => {
- setBlockId(null);
- };
-
- return { blockId, open: !!blockId, openSubPage, closeSubPage };
-};
-
-// export const openSubPage = () => {};
diff --git a/libs/components/editor-core/src/ref-page/index.ts b/libs/components/editor-core/src/ref-page/index.ts
deleted file mode 100644
index 4b06310a5c..0000000000
--- a/libs/components/editor-core/src/ref-page/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { useRefPage, RefPageProvider } from './ModalPage';
diff --git a/libs/components/editor-core/src/render-block/RenderBlock.tsx b/libs/components/editor-core/src/render-block/RenderBlock.tsx
index 74f6c659cf..46f068af2b 100644
--- a/libs/components/editor-core/src/render-block/RenderBlock.tsx
+++ b/libs/components/editor-core/src/render-block/RenderBlock.tsx
@@ -1,8 +1,8 @@
-import { styled } from '@toeverything/components/ui';
-import { FC, useLayoutEffect, useMemo, useRef } from 'react';
+import { styled, Theme } from '@toeverything/components/ui';
+import { FC, useContext, useLayoutEffect, useMemo, useRef } from 'react';
// import { RenderChildren } from './RenderChildren';
-import { useEditor } from '../Contexts';
+import { RootContext } from '../contexts';
import { useBlock } from '../hooks';
interface RenderBlockProps {
@@ -14,7 +14,7 @@ export const RenderBlock: FC = ({
blockId,
hasContainer = true,
}) => {
- const { editor, editorElement } = useEditor();
+ const { editor, editorElement } = useContext(RootContext);
const { block } = useBlock(blockId);
const blockRef = useRef(null);
diff --git a/libs/components/ui/src/mui.ts b/libs/components/ui/src/mui.ts
index 47588ce5e6..b0658ad526 100644
--- a/libs/components/ui/src/mui.ts
+++ b/libs/components/ui/src/mui.ts
@@ -13,7 +13,6 @@ import type {
} from '@mui/material';
import {
Avatar,
- Backdrop,
Box,
Button,
Checkbox,
@@ -244,7 +243,3 @@ export const MuiFade = Fade;
* @deprecated It is not recommended to use Mui directly, because the design will not refer to Mui's interaction logic.
*/
export const MuiRadio = Radio;
-/**
- * @deprecated It is not recommended to use Mui directly, because the design will not refer to Mui's interaction logic.
- */
-export const MuiBackdrop = Backdrop;
diff --git a/libs/datasource/feature-flags/README.md b/libs/datasource/feature-flags/README.md
index 7a04209c5d..f5c59f4e13 100644
--- a/libs/datasource/feature-flags/README.md
+++ b/libs/datasource/feature-flags/README.md
@@ -2,15 +2,7 @@
## Usage
-- Set token at environment variable
- - The key can be obtained from the [Feature Flag Portal](https://portal.featureflag.co/account-settings/projects)
-
-```shell
-# .env.local
-AFFINE_FEATURE_FLAG_TOKEN=XXXXXXX
-```
-
-- Set provider
+- set provider
```tsx
import { FeatureFlagsProvider } from '@toeverything/datasource/feature-flags';
@@ -50,8 +42,7 @@ const App = () => {
**When entering development mode feature flag will NOT be updated in real time**
-- `activateFfcDevMode(PASSWORD)` play with feature flags locally
- - The `devModePassword` can be obtained from `src/config.ts`
+- `activateFfcDevMode()` play with feature flags locally
- `quitFfcDevMode()` quit dev mode
## Running unit tests
diff --git a/libs/datasource/feature-flags/src/config.ts b/libs/datasource/feature-flags/src/config.ts
index 5295dae995..7f3360d6db 100644
--- a/libs/datasource/feature-flags/src/config.ts
+++ b/libs/datasource/feature-flags/src/config.ts
@@ -8,18 +8,4 @@ export const config: IOption = {
// id: 'the user's unique identifier'
// }
devModePassword: '-',
- enableDataSync: !!process.env['AFFINE_FEATURE_FLAG_TOKEN'],
- // bootstrap: [
- // {
- // // the feature flag key
- // id: 'flag',
- // // the feature flag value
- // variation: false,
- // // the variation data type, string is used if not provided
- // variationType: VariationDataType.boolean,
- // variationOptions: [],
- // timestamp: 0,
- // sendToExperiment: false,
- // },
- // ],
};