From d7eccd10eeb802539b37668b5f781a17d0f34b1d Mon Sep 17 00:00:00 2001 From: fundon Date: Mon, 24 Mar 2025 12:55:00 +0000 Subject: [PATCH] chore(editor): add edgeless scribbled style feature flag (#11127) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Closes: [BS-2805](https://linear.app/affine-design/issue/BS-2805/下掉线条样式切换功能，需添加-feature-flag) --- .../affine/gfx/connector/src/toolbar/config.ts | 3 +-- blocksuite/affine/gfx/shape/src/toolbar/config.ts | 15 +++++++++++---- .../shared/src/services/feature-flag-service.ts | 2 ++ .../core/src/modules/feature-flag/constant.ts | 10 ++++++++++ packages/frontend/i18n/src/i18n.gen.ts | 8 ++++++++ packages/frontend/i18n/src/resources/en.json | 2 ++ 6 files changed, 34 insertions(+), 6 deletions(-) diff --git a/blocksuite/affine/gfx/connector/src/toolbar/config.ts b/blocksuite/affine/gfx/connector/src/toolbar/config.ts index 1c4c2399e1..457863faaf 100644 --- a/blocksuite/affine/gfx/connector/src/toolbar/config.ts +++ b/blocksuite/affine/gfx/connector/src/toolbar/config.ts @@ -209,8 +209,7 @@ export const connectorToolbarConfig = { }, { id: 'b.style', - // TODO(@fundon): should add a feature flag - when: false, + when: ctx => ctx.features.getFlag('enable_edgeless_scribbled_style'), content(ctx) { const models = ctx.getSurfaceModelsByType(ConnectorElementModel); if (!models.length) return null; diff --git a/blocksuite/affine/gfx/shape/src/toolbar/config.ts b/blocksuite/affine/gfx/shape/src/toolbar/config.ts index c8cef50371..261eca92c7 100644 --- a/blocksuite/affine/gfx/shape/src/toolbar/config.ts +++ b/blocksuite/affine/gfx/shape/src/toolbar/config.ts @@ -112,6 +112,12 @@ export const shapeToolbarConfig = { const models = ctx.getSurfaceModelsByType(ShapeElementModel); if (!models.length) return null; + const shapeStyle = ctx.features.getFlag( + 'enable_edgeless_scribbled_style' + ) + ? (getMostCommonValue(models, 'shapeStyle') ?? ShapeStyle.General) + : ShapeStyle.General; + const shapeName = getMostCommonValue( models.map(model => ({ @@ -139,8 +145,10 @@ export const shapeToolbarConfig = { items: ShapeComponentConfig.map(item => ({ key: item.tooltip, value: item.name, - // TODO(@fundon): should add a feature flag to switch style - icon: item.generalIcon, + icon: + shapeStyle === ShapeStyle.General + ? item.generalIcon + : item.scribbledIcon, disabled: item.disabled, })), currentValue: shapeName, @@ -150,8 +158,7 @@ export const shapeToolbarConfig = { }, { id: 'd.style', - // TODO(@fundon): should add a feature flag - when: false, + when: ctx => ctx.features.getFlag('enable_edgeless_scribbled_style'), content(ctx) { const models = ctx.getSurfaceModelsByType(ShapeElementModel); if (!models.length) return null; diff --git a/blocksuite/affine/shared/src/services/feature-flag-service.ts b/blocksuite/affine/shared/src/services/feature-flag-service.ts index 10db4cb694..60022ae2da 100644 --- a/blocksuite/affine/shared/src/services/feature-flag-service.ts +++ b/blocksuite/affine/shared/src/services/feature-flag-service.ts @@ -19,6 +19,7 @@ export interface BlockSuiteFlags { enable_block_meta: boolean; enable_callout: boolean; enable_embed_iframe_block: boolean; + enable_edgeless_scribbled_style: boolean; } export class FeatureFlagService extends StoreExtension { @@ -42,6 +43,7 @@ export class FeatureFlagService extends StoreExtension { enable_block_meta: false, enable_callout: false, enable_embed_iframe_block: false, + enable_edgeless_scribbled_style: false, }); setFlag(key: keyof BlockSuiteFlags, value: boolean) { diff --git a/packages/frontend/core/src/modules/feature-flag/constant.ts b/packages/frontend/core/src/modules/feature-flag/constant.ts index 42d9a9e3cb..9ee05fb1b3 100644 --- a/packages/frontend/core/src/modules/feature-flag/constant.ts +++ b/packages/frontend/core/src/modules/feature-flag/constant.ts @@ -264,6 +264,16 @@ export const AFFINE_FLAGS = { configurable: isCanaryBuild, defaultState: false, }, + enable_edgeless_scribbled_style: { + category: 'blocksuite', + bsFlag: 'enable_edgeless_scribbled_style', + displayName: + 'com.affine.settings.workspace.experimental-features.enable-edgeless-scribbled-style.name', + description: + 'com.affine.settings.workspace.experimental-features.enable-edgeless-scribbled-style.description', + configurable: isCanaryBuild, + defaultState: false, + }, } satisfies { [key in string]: FlagInfo }; // oxlint-disable-next-line no-redeclare diff --git a/packages/frontend/i18n/src/i18n.gen.ts b/packages/frontend/i18n/src/i18n.gen.ts index 012b92cca6..ce47cfdfc7 100644 --- a/packages/frontend/i18n/src/i18n.gen.ts +++ b/packages/frontend/i18n/src/i18n.gen.ts @@ -5583,6 +5583,14 @@ export function useAFFiNEI18N(): { * `Once enabled, the editor will be displayed in RTL mode.` */ ["com.affine.settings.workspace.experimental-features.enable-editor-rtl.description"](): string; + /** + * `Edgeless scribbled style` + */ + ["com.affine.settings.workspace.experimental-features.enable-edgeless-scribbled-style.name"](): string; + /** + * `Once enabled, you can use scribbled style in edgeless mode.` + */ + ["com.affine.settings.workspace.experimental-features.enable-edgeless-scribbled-style.description"](): string; /** * `Only an owner can edit the workspace avatar and name. Changes will be shown for everyone.` */ diff --git a/packages/frontend/i18n/src/resources/en.json b/packages/frontend/i18n/src/resources/en.json index 26f283f94f..2481c6524d 100644 --- a/packages/frontend/i18n/src/resources/en.json +++ b/packages/frontend/i18n/src/resources/en.json @@ -1392,6 +1392,8 @@ "com.affine.settings.workspace.experimental-features.enable-audio-block.description": "Audio block allows you to play audio files globally and add notes to them.", "com.affine.settings.workspace.experimental-features.enable-editor-rtl.name": "Editor RTL", "com.affine.settings.workspace.experimental-features.enable-editor-rtl.description": "Once enabled, the editor will be displayed in RTL mode.", + "com.affine.settings.workspace.experimental-features.enable-edgeless-scribbled-style.name": "Edgeless scribbled style", + "com.affine.settings.workspace.experimental-features.enable-edgeless-scribbled-style.description": "Once enabled, you can use scribbled style in edgeless mode.", "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.billing": "Team's Billing",