refactor(editor): configurable page block title (#10063)

### What changes
- make page block title rendering configurable so that a journal title can be rendered by AFFiNE side.
- move page block render logic to a seperate component

blocksuite/affine/block-note/src/components/edgeless-note-background.ts

@@ -1,13 +1,9 @@
 import {
   DefaultTheme,
   NoteBlockModel,
-  NoteDisplayMode,
   StrokeStyle,
 } from '@blocksuite/affine-model';
-import {
-  FeatureFlagService,
-  ThemeProvider,
-} from '@blocksuite/affine-shared/services';
+import { ThemeProvider } from '@blocksuite/affine-shared/services';
 import {
   getClosestBlockComponentByPoint,
   handleNativeRangeAtPoint,
@@ -37,6 +33,7 @@ import { html, nothing } from 'lit';
 import { property } from 'lit/decorators.js';
 import { styleMap } from 'lit/directives/style-map.js';
 
+import { isPageBlock } from '../utils';
 import * as styles from './edgeless-note-background.css';
 
 @requiredProperties({
@@ -74,18 +71,6 @@ export class EdgelessNoteBackground extends SignalWatcher(
     return this.std.host.doc;
   }
 
-  private get _isPageBlock() {
-    return (
-      this.std.get(FeatureFlagService).getFlag('enable_page_block') &&
-      // is the first page visible note
-      this.note.parent?.children.find(
-        child =>
-          matchFlavours(child, ['affine:note']) &&
-          child.displayMode !== NoteDisplayMode.EdgelessOnly
-      ) === this.note
-    );
-  }
-
   private _tryAddParagraph(x: number, y: number) {
     const nearest = getClosestBlockComponentByPoint(
       new Point(x, y)
@@ -174,7 +159,7 @@ export class EdgelessNoteBackground extends SignalWatcher(
       @pointerdown=${stopPropagation}
       @click=${this._handleClickAtBackground}
     >
-      ${this._isPageBlock ? this._renderHeader() : nothing}
+      ${isPageBlock(this.std, this.note) ? this._renderHeader() : nothing}
     </div>`;
   }