diff --git a/packages/common/infra/src/modules/feature-flag/constant.ts b/packages/common/infra/src/modules/feature-flag/constant.ts index ee788c2656..d431ec216f 100644 --- a/packages/common/infra/src/modules/feature-flag/constant.ts +++ b/packages/common/infra/src/modules/feature-flag/constant.ts @@ -225,6 +225,15 @@ export const AFFINE_FLAGS = { configurable: isDesktopEnvironment, defaultState: false, }, + enable_mobile_edgeless_editing: { + category: 'affine', + displayName: + 'com.affine.settings.workspace.experimental-features.enable-mobile-edgeless-editing.name', + description: + 'com.affine.settings.workspace.experimental-features.enable-mobile-edgeless-editing.description', + configurable: isMobile, + defaultState: false, + }, } satisfies { [key in string]: FlagInfo }; export type AFFINE_FLAGS = typeof AFFINE_FLAGS; diff --git a/packages/frontend/core/src/mobile/pages/workspace/detail/mobile-detail-page.tsx b/packages/frontend/core/src/mobile/pages/workspace/detail/mobile-detail-page.tsx index c56b25501c..cbafe84169 100644 --- a/packages/frontend/core/src/mobile/pages/workspace/detail/mobile-detail-page.tsx +++ b/packages/frontend/core/src/mobile/pages/workspace/detail/mobile-detail-page.tsx @@ -83,6 +83,8 @@ const DetailPageImpl = () => { const enableKeyboardToolbar = featureFlagService.flags.enable_mobile_keyboard_toolbar.value; + const enableEdgelessEditing = + featureFlagService.flags.enable_mobile_edgeless_editing.value; const { setDocReadonly } = useDocMetaHelper(); // TODO(@eyhn): remove jotai here @@ -111,8 +113,17 @@ const DetailPageImpl = () => { }, [doc, globalContext, mode]); useEffect(() => { - if (!enableKeyboardToolbar) setDocReadonly(doc.id, true); - }, [enableKeyboardToolbar, doc.id, setDocReadonly]); + setDocReadonly( + doc.id, + !enableKeyboardToolbar || (mode === 'edgeless' && !enableEdgelessEditing) + ); + }, [ + enableKeyboardToolbar, + doc.id, + setDocReadonly, + mode, + enableEdgelessEditing, + ]); useEffect(() => { globalContext.isTrashDoc.set(!!isInTrash); diff --git a/packages/frontend/core/src/mobile/styles/mobile.css.ts b/packages/frontend/core/src/mobile/styles/mobile.css.ts index c659b039de..0cb7e5d47e 100644 --- a/packages/frontend/core/src/mobile/styles/mobile.css.ts +++ b/packages/frontend/core/src/mobile/styles/mobile.css.ts @@ -27,6 +27,9 @@ globalStyle('body:has(#app-tabs) affine-keyboard-toolbar[data-shrink="true"]', { globalStyle('body:has(#app-tabs) affine-keyboard-tool-panel', { paddingBottom: `calc(${globalVars.appTabHeight} + env(safe-area-inset-bottom) + 8px)`, }); +globalStyle('body:has(#app-tabs) edgeless-toolbar-widget', { + bottom: `calc(${globalVars.appTabHeight} + env(safe-area-inset-bottom))`, +}); globalStyle('html', { height: '100dvh', overflowY: 'auto', diff --git a/packages/frontend/i18n/src/resources/en.json b/packages/frontend/i18n/src/resources/en.json index 7d90cabc2d..8e86d2d7be 100644 --- a/packages/frontend/i18n/src/resources/en.json +++ b/packages/frontend/i18n/src/resources/en.json @@ -1258,6 +1258,8 @@ "com.affine.settings.workspace.experimental-features.enable-snapshot-import-export.description": "Once enabled, users can import and export blocksuite snapshots.", "com.affine.settings.workspace.experimental-features.enable-multiple-cloud-servers.name": "Multiple Cloud Servers", "com.affine.settings.workspace.experimental-features.enable-multiple-cloud-servers.description": "Once enabled, users can connect to selfhosted cloud servers.", + "com.affine.settings.workspace.experimental-features.enable-mobile-edgeless-editing.name": "Enable Edgeless Editing", + "com.affine.settings.workspace.experimental-features.enable-mobile-edgeless-editing.description": "Once enabled, users can edit edgeless canvas.", "com.affine.settings.workspace.not-owner": "Only an owner can edit the workspace avatar and name. Changes will be shown for everyone.", "com.affine.settings.workspace.preferences": "Preference", "com.affine.settings.workspace.state.local": "Local",