From e639f08b7145ad0e9685c1febfa90b0a27866cea Mon Sep 17 00:00:00 2001
From: L-Sun <zover.v@gmail.com>
Date: Tue, 18 Feb 2025 09:25:05 +0000
Subject: [PATCH] chore(editor): remove page block feature flag (#10251)

---
 .../components/edgeless-note-background.ts    |  3 +--
 .../components/edgeless-page-block-title.ts   |  3 +--
 blocksuite/affine/block-note/src/index.ts     |  1 -
 .../block-note/src/note-edgeless-block.ts     |  7 +++++--
 blocksuite/affine/block-note/src/utils.ts     | 18 ------------------
 .../model/src/blocks/note/note-model.ts       | 13 +++++++++++++
 .../src/services/feature-flag-service.ts      |  2 --
 .../edgeless/edgeless-root-block.ts           |  7 +------
 .../element-toolbar/change-note-button.ts     | 17 +++++++----------
 .../custom/widgets/edgeless-note-header.tsx   | 19 ++-----------------
 .../core/src/modules/feature-flag/constant.ts | 11 -----------
 packages/frontend/i18n/src/i18n.gen.ts        |  8 --------
 packages/frontend/i18n/src/resources/en.json  |  2 --
 13 files changed, 30 insertions(+), 81 deletions(-)
 delete mode 100644 blocksuite/affine/block-note/src/utils.ts

diff --git a/blocksuite/affine/block-note/src/components/edgeless-note-background.ts b/blocksuite/affine/block-note/src/components/edgeless-note-background.ts
index c91af88cc7cdf..88f838098ebca 100644
--- a/blocksuite/affine/block-note/src/components/edgeless-note-background.ts
+++ b/blocksuite/affine/block-note/src/components/edgeless-note-background.ts
@@ -36,7 +36,6 @@ import { property } from 'lit/decorators.js';
 import { styleMap } from 'lit/directives/style-map.js';
 
 import { NoteConfigExtension } from '../config';
-import { isPageBlock } from '../utils';
 import * as styles from './edgeless-note-background.css';
 
 @requiredProperties({
@@ -162,7 +161,7 @@ export class EdgelessNoteBackground extends SignalWatcher(
       @pointerdown=${stopPropagation}
       @click=${this._handleClickAtBackground}
     >
-      ${isPageBlock(this.std, this.note) ? this._renderHeader() : nothing}
+      ${this.note.isPageBlock() ? this._renderHeader() : nothing}
     </div>`;
   }
 
diff --git a/blocksuite/affine/block-note/src/components/edgeless-page-block-title.ts b/blocksuite/affine/block-note/src/components/edgeless-page-block-title.ts
index 6ece191c60254..e27f7d016b5ac 100644
--- a/blocksuite/affine/block-note/src/components/edgeless-page-block-title.ts
+++ b/blocksuite/affine/block-note/src/components/edgeless-page-block-title.ts
@@ -12,7 +12,6 @@ import { html } from 'lit';
 import { property } from 'lit/decorators.js';
 
 import { NoteConfigExtension } from '../config';
-import { isPageBlock } from '../utils';
 import * as styles from './edgeless-page-block-title.css';
 
 @requiredProperties({
@@ -22,7 +21,7 @@ export class EdgelessPageBlockTitle extends SignalWatcher(
   WithDisposable(ShadowlessElement)
 ) {
   override render() {
-    if (!isPageBlock(this.std, this.note)) return;
+    if (!this.note.isPageBlock()) return;
 
     const title = this.std
       .getOptional(NoteConfigExtension.identifier)
diff --git a/blocksuite/affine/block-note/src/index.ts b/blocksuite/affine/block-note/src/index.ts
index 2163db36e5fed..af41585d04158 100644
--- a/blocksuite/affine/block-note/src/index.ts
+++ b/blocksuite/affine/block-note/src/index.ts
@@ -6,4 +6,3 @@ export * from './note-block';
 export * from './note-edgeless-block';
 export * from './note-service';
 export * from './note-spec';
-export { isPageBlock } from './utils';
diff --git a/blocksuite/affine/block-note/src/note-edgeless-block.ts b/blocksuite/affine/block-note/src/note-edgeless-block.ts
index 02372048be10e..fa660e49b7df4 100644
--- a/blocksuite/affine/block-note/src/note-edgeless-block.ts
+++ b/blocksuite/affine/block-note/src/note-edgeless-block.ts
@@ -12,10 +12,10 @@ import { ifDefined } from 'lit/directives/if-defined.js';
 import { styleMap } from 'lit/directives/style-map.js';
 
 import { MoreIndicator } from './components/more-indicator';
+import { NoteConfigExtension } from './config';
 import { NoteBlockComponent } from './note-block';
 import { ACTIVE_NOTE_EXTRA_PADDING } from './note-edgeless-block.css';
 import * as styles from './note-edgeless-block.css';
-import { isPageBlock } from './utils';
 
 export const AFFINE_EDGELESS_NOTE = 'affine-edgeless-note';
 
@@ -219,6 +219,9 @@ export class EdgelessNoteBlockComponent extends toGfxBlockComponent(
       ? this._noteFullHeight < height
       : !!collapsedHeight && collapsedHeight < height;
 
+    const hasHeader = !!this.std.getOptional(NoteConfigExtension.identifier)
+      ?.edgelessNoteHeader;
+
     return html`
       <div
         class=${styles.edgelessNoteContainer}
@@ -260,7 +263,7 @@ export class EdgelessNoteBlockComponent extends toGfxBlockComponent(
           .editing=${this._editing}
         ></edgeless-note-mask>
 
-        ${isCollapsable && !isPageBlock(this.std, this.model)
+        ${isCollapsable && (!this.model.isPageBlock() || !hasHeader)
           ? html`<div
               class="${classMap({
                 [styles.collapseButton]: true,
diff --git a/blocksuite/affine/block-note/src/utils.ts b/blocksuite/affine/block-note/src/utils.ts
deleted file mode 100644
index 194d60253b27b..0000000000000
--- a/blocksuite/affine/block-note/src/utils.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-import { NoteBlockModel, NoteDisplayMode } from '@blocksuite/affine-model';
-import { FeatureFlagService } from '@blocksuite/affine-shared/services';
-import { matchModels } from '@blocksuite/affine-shared/utils';
-import type { BlockStdScope } from '@blocksuite/block-std';
-
-/**
- * We define a note block as a page block if it is the first visible note
- */
-export function isPageBlock(std: BlockStdScope, note: NoteBlockModel) {
-  return (
-    std.get(FeatureFlagService).getFlag('enable_page_block') &&
-    note.parent?.children.find(
-      child =>
-        matchModels(child, [NoteBlockModel]) &&
-        child.displayMode !== NoteDisplayMode.EdgelessOnly
-    ) === note
-  );
-}
diff --git a/blocksuite/affine/model/src/blocks/note/note-model.ts b/blocksuite/affine/model/src/blocks/note/note-model.ts
index b9057f94cc997..cf17e61addbe7 100644
--- a/blocksuite/affine/model/src/blocks/note/note-model.ts
+++ b/blocksuite/affine/model/src/blocks/note/note-model.ts
@@ -154,4 +154,17 @@ export class NoteBlockModel
     }
     return false;
   }
+
+  /**
+   * We define a note block as a page block if it is the first visible note
+   */
+  isPageBlock() {
+    return (
+      this.parent?.children.find(
+        child =>
+          child instanceof NoteBlockModel &&
+          child.displayMode !== NoteDisplayMode.EdgelessOnly
+      ) === this
+    );
+  }
 }
diff --git a/blocksuite/affine/shared/src/services/feature-flag-service.ts b/blocksuite/affine/shared/src/services/feature-flag-service.ts
index bde494fa2848f..f457ad1c54171 100644
--- a/blocksuite/affine/shared/src/services/feature-flag-service.ts
+++ b/blocksuite/affine/shared/src/services/feature-flag-service.ts
@@ -18,7 +18,6 @@ export interface BlockSuiteFlags {
   enable_shape_shadow_blur: boolean;
   enable_mobile_keyboard_toolbar: boolean;
   enable_mobile_linked_doc_menu: boolean;
-  enable_page_block: boolean;
 }
 
 export class FeatureFlagService extends StoreExtension {
@@ -41,7 +40,6 @@ export class FeatureFlagService extends StoreExtension {
     enable_shape_shadow_blur: false,
     enable_mobile_keyboard_toolbar: false,
     enable_mobile_linked_doc_menu: false,
-    enable_page_block: false,
   });
 
   setFlag(key: keyof BlockSuiteFlags, value: boolean) {
diff --git a/blocksuite/blocks/src/root-block/edgeless/edgeless-root-block.ts b/blocksuite/blocks/src/root-block/edgeless/edgeless-root-block.ts
index 7b96912e3edd8..7273ef2073c81 100644
--- a/blocksuite/blocks/src/root-block/edgeless/edgeless-root-block.ts
+++ b/blocksuite/blocks/src/root-block/edgeless/edgeless-root-block.ts
@@ -18,7 +18,6 @@ import {
   DocModeProvider,
   EditorSettingProvider,
   EditPropsStore,
-  FeatureFlagService,
   FontLoaderService,
   ThemeProvider,
 } from '@blocksuite/affine-shared/services';
@@ -399,11 +398,7 @@ export class EdgelessRootBlockComponent extends BlockComponent<
     const run = () => {
       const storedViewport = std.get(EditPropsStore).getStorage('viewport');
       if (!storedViewport) {
-        const enablePageBlock = this.std
-          .get(FeatureFlagService)
-          .getFlag('enable_page_block');
-
-        if (!(enablePageBlock && pageBlockViewportFitAnimation())) {
+        if (!pageBlockViewportFitAnimation()) {
           this.gfx.fitToScreen();
         }
         return;
diff --git a/blocksuite/blocks/src/root-block/widgets/element-toolbar/change-note-button.ts b/blocksuite/blocks/src/root-block/widgets/element-toolbar/change-note-button.ts
index 2c8d864307da0..4ec137a8188b1 100644
--- a/blocksuite/blocks/src/root-block/widgets/element-toolbar/change-note-button.ts
+++ b/blocksuite/blocks/src/root-block/widgets/element-toolbar/change-note-button.ts
@@ -1,6 +1,6 @@
 import {
   changeNoteDisplayMode,
-  isPageBlock,
+  NoteConfigExtension,
 } from '@blocksuite/affine-block-note';
 import { EdgelessCRUDIdentifier } from '@blocksuite/affine-block-surface';
 import type {
@@ -149,10 +149,6 @@ export class EdgelessChangeNoteButton extends WithDisposable(LitElement) {
       .getFlag('enable_advanced_block_visibility');
   }
 
-  private get _pageBlockEnabled() {
-    return this.doc.get(FeatureFlagService).getFlag('enable_page_block');
-  }
-
   private get doc() {
     return this.edgeless.doc;
   }
@@ -348,6 +344,10 @@ export class EdgelessChangeNoteButton extends WithDisposable(LitElement) {
     const onlyOne = len === 1;
     const isDocOnly = displayMode === NoteDisplayMode.DocOnly;
 
+    const hasPageBlockHeader = !!this.edgeless.std.getOptional(
+      NoteConfigExtension.identifier
+    )?.edgelessNoteHeader;
+
     const theme = this.edgeless.std.get(ThemeProvider).theme;
     const buttonIconSize = { width: '20px', height: '20px' };
     const buttons = [
@@ -378,10 +378,7 @@ export class EdgelessChangeNoteButton extends WithDisposable(LitElement) {
           `
         : nothing,
 
-      onlyOne &&
-      !isPageBlock(this.edgeless.std, note) &&
-      this._pageBlockEnabled &&
-      !this._advancedVisibilityEnabled
+      onlyOne && !note.isPageBlock() && !this._advancedVisibilityEnabled
         ? html`<editor-icon-button
             aria-label="Display In Page"
             .showTooltip=${displayMode === NoteDisplayMode.DocAndEdgeless}
@@ -536,7 +533,7 @@ export class EdgelessChangeNoteButton extends WithDisposable(LitElement) {
 
       onlyOne ? this.quickConnectButton : nothing,
 
-      !isPageBlock(this.edgeless.std, this.notes[0])
+      !this.notes[0].isPageBlock() || !hasPageBlockHeader
         ? html`<editor-icon-button
             aria-label="Size"
             data-testid="edgeless-note-auto-height"
diff --git a/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/widgets/edgeless-note-header.tsx b/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/widgets/edgeless-note-header.tsx
index ef6cd06813716..150ed8e6a5240 100644
--- a/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/widgets/edgeless-note-header.tsx
+++ b/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/widgets/edgeless-note-header.tsx
@@ -3,18 +3,13 @@ import { useSharingUrl } from '@affine/core/components/hooks/affine/use-share-ur
 import { WorkspaceDialogService } from '@affine/core/modules/dialogs';
 import { DocService } from '@affine/core/modules/doc';
 import { EditorService } from '@affine/core/modules/editor';
-import { FeatureFlagService } from '@affine/core/modules/feature-flag';
 import { useInsidePeekView } from '@affine/core/modules/peek-view/view/modal-container';
 import { WorkspaceService } from '@affine/core/modules/workspace';
 import { extractEmojiIcon } from '@affine/core/utils';
 import { useI18n } from '@affine/i18n';
 import { track } from '@affine/track';
 import { GfxControllerIdentifier } from '@blocksuite/affine/block-std/gfx';
-import {
-  matchModels,
-  NoteBlockModel,
-  NoteDisplayMode,
-} from '@blocksuite/affine/blocks';
+import { type NoteBlockModel } from '@blocksuite/affine/blocks';
 import { Bound } from '@blocksuite/affine/global/utils';
 import {
   InformationIcon,
@@ -184,19 +179,9 @@ const LinkButton = ({ note }: { note: NoteBlockModel }) => {
 };
 
 export const EdgelessNoteHeader = ({ note }: { note: NoteBlockModel }) => {
-  const flags = useService(FeatureFlagService).flags;
   const insidePeekView = useInsidePeekView();
 
-  if (!flags.enable_page_block) return null;
-
-  const isFirstVisibleNote =
-    note.parent?.children.find(
-      child =>
-        matchModels(child, [NoteBlockModel]) &&
-        child.displayMode === NoteDisplayMode.DocAndEdgeless
-    ) === note;
-
-  if (!isFirstVisibleNote) return null;
+  if (!note.isPageBlock()) return null;
 
   return (
     <div className={styles.header} data-testid="edgeless-page-block-header">
diff --git a/packages/frontend/core/src/modules/feature-flag/constant.ts b/packages/frontend/core/src/modules/feature-flag/constant.ts
index 6bf65266cbd85..434369382124a 100644
--- a/packages/frontend/core/src/modules/feature-flag/constant.ts
+++ b/packages/frontend/core/src/modules/feature-flag/constant.ts
@@ -231,17 +231,6 @@ export const AFFINE_FLAGS = {
     configurable: true,
     defaultState: isCanaryBuild,
   },
-  // TODO(@L-Sun): remove this flag when ready
-  enable_page_block: {
-    category: 'blocksuite',
-    bsFlag: 'enable_page_block',
-    displayName:
-      'com.affine.settings.workspace.experimental-features.enable-page-block-header.name',
-    description:
-      'com.affine.settings.workspace.experimental-features.enable-page-block-header.description',
-    configurable: isCanaryBuild,
-    defaultState: isCanaryBuild,
-  },
   enable_editor_rtl: {
     category: 'affine',
     displayName:
diff --git a/packages/frontend/i18n/src/i18n.gen.ts b/packages/frontend/i18n/src/i18n.gen.ts
index 34f63fd6bec44..7f443faa46ca1 100644
--- a/packages/frontend/i18n/src/i18n.gen.ts
+++ b/packages/frontend/i18n/src/i18n.gen.ts
@@ -5437,14 +5437,6 @@ export function useAFFiNEI18N(): {
       * `Once enabled, you can preview PDF in embed view.`
       */
     ["com.affine.settings.workspace.experimental-features.enable-pdf-embed-preview.description"](): string;
-    /**
-      * `Page Block Header`
-      */
-    ["com.affine.settings.workspace.experimental-features.enable-page-block-header.name"](): string;
-    /**
-      * `Once enabled, the header of page block will be displayed.`
-      */
-    ["com.affine.settings.workspace.experimental-features.enable-page-block-header.description"](): string;
     /**
       * `Editor RTL`
       */
diff --git a/packages/frontend/i18n/src/resources/en.json b/packages/frontend/i18n/src/resources/en.json
index f93bb3c01df9e..a7192903e81fa 100644
--- a/packages/frontend/i18n/src/resources/en.json
+++ b/packages/frontend/i18n/src/resources/en.json
@@ -1357,8 +1357,6 @@
   "com.affine.settings.workspace.experimental-features.enable-mobile-edgeless-editing.description": "Once enabled, users can edit edgeless canvas.",
   "com.affine.settings.workspace.experimental-features.enable-pdf-embed-preview.name": "PDF embed preview",
   "com.affine.settings.workspace.experimental-features.enable-pdf-embed-preview.description": "Once enabled, you can preview PDF in embed view.",
-  "com.affine.settings.workspace.experimental-features.enable-page-block-header.name": "Page Block Header",
-  "com.affine.settings.workspace.experimental-features.enable-page-block-header.description": "Once enabled, the header of page block will be displayed.",
   "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.not-owner": "Only an owner can edit the workspace avatar and name. Changes will be shown for everyone.",