refactor(editor): remove database-service (#9769)

close: BS-2426

blocksuite/affine/block-database/src/commands.ts

@@ -1,4 +1,11 @@
+import type { DatabaseBlockModel } from '@blocksuite/affine-model';
 import type { BlockCommands, Command } from '@blocksuite/block-std';
+import type { BlockModel, Store } from '@blocksuite/store';
+
+import {
+  DatabaseBlockDataSource,
+  databaseViewInitTemplate,
+} from './data-source';
 
 export const insertDatabaseBlockCommand: Command<
   'selectedModels',
@@ -17,8 +24,7 @@ export const insertDatabaseBlockCommand: Command<
       ? selectedModels[0]
       : selectedModels[selectedModels.length - 1];
 
-  const service = std.getService('affine:database');
-  if (!service || !targetModel) return;
+  if (!targetModel) return;
 
   const result = std.store.addSiblingBlocks(
     targetModel,
@@ -29,7 +35,7 @@ export const insertDatabaseBlockCommand: Command<
 
   if (string == null) return;
 
-  service.initDatabaseBlock(std.store, targetModel, string, viewType, false);
+  initDatabaseBlock(std.store, targetModel, string, viewType, false);
 
   if (removeEmptyLine && targetModel.text?.length === 0) {
     std.store.deleteBlock(targetModel);
@@ -38,6 +44,28 @@ export const insertDatabaseBlockCommand: Command<
   next({ insertedDatabaseBlockId: string });
 };
 
+export const initDatabaseBlock = (
+  doc: Store,
+  model: BlockModel,
+  databaseId: string,
+  viewType: string,
+  isAppendNewRow = true
+) => {
+  const blockModel = doc.getBlock(databaseId)?.model as
+    | DatabaseBlockModel
+    | undefined;
+  if (!blockModel) {
+    return;
+  }
+  const datasource = new DatabaseBlockDataSource(blockModel);
+  databaseViewInitTemplate(datasource, viewType);
+  if (isAppendNewRow) {
+    const parent = doc.getParent(model);
+    if (!parent) return;
+    doc.addBlock('affine:paragraph', {}, parent.id);
+  }
+};
+
 export const commands: BlockCommands = {
   insertDatabaseBlock: insertDatabaseBlockCommand,
 };

blocksuite/affine/block-database/src/data-source.ts

@@ -1,4 +1,8 @@
-import type { DatabaseBlockModel } from '@blocksuite/affine-model';
+import type {
+  Column,
+  ColumnUpdater,
+  DatabaseBlockModel,
+} from '@blocksuite/affine-model';
 import { FeatureFlagService } from '@blocksuite/affine-shared/services';
 import {
   insertPositionToIndex,
@@ -19,7 +23,6 @@ import {
 import { propertyPresets } from '@blocksuite/data-view/property-presets';
 import { IS_MOBILE } from '@blocksuite/global/env';
 import { BlockSuiteError, ErrorCode } from '@blocksuite/global/exceptions';
-import { assertExists } from '@blocksuite/global/utils';
 import { type BlockModel, nanoid, Text } from '@blocksuite/store';
 import { computed, type ReadonlySignal } from '@preact/signals-core';
 
@@ -29,7 +32,6 @@ import {
   databaseBlockPropertyList,
   databasePropertyConverts,
 } from './properties/index.js';
-import { titlePropertyModelConfig } from './properties/title/define.js';
 import {
   addProperty,
   applyCellsUpdate,
@@ -38,7 +40,6 @@ import {
   deleteRows,
   deleteView,
   duplicateView,
-  findPropertyIndex,
   getCell,
   getProperty,
   moveViewTo,
@@ -69,7 +70,17 @@ export class DatabaseBlockDataSource extends DataSourceBase {
   });
 
   properties$: ReadonlySignal<string[]> = computed(() => {
-    return this._model.columns$.value.map(column => column.id);
+    const fixedPropertiesSet = new Set(this.fixedProperties$.value);
+    const properties: string[] = [];
+    this._model.columns$.value.forEach(column => {
+      if (fixedPropertiesSet.has(column.type)) {
+        fixedPropertiesSet.delete(column.type);
+      }
+      properties.push(column.id);
+    });
+
+    const result = [...fixedPropertiesSet, ...properties];
+    return result;
   });
 
   readonly$: ReadonlySignal<boolean> = computed(() => {
@@ -98,9 +109,15 @@ export class DatabaseBlockDataSource extends DataSourceBase {
     return this._model.doc;
   }
 
-  get propertyMetas(): PropertyMetaConfig<any, any, any>[] {
+  allPropertyMetas$ = computed<PropertyMetaConfig<any, any, any>[]>(() => {
     return databaseBlockPropertyList;
-  }
+  });
+
+  propertyMetas$ = computed<PropertyMetaConfig[]>(() => {
+    return this.allPropertyMetas$.value.filter(
+      v => !v.config.fixed && !v.config.hide
+    );
+  });
 
   constructor(model: DatabaseBlockModel) {
     super();
@@ -147,13 +164,6 @@ export class DatabaseBlockDataSource extends DataSourceBase {
         newValue: value,
       });
     }
-    if (type === 'title' && newValue instanceof Text) {
-      this._model.doc.transact(() => {
-        this._model.text?.clear();
-        this._model.text?.join(newValue);
-      });
-      return;
-    }
     if (this._model.columns$.value.some(v => v.id === propertyId)) {
       updateCell(this._model, rowId, {
         columnId: propertyId,
@@ -193,34 +203,108 @@ export class DatabaseBlockDataSource extends DataSourceBase {
     return result;
   }
 
-  propertyDataGet(propertyId: string): Record<string, unknown> {
-    return (
-      this._model.columns$.value.find(v => v.id === propertyId)?.data ?? {}
+  protected override getNormalPropertyAndIndex(propertyId: string):
+    | {
+        column: Column<Record<string, unknown>>;
+        index: number;
+      }
+    | undefined {
+    const index = this._model.columns$.value.findIndex(
+      v => v.id === propertyId
     );
+    if (index >= 0) {
+      const column = this._model.columns$.value[index];
+      if (!column) {
+        return;
+      }
+      return {
+        column,
+        index,
+      };
+    }
+    return;
+  }
+
+  private getPropertyAndIndex(propertyId: string):
+    | {
+        column: Column<Record<string, unknown>>;
+        index: number;
+      }
+    | undefined {
+    const result = this.getNormalPropertyAndIndex(propertyId);
+    if (result) {
+      return result;
+    }
+    if (this.isFixedProperty(propertyId)) {
+      const meta = this.propertyMetaGet(propertyId);
+      const defaultData = meta.config.fixed?.defaultData ?? {};
+      return {
+        column: {
+          data: defaultData,
+          id: propertyId,
+          type: propertyId,
+          name: meta.config.name,
+        },
+        index: -1,
+      };
+    }
+    return undefined;
+  }
+
+  private updateProperty(id: string, updater: ColumnUpdater) {
+    const result = this.getPropertyAndIndex(id);
+    if (!result) {
+      return;
+    }
+    const { column: prevColumn, index } = result;
+    this._model.doc.transact(() => {
+      if (index >= 0) {
+        const result = updater(prevColumn);
+        this._model.columns[index] = { ...prevColumn, ...result };
+      } else {
+        const result = updater(prevColumn);
+        this._model.columns = [
+          ...this._model.columns,
+          { ...prevColumn, ...result },
+        ];
+      }
+    });
+    return id;
+  }
+
+  propertyDataGet(propertyId: string): Record<string, unknown> {
+    const result = this.getPropertyAndIndex(propertyId);
+    if (!result) {
+      return {};
+    }
+    return result.column.data;
   }
 
   propertyDataSet(propertyId: string, data: Record<string, unknown>): void {
     this._runCapture();
-
-    updateProperty(this._model, propertyId, () => ({ data }));
+    this.updateProperty(propertyId, () => ({ data }));
     applyPropertyUpdate(this._model);
   }
 
   propertyDataTypeGet(propertyId: string): TypeInstance | undefined {
-    const data = this._model.columns$.value.find(v => v.id === propertyId);
-    if (!data) {
+    const result = this.getPropertyAndIndex(propertyId);
+    if (!result) {
       return;
     }
-    const meta = this.propertyMetaGet(data.type);
+    const { column } = result;
+    const meta = this.propertyMetaGet(column.type);
     return meta.config.type({
-      data: data.data,
+      data: column.data,
       dataSource: this,
     });
   }
 
   propertyDelete(id: string): void {
+    if (this.isFixedProperty(id)) {
+      return;
+    }
     this.doc.captureSync();
-    const index = findPropertyIndex(this._model, id);
+    const index = this._model.columns.findIndex(v => v.id === id);
     if (index < 0) return;
 
     this.doc.transact(() => {
@@ -228,10 +312,15 @@ export class DatabaseBlockDataSource extends DataSourceBase {
     });
   }
 
-  propertyDuplicate(propertyId: string): string {
+  propertyDuplicate(propertyId: string): string | undefined {
+    if (this.isFixedProperty(propertyId)) {
+      return;
+    }
     this.doc.captureSync();
     const currentSchema = getProperty(this._model, propertyId);
-    assertExists(currentSchema);
+    if (!currentSchema) {
+      return;
+    }
     const { id: copyId, ...nonIdProps } = currentSchema;
     const names = new Set(this._model.columns$.value.map(v => v.name));
     let index = 1;
@@ -267,14 +356,16 @@ export class DatabaseBlockDataSource extends DataSourceBase {
     if (propertyId === 'type') {
       return 'Block Type';
     }
-    return (
-      this._model.columns$.value.find(v => v.id === propertyId)?.name ?? ''
-    );
+    const result = this.getPropertyAndIndex(propertyId);
+    if (!result) {
+      return '';
+    }
+    return result.column.name;
   }
 
   propertyNameSet(propertyId: string, name: string): void {
     this.doc.captureSync();
-    updateProperty(this._model, propertyId, () => ({ name }));
+    this.updateProperty(propertyId, () => ({ name }));
     applyPropertyUpdate(this._model);
   }
 
@@ -287,12 +378,17 @@ export class DatabaseBlockDataSource extends DataSourceBase {
     if (propertyId === 'type') {
       return 'image';
     }
-    return (
-      this._model.columns$.value.find(v => v.id === propertyId)?.type ?? ''
-    );
+    const result = this.getPropertyAndIndex(propertyId);
+    if (!result) {
+      return '';
+    }
+    return result.column.type;
   }
 
   propertyTypeSet(propertyId: string, toType: string): void {
+    if (this.isFixedProperty(propertyId)) {
+      return;
+    }
     const currentType = this.propertyTypeGet(propertyId);
     const currentData = this.propertyDataGet(propertyId);
     const rows = this.rows$.value;
@@ -409,77 +505,54 @@ export class DatabaseBlockDataSource extends DataSourceBase {
   }
 }
 
-export const databaseViewAddView = (
-  model: DatabaseBlockModel,
-  viewType: string
-) => {
-  const dataSource = new DatabaseBlockDataSource(model);
-  dataSource.viewManager.viewAdd(viewType);
-};
-export const databaseViewInitEmpty = (
-  model: DatabaseBlockModel,
-  viewType: string
-) => {
-  addProperty(
-    model,
-    'start',
-    titlePropertyModelConfig.create(titlePropertyModelConfig.config.name)
-  );
-  databaseViewAddView(model, viewType);
-};
-export const databaseViewInitConvert = (
-  model: DatabaseBlockModel,
-  viewType: string
-) => {
-  addProperty(
-    model,
-    'end',
-    propertyPresets.multiSelectPropertyConfig.create('Tag', { options: [] })
-  );
-  databaseViewInitEmpty(model, viewType);
-};
 export const databaseViewInitTemplate = (
-  model: DatabaseBlockModel,
+  datasource: DatabaseBlockDataSource,
   viewType: string
 ) => {
   const ids = [nanoid(), nanoid(), nanoid()] as const;
-  const statusId = addProperty(
-    model,
+  const titleId = datasource.properties$.value[0];
+  const statusId = datasource.propertyAdd(
     'end',
-    propertyPresets.selectPropertyConfig.create('Status', {
-      options: [
-        {
-          id: ids[0],
-          color: getTagColor(),
-          value: 'TODO',
-        },
-        {
-          id: ids[1],
-          color: getTagColor(),
-          value: 'In Progress',
-        },
-        {
-          id: ids[2],
-          color: getTagColor(),
-          value: 'Done',
-        },
-      ],
-    })
+    propertyPresets.selectPropertyConfig.type
   );
-  for (let i = 0; i < 4; i++) {
-    const rowId = model.doc.addBlock(
-      'affine:paragraph',
+  datasource.propertyNameSet(statusId, 'Status');
+  datasource.propertyDataSet(statusId, {
+    options: [
       {
-        text: new Text(`Task ${i + 1}`),
+        id: ids[0],
+        color: getTagColor(),
+        value: 'TODO',
       },
-      model.id
-    );
-    updateCell(model, rowId, {
-      columnId: statusId,
-      value: ids[i],
-    });
+      {
+        id: ids[1],
+        color: getTagColor(),
+        value: 'In Progress',
+      },
+      {
+        id: ids[2],
+        color: getTagColor(),
+        value: 'Done',
+      },
+    ],
+  });
+  for (let i = 0; i < 4; i++) {
+    const rowId = datasource.rowAdd('end');
+    if (titleId) {
+      const text = datasource.cellValueGet(rowId, titleId);
+      if (text instanceof Text) {
+        text.replace(0, text.length, `Task ${i + 1}`);
+      }
+    }
+    datasource.cellValueChange(rowId, statusId, ids[i]);
+    // const rowId = model.doc.addBlock(
+    //   'affine:paragraph',
+    //   {
+    //     text: new Text(`Task ${i + 1}`),
+    //   },
+    //   model.id
+    // );
   }
-  databaseViewInitEmpty(model, viewType);
+  datasource.viewManager.viewAdd(viewType);
 };
 export const convertToDatabase = (host: EditorHost, viewType: string) => {
   const [_, ctx] = host.std.command
@@ -511,8 +584,8 @@ export const convertToDatabase = (host: EditorHost, viewType: string) => {
   if (!databaseModel) {
     return;
   }
-  databaseViewInitConvert(databaseModel, viewType);
-  applyPropertyUpdate(databaseModel);
+  const datasource = new DatabaseBlockDataSource(databaseModel);
+  datasource.viewManager.viewAdd(viewType);
   host.doc.moveBlocks(selectedModels, databaseModel);
 
   const selectionManager = host.selection;

blocksuite/affine/block-database/src/database-block.ts

@@ -51,17 +51,13 @@ import { popSideDetail } from './components/layout.js';
 import type { DatabaseOptionsConfig } from './config.js';
 import { HostContextKey } from './context/host-context.js';
 import { DatabaseBlockDataSource } from './data-source.js';
-import type { DatabaseBlockService } from './database-service.js';
 import { BlockRenderer } from './detail-panel/block-renderer.js';
 import { NoteRenderer } from './detail-panel/note-renderer.js';
 import { DatabaseSelection } from './selection.js';
 import { currentViewStorage } from './utils/current-view.js';
 import { getSingleDocIdFromText } from './utils/title-doc.js';
 
-export class DatabaseBlockComponent extends CaptionedBlockComponent<
-  DatabaseBlockModel,
-  DatabaseBlockService
-> {
+export class DatabaseBlockComponent extends CaptionedBlockComponent<DatabaseBlockModel> {
   static override styles = css`
     ${unsafeCSS(dataViewCommonStyle('affine-database'))}
     affine-database {

blocksuite/affine/block-database/src/database-service.ts

@@ -1,59 +0,0 @@
-import {
-  type DatabaseBlockModel,
-  DatabaseBlockSchema,
-} from '@blocksuite/affine-model';
-import { BlockService } from '@blocksuite/block-std';
-import { viewPresets } from '@blocksuite/data-view/view-presets';
-import type { BlockModel, Store } from '@blocksuite/store';
-
-import {
-  databaseViewAddView,
-  databaseViewInitEmpty,
-  databaseViewInitTemplate,
-} from './data-source.js';
-import {
-  addProperty,
-  applyPropertyUpdate,
-  updateCell,
-  updateView,
-} from './utils/block-utils.js';
-
-export class DatabaseBlockService extends BlockService {
-  static override readonly flavour = DatabaseBlockSchema.model.flavour;
-
-  addColumn = addProperty;
-
-  applyColumnUpdate = applyPropertyUpdate;
-
-  databaseViewAddView = databaseViewAddView;
-
-  databaseViewInitEmpty = databaseViewInitEmpty;
-
-  updateCell = updateCell;
-
-  updateView = updateView;
-
-  viewPresets = viewPresets;
-
-  initDatabaseBlock(
-    doc: Store,
-    model: BlockModel,
-    databaseId: string,
-    viewType: string,
-    isAppendNewRow = true
-  ) {
-    const blockModel = doc.getBlock(databaseId)?.model as
-      | DatabaseBlockModel
-      | undefined;
-    if (!blockModel) {
-      return;
-    }
-    databaseViewInitTemplate(blockModel, viewType);
-    if (isAppendNewRow) {
-      const parent = doc.getParent(model);
-      if (!parent) return;
-      doc.addBlock('affine:paragraph', {}, parent.id);
-    }
-    applyPropertyUpdate(blockModel);
-  }
-}

blocksuite/affine/block-database/src/database-spec.ts

@@ -8,11 +8,9 @@ import { literal } from 'lit/static-html.js';
 
 import { DatabaseBlockAdapterExtensions } from './adapters/extension.js';
 import { commands } from './commands.js';
-import { DatabaseBlockService } from './database-service.js';
 
 export const DatabaseBlockSpec: ExtensionType[] = [
   FlavourExtension('affine:database'),
-  DatabaseBlockService,
   CommandExtension(commands),
   BlockViewExtension('affine:database', literal`affine-database`),
   DatabaseBlockAdapterExtensions,

blocksuite/affine/block-database/src/effects.ts

@@ -3,7 +3,6 @@ import { CenterPeek } from './components/layout';
 import { DatabaseTitle } from './components/title';
 import type { DatabaseOptionsConfig } from './config';
 import { DatabaseBlockComponent } from './database-block';
-import type { DatabaseBlockService } from './database-service';
 import { BlockRenderer } from './detail-panel/block-renderer';
 import { NoteRenderer } from './detail-panel/note-renderer';
 import { LinkCell, LinkCellEditing } from './properties/link/cell-renderer';
@@ -60,9 +59,5 @@ declare global {
        */
       insertDatabaseBlock: typeof insertDatabaseBlockCommand;
     }
-
-    interface BlockServices {
-      'affine:database': DatabaseBlockService;
-    }
   }
 }

blocksuite/affine/block-database/src/index.ts

@@ -6,7 +6,6 @@ export * from './adapters';
 export type { DatabaseOptionsConfig } from './config';
 export * from './data-source';
 export * from './database-block';
-export * from './database-service';
 export * from './database-spec';
 export * from './detail-panel/block-renderer';
 export * from './detail-panel/note-renderer';

blocksuite/affine/block-database/src/properties/index.ts

@@ -21,18 +21,12 @@ export const databaseBlockColumns = {
   numberColumnConfig: numberPropertyConfig,
   progressColumnConfig: progressPropertyConfig,
   selectColumnConfig: selectPropertyConfig,
+  imageColumnConfig: propertyPresets.imagePropertyConfig,
   linkColumnConfig,
   richTextColumnConfig,
+  titleColumnConfig,
 };
 export const databaseBlockPropertyList = Object.values(databaseBlockColumns);
-export const databaseBlockHiddenColumns = [
-  propertyPresets.imagePropertyConfig,
-  titleColumnConfig,
-];
-const databaseBlockAllColumns = [
-  ...databaseBlockPropertyList,
-  ...databaseBlockHiddenColumns,
-];
 export const databaseBlockAllPropertyMap = Object.fromEntries(
-  databaseBlockAllColumns.map(v => [v.type, v as PropertyMetaConfig])
+  databaseBlockPropertyList.map(v => [v.type, v as PropertyMetaConfig])
 );

blocksuite/affine/block-database/src/properties/rich-text/cell-renderer.ts

@@ -3,7 +3,6 @@ import type {
   RichText,
 } from '@blocksuite/affine-components/rich-text';
 import { DefaultInlineManagerExtension } from '@blocksuite/affine-components/rich-text';
-import type { RootBlockModel } from '@blocksuite/affine-model';
 import {
   ParseDocUrlProvider,
   TelemetryProvider,
@@ -23,8 +22,7 @@ import { assertExists } from '@blocksuite/global/utils';
 import type { DeltaInsert } from '@blocksuite/inline';
 import type { BlockSnapshot } from '@blocksuite/store';
 import { Text } from '@blocksuite/store';
-import { computed, signal } from '@preact/signals-core';
-import { css, nothing } from 'lit';
+import { css } from 'lit';
 import { query } from 'lit/decorators.js';
 import { keyed } from 'lit/directives/keyed.js';
 import { html } from 'lit/static-html.js';
@@ -143,12 +141,6 @@ abstract class BaseRichTextCell extends BaseCellRenderer<Text> {
       ?.std.get(DefaultInlineManagerExtension.identifier);
   }
 
-  get service() {
-    return this.view
-      .contextGet(HostContextKey)
-      ?.std.getService('affine:database');
-  }
-
   get topContenteditableElement() {
     const databaseBlock =
       this.closest<DatabaseBlockComponent>('affine-database');
@@ -172,19 +164,6 @@ abstract class BaseRichTextCell extends BaseCellRenderer<Text> {
 
   @query('.affine-database-rich-text')
   accessor _richTextElement!: HTMLElement;
-
-  docId$ = signal<string>();
-
-  isLinkedDoc$ = computed(() => false);
-
-  linkedDocTitle$ = computed(() => {
-    if (!this.docId$.value) {
-      return this.value;
-    }
-    const doc = this.host?.std.workspace.getDoc(this.docId$.value);
-    const root = doc?.root as RootBlockModel;
-    return root.title;
-  });
 }
 
 export class RichTextCell extends BaseRichTextCell {
@@ -232,7 +211,6 @@ export class RichTextCell extends BaseRichTextCell {
   }
 
   override render() {
-    if (!this.service) return nothing;
     if (!this.value || !(this.value instanceof Text)) {
       return html`<div class="affine-database-rich-text"></div>`;
     }
@@ -492,7 +470,6 @@ export class RichTextCellEditing extends BaseRichTextCell {
 
   override connectedCallback() {
     super.connectedCallback();
-
     if (!this.value || typeof this.value === 'string') {
       this._initYText(this.value);
     }
@@ -540,7 +517,6 @@ export class RichTextCellEditing extends BaseRichTextCell {
   }
 
   override render() {
-    if (!this.service) return nothing;
     return html`<rich-text
       .yText=${this.value}
       .inlineEventSource=${this.topContenteditableElement}

blocksuite/affine/block-database/src/properties/rich-text/define.ts

@@ -21,6 +21,7 @@ export const richTextPropertyModelConfig =
       };
     },
     cellToJson: ({ value, dataSource }) => {
+      if (!value) return null;
       const host = dataSource.contextGet(HostContextKey);
       if (host) {
         const collection = host.std.workspace;

blocksuite/affine/block-database/src/properties/title/define.ts

@@ -8,6 +8,10 @@ export const titleColumnType = propertyType('title');
 
 export const titlePropertyModelConfig = titleColumnType.modelConfig<Text>({
   name: 'Title',
+  fixed: {
+    defaultData: {},
+    defaultShow: true,
+  },
   type: () => t.richText.instance(),
   defaultData: () => ({}),
   cellToString: ({ value }) => value?.toString() ?? '',
@@ -17,6 +21,7 @@ export const titlePropertyModelConfig = titleColumnType.modelConfig<Text>({
     };
   },
   cellToJson: ({ value, dataSource }) => {
+    if (!value) return null;
     const host = dataSource.contextGet(HostContextKey);
     if (host) {
       const collection = host.std.workspace;

blocksuite/affine/block-database/src/utils/block-utils.ts

@@ -77,7 +77,7 @@ export function deleteColumn(
   model: DatabaseBlockModel,
   columnId: Column['id']
 ) {
-  const index = findPropertyIndex(model, columnId);
+  const index = model.columns.findIndex(v => v.id === columnId);
   if (index < 0) return;
 
   model.doc.transact(() => {
@@ -116,10 +116,6 @@ export function duplicateView(model: DatabaseBlockModel, id: string): string {
   return newId;
 }
 
-export function findPropertyIndex(model: DatabaseBlockModel, id: Column['id']) {
-  return model.columns.findIndex(v => v.id === id);
-}
-
 export function getCell(
   model: DatabaseBlockModel,
   rowId: BlockModel['id'],
@@ -228,7 +224,8 @@ export function updateCells(
 export function updateProperty(
   model: DatabaseBlockModel,
   id: string,
-  updater: ColumnUpdater
+  updater: ColumnUpdater,
+  defaultValue?: Record<string, unknown>
 ) {
   const index = model.columns.findIndex(v => v.id === id);
   if (index == null) {
@@ -240,7 +237,7 @@ export function updateProperty(
       return;
     }
     const result = updater(column);
-    model.columns[index] = { ...column, ...result };
+    model.columns[index] = { ...defaultValue, ...column, ...result };
   });
   return id;
 }