feat(editor): add feature flag service (#9592)

This commit is contained in:
Saul-Mirone
2025-01-08 15:46:31 +00:00
parent fd26b72255
commit 3683297ccf
55 changed files with 283 additions and 188 deletions
@@ -12,6 +12,7 @@ import {
type RootBlockModel,
type SurfaceRefBlockModel,
} from '@blocksuite/affine-model';
import { FeatureFlagService } from '@blocksuite/affine-shared/services';
import {
matchFlavours,
stopPropagation,
@@ -555,9 +556,9 @@ export class EdgelessAutoConnectWidget extends WidgetComponent<
}
override render() {
const advancedVisibilityEnabled = this.doc.awarenessStore.getFlag(
'enable_advanced_block_visibility'
);
const advancedVisibilityEnabled = this.doc
.get(FeatureFlagService)
.getFlag('enable_advanced_block_visibility');
if (!this._show || this._dragging || !advancedVisibilityEnabled) {
return nothing;
@@ -17,6 +17,7 @@ import {
LineWidth,
resolveColor,
} from '@blocksuite/affine-model';
import { FeatureFlagService } from '@blocksuite/affine-shared/services';
import type { ColorEvent } from '@blocksuite/affine-shared/utils';
import { countBy, maxBy, WithDisposable } from '@blocksuite/global/utils';
import { html, LitElement, nothing } from 'lit';
@@ -120,7 +121,9 @@ export class EdgelessChangeBrushButton extends WithDisposable(LitElement) {
<editor-toolbar-separator></editor-toolbar-separator>
${when(
this.edgeless.doc.awarenessStore.getFlag('enable_color_picker'),
this.edgeless.doc
.get(FeatureFlagService)
.getFlag('enable_color_picker'),
() => {
const { type, colors } = packColorsWithColorScheme(
colorScheme,
@@ -42,6 +42,7 @@ import {
resolveColor,
StrokeStyle,
} from '@blocksuite/affine-model';
import { FeatureFlagService } from '@blocksuite/affine-shared/services';
import type { ColorEvent } from '@blocksuite/affine-shared/utils';
import { countBy, maxBy, WithDisposable } from '@blocksuite/global/utils';
import { html, LitElement, nothing, type TemplateResult } from 'lit';
@@ -361,7 +362,9 @@ export class EdgelessChangeConnectorButton extends WithDisposable(LitElement) {
return join(
[
when(
this.edgeless.doc.awarenessStore.getFlag('enable_color_picker'),
this.edgeless.doc
.get(FeatureFlagService)
.getFlag('enable_color_picker'),
() => {
const { type, colors } = packColorsWithColorScheme(
colorScheme,
@@ -40,6 +40,7 @@ import {
import {
EmbedOptionProvider,
type EmbedOptions,
FeatureFlagService,
GenerateDocUrlProvider,
type GenerateDocUrlService,
type LinkEventType,
@@ -390,9 +391,9 @@ export class EdgelessChangeEmbedCardButton extends WithDisposable(LitElement) {
// synced doc entry controlled by awareness flag
if (!!block && isEmbedLinkedDocBlock(block.model)) {
const isSyncedDocEnabled = block.doc.awarenessStore.getFlag(
'enable_synced_doc_block'
);
const isSyncedDocEnabled = block.doc
.get(FeatureFlagService)
.getFlag('enable_synced_doc_block');
if (!isSyncedDocEnabled) {
return false;
}
@@ -22,6 +22,7 @@ import {
NoteDisplayMode,
resolveColor,
} from '@blocksuite/affine-model';
import { FeatureFlagService } from '@blocksuite/affine-shared/services';
import type { ColorEvent } from '@blocksuite/affine-shared/utils';
import { matchFlavours } from '@blocksuite/affine-shared/utils';
import { GfxExtensionIdentifier } from '@blocksuite/block-std/gfx';
@@ -190,7 +191,9 @@ export class EdgelessChangeFrameButton extends WithDisposable(LitElement) {
`,
when(
this.edgeless.doc.awarenessStore.getFlag('enable_color_picker'),
this.edgeless.doc
.get(FeatureFlagService)
.getFlag('enable_color_picker'),
() => {
const { type, colors } = packColorsWithColorScheme(
colorScheme,
@@ -28,7 +28,10 @@ import {
resolveColor,
type StrokeStyle,
} from '@blocksuite/affine-model';
import { ThemeProvider } from '@blocksuite/affine-shared/services';
import {
FeatureFlagService,
ThemeProvider,
} from '@blocksuite/affine-shared/services';
import { matchFlavours } from '@blocksuite/affine-shared/utils';
import {
assertExists,
@@ -133,7 +136,9 @@ export class EdgelessChangeNoteButton extends WithDisposable(LitElement) {
};
private get _advancedVisibilityEnabled() {
return this.doc.awarenessStore.getFlag('enable_advanced_block_visibility');
return this.doc
.get(FeatureFlagService)
.getFlag('enable_advanced_block_visibility');
}
private get doc() {
@@ -301,7 +306,9 @@ export class EdgelessChangeNoteButton extends WithDisposable(LitElement) {
isDocOnly
? nothing
: when(
this.edgeless.doc.awarenessStore.getFlag('enable_color_picker'),
this.edgeless.doc
.get(FeatureFlagService)
.getFlag('enable_color_picker'),
() => {
const { type, colors } = packColorsWithColorScheme(
colorScheme,
@@ -34,6 +34,7 @@ import {
ShapeStyle,
StrokeStyle,
} from '@blocksuite/affine-model';
import { FeatureFlagService } from '@blocksuite/affine-shared/services';
import type { ColorEvent } from '@blocksuite/affine-shared/utils';
import { countBy, maxBy, WithDisposable } from '@blocksuite/global/utils';
import { css, html, LitElement, nothing, type TemplateResult } from 'lit';
@@ -317,7 +318,9 @@ export class EdgelessChangeShapeButton extends WithDisposable(LitElement) {
`,
when(
this.edgeless.doc.awarenessStore.getFlag('enable_color_picker'),
this.edgeless.doc
.get(FeatureFlagService)
.getFlag('enable_color_picker'),
() => {
const { type, colors } = packColorsWithColorScheme(
colorScheme,
@@ -367,7 +370,9 @@ export class EdgelessChangeShapeButton extends WithDisposable(LitElement) {
),
when(
this.edgeless.doc.awarenessStore.getFlag('enable_color_picker'),
this.edgeless.doc
.get(FeatureFlagService)
.getFlag('enable_color_picker'),
() => {
const { type, colors } = packColorsWithColorScheme(
colorScheme,
@@ -33,6 +33,7 @@ import {
TextElementModel,
type TextStyleProps,
} from '@blocksuite/affine-model';
import { FeatureFlagService } from '@blocksuite/affine-shared/services';
import type { ColorEvent } from '@blocksuite/affine-shared/utils';
import {
Bound,
@@ -372,7 +373,9 @@ export class EdgelessChangeTextMenu extends WithDisposable(LitElement) {
`,
when(
this.edgeless.doc.awarenessStore.getFlag('enable_color_picker'),
this.edgeless.doc
.get(FeatureFlagService)
.getFlag('enable_color_picker'),
() => {
const { type, colors } = packColorsWithColorScheme(
colorScheme,
@@ -44,6 +44,7 @@ import {
import {
EmbedOptionProvider,
type EmbedOptions,
FeatureFlagService,
GenerateDocUrlProvider,
type GenerateDocUrlService,
type LinkEventType,
@@ -203,9 +204,9 @@ export class EmbedCardToolbar extends WidgetComponent<
private get _canConvertToEmbedView() {
// synced doc entry controlled by awareness flag
if (this.focusModel && isEmbedLinkedDocBlock(this.focusModel)) {
const isSyncedDocEnabled = this.doc.awarenessStore.getFlag(
'enable_synced_doc_block'
);
const isSyncedDocEnabled = this.doc
.get(FeatureFlagService)
.getFlag('enable_synced_doc_block');
if (!isSyncedDocEnabled) {
return false;
}
@@ -1,4 +1,5 @@
import type { RootBlockModel } from '@blocksuite/affine-model';
import { FeatureFlagService } from '@blocksuite/affine-shared/services';
import { WidgetComponent } from '@blocksuite/block-std';
import { IS_MOBILE } from '@blocksuite/global/env';
import { assertType } from '@blocksuite/global/utils';
@@ -71,7 +72,9 @@ export class AffineKeyboardToolbarWidget extends WidgetComponent<
if (
this.doc.readonly ||
!IS_MOBILE ||
!this.doc.awarenessStore.getFlag('enable_mobile_keyboard_toolbar')
!this.doc
.get(FeatureFlagService)
.getFlag('enable_mobile_keyboard_toolbar')
)
return nothing;
@@ -3,6 +3,7 @@ import {
getRangeRects,
type SelectionRect,
} from '@blocksuite/affine-shared/commands';
import { FeatureFlagService } from '@blocksuite/affine-shared/services';
import { getViewportElement } from '@blocksuite/affine-shared/utils';
import type { BlockComponent } from '@blocksuite/block-std';
import { BLOCK_ID_ATTR, WidgetComponent } from '@blocksuite/block-std';
@@ -256,9 +257,9 @@ export class AffineLinkedDocWidget extends WidgetComponent<
},
};
const enableMobile = this.doc.awarenessStore.getFlag(
'enable_mobile_linked_doc_menu'
);
const enableMobile = this.doc
.get(FeatureFlagService)
.getFlag('enable_mobile_linked_doc_menu');
this._mode$.value = enableMobile ? mode : 'desktop';
}
@@ -39,7 +39,10 @@ import type {
ParagraphBlockModel,
} from '@blocksuite/affine-model';
import { REFERENCE_NODE } from '@blocksuite/affine-shared/consts';
import { TelemetryProvider } from '@blocksuite/affine-shared/services';
import {
FeatureFlagService,
TelemetryProvider,
} from '@blocksuite/affine-shared/services';
import {
createDefaultDoc,
openFileOrFiles,
@@ -574,7 +577,7 @@ export const defaultSlashMenuConfig: SlashMenuConfig = {
showWhen: ({ model }) =>
model.doc.schema.flavourSchemaMap.has('affine:database') &&
!insideEdgelessText(model) &&
!!model.doc.awarenessStore.getFlag('enable_block_query'),
!!model.doc.get(FeatureFlagService).getFlag('enable_block_query'),
action: ({ model, rootComponent }) => {
const parent = rootComponent.doc.getParent(model);