feat(editor): unify block props api (#10888)

Closes: [BS-2707](https://linear.app/affine-design/issue/BS-2707/统一使用props获取和更新block-prop)
This commit is contained in:
Saul-Mirone
2025-03-16 05:48:34 +00:00
parent 8f9e5bf0aa
commit 26285f7dcb
193 changed files with 1019 additions and 891 deletions
@@ -70,7 +70,7 @@ export class DatabaseBlockDataSource extends DataSourceBase {
properties$: ReadonlySignal<string[]> = computed(() => {
const fixedPropertiesSet = new Set(this.fixedProperties$.value);
const properties: string[] = [];
this._model.columns$.value.forEach(column => {
this._model.props.columns$.value.forEach(column => {
if (fixedPropertiesSet.has(column.type)) {
fixedPropertiesSet.delete(column.type);
}
@@ -96,7 +96,7 @@ export class DatabaseBlockDataSource extends DataSourceBase {
viewConverts = databaseBlockViewConverts;
viewDataList$: ReadonlySignal<DataViewDataType[]> = computed(() => {
return this._model.views$.value as DataViewDataType[];
return this._model.props.views$.value as DataViewDataType[];
});
override viewManager: ViewManager = new ViewManagerBase(this);
@@ -140,7 +140,9 @@ export class DatabaseBlockDataSource extends DataSourceBase {
private newPropertyName() {
let i = 1;
while (
this._model.columns$.value.some(column => column.name === `Column ${i}`)
this._model.props.columns$.value.some(
column => column.name === `Column ${i}`
)
) {
i++;
}
@@ -164,7 +166,7 @@ export class DatabaseBlockDataSource extends DataSourceBase {
dataSource: this,
newValue: value,
setValue: newValue => {
if (this._model.columns$.value.some(v => v.id === propertyId)) {
if (this._model.props.columns$.value.some(v => v.id === propertyId)) {
updateCell(this._model, rowId, {
columnId: propertyId,
value: newValue,
@@ -227,11 +229,11 @@ export class DatabaseBlockDataSource extends DataSourceBase {
index: number;
}
| undefined {
const index = this._model.columns$.value.findIndex(
const index = this._model.props.columns$.value.findIndex(
v => v.id === propertyId
);
if (index >= 0) {
const column = this._model.columns$.value[index];
const column = this._model.props.columns$.value[index];
if (!column) {
return;
}
@@ -281,11 +283,11 @@ export class DatabaseBlockDataSource extends DataSourceBase {
this._model.doc.transact(() => {
if (index >= 0) {
const result = updater(prevColumn);
this._model.columns[index] = { ...prevColumn, ...result };
this._model.props.columns[index] = { ...prevColumn, ...result };
} else {
const result = updater(prevColumn);
this._model.columns = [
...this._model.columns,
this._model.props.columns = [
...this._model.props.columns,
{ ...prevColumn, ...result },
];
}
@@ -327,11 +329,13 @@ export class DatabaseBlockDataSource extends DataSourceBase {
return;
}
this.doc.captureSync();
const index = this._model.columns.findIndex(v => v.id === id);
const index = this._model.props.columns.findIndex(v => v.id === id);
if (index < 0) return;
this.doc.transact(() => {
this._model.columns = this._model.columns.filter((_, i) => i !== index);
this._model.props.columns = this._model.props.columns.filter(
(_, i) => i !== index
);
});
}
@@ -345,7 +349,7 @@ export class DatabaseBlockDataSource extends DataSourceBase {
return;
}
const { id: copyId, ...nonIdProps } = currentSchema;
const names = new Set(this._model.columns$.value.map(v => v.name));
const names = new Set(this._model.props.columns$.value.map(v => v.name));
let index = 1;
while (names.has(`${nonIdProps.name}(${index})`)) {
index++;
@@ -476,7 +480,7 @@ export class DatabaseBlockDataSource extends DataSourceBase {
viewDataAdd(viewData: DataViewDataType): string {
this._model.doc.captureSync();
this._model.doc.transact(() => {
this._model.views = [...this._model.views, viewData];
this._model.props.views = [...this._model.props.views, viewData];
});
return viewData.id;
}
@@ -110,10 +110,14 @@ export class DatabaseBlockComponent extends CaptionedBlockComponent<DatabaseBloc
const options = this.optionsConfig.configure(this.model, {
items: [
menu.input({
initialValue: this.model.title.toString(),
initialValue: this.model.props.title.toString(),
placeholder: 'Untitled',
onChange: text => {
this.model.title.replace(0, this.model.title.length, text);
this.model.props.title.replace(
0,
this.model.props.title.length,
text
);
},
}),
menu.action({
@@ -162,7 +166,7 @@ export class DatabaseBlockComponent extends CaptionedBlockComponent<DatabaseBloc
const addRow = () => dataViewMethod.addRow?.('start');
return html` <affine-database-title
style="overflow: hidden"
.titleText="${this.model.title}"
.titleText="${this.model.props.title}"
.readonly="${this.dataSource.readonly$.value}"
.onPressEnterKey="${addRow}"
></affine-database-title>`;
@@ -68,7 +68,7 @@ export class NoteRenderer
);
collection.meta.setDocMeta(note.id, { title: rowContent });
if (note.root) {
(note.root as RootBlockModel).title.insert(rowContent ?? '', 0);
(note.root as RootBlockModel).props.title.insert(rowContent ?? '', 0);
note.root.children
.find(child => child.flavour === 'affine:note')
?.children.find(block =>
@@ -20,7 +20,7 @@ export function addProperty(
}
): string {
const id = column.id ?? model.doc.workspace.idGenerator();
if (model.columns.some(v => v.id === id)) {
if (model.props.columns.some(v => v.id === id)) {
return id;
}
model.doc.transact(() => {
@@ -28,8 +28,8 @@ export function addProperty(
...column,
id,
};
model.columns.splice(
insertPositionToIndex(position, model.columns),
model.props.columns.splice(
insertPositionToIndex(position, model.props.columns),
0,
col
);
@@ -43,10 +43,10 @@ export function copyCellsByProperty(
toId: Column['id']
) {
model.doc.transact(() => {
Object.keys(model.cells).forEach(rowId => {
const cell = model.cells[rowId]?.[fromId];
if (cell && model.cells[rowId]) {
model.cells[rowId][toId] = {
Object.keys(model.props.cells).forEach(rowId => {
const cell = model.props.cells[rowId]?.[fromId];
if (cell && model.props.cells[rowId]) {
model.props.cells[rowId][toId] = {
...cell,
columnId: toId,
};
@@ -59,18 +59,18 @@ export function deleteColumn(
model: DatabaseBlockModel,
columnId: Column['id']
) {
const index = model.columns.findIndex(v => v.id === columnId);
const index = model.props.columns.findIndex(v => v.id === columnId);
if (index < 0) return;
model.doc.transact(() => {
model.columns.splice(index, 1);
model.props.columns.splice(index, 1);
});
}
export function deleteRows(model: DatabaseBlockModel, rowIds: string[]) {
model.doc.transact(() => {
for (const rowId of rowIds) {
delete model.cells[rowId];
delete model.props.cells[rowId];
}
});
}
@@ -78,17 +78,17 @@ export function deleteRows(model: DatabaseBlockModel, rowIds: string[]) {
export function deleteView(model: DatabaseBlockModel, id: string) {
model.doc.captureSync();
model.doc.transact(() => {
model.views = model.views.filter(v => v.id !== id);
model.props.views = model.props.views.filter(v => v.id !== id);
});
}
export function duplicateView(model: DatabaseBlockModel, id: string): string {
const newId = model.doc.workspace.idGenerator();
model.doc.transact(() => {
const index = model.views.findIndex(v => v.id === id);
const view = model.views[index];
const index = model.props.views.findIndex(v => v.id === id);
const view = model.props.views[index];
if (view) {
model.views.splice(
model.props.views.splice(
index + 1,
0,
JSON.parse(JSON.stringify({ ...view, id: newId }))
@@ -109,7 +109,7 @@ export function getCell(
value: rowId,
};
}
const yRow = model.cells$.value[rowId];
const yRow = model.props.cells$.value[rowId];
const yCell = yRow?.[columnId] ?? null;
if (!yCell) return null;
@@ -123,7 +123,7 @@ export function getProperty(
model: DatabaseBlockModel,
id: Column['id']
): Column | undefined {
return model.columns.find(v => v.id === id);
return model.props.columns.find(v => v.id === id);
}
export function moveViewTo(
@@ -132,8 +132,8 @@ export function moveViewTo(
position: InsertToPosition
) {
model.doc.transact(() => {
model.views = arrayMove(
model.views,
model.props.views = arrayMove(
model.props.views,
v => v.id === id,
arr => insertPositionToIndex(position, arr)
);
@@ -163,11 +163,11 @@ export function updateCell(
console.error('Invalid columnId');
return;
}
if (!model.cells[rowId]) {
model.cells[rowId] = Object.create(null);
if (!model.props.cells[rowId]) {
model.props.cells[rowId] = Object.create(null);
}
if (model.cells[rowId]) {
model.cells[rowId][columnId] = {
if (model.props.cells[rowId]) {
model.props.cells[rowId][columnId] = {
columnId: columnId,
value: cell.value,
};
@@ -189,11 +189,11 @@ export function updateCells(
) {
throw new Error('Invalid rowId');
}
if (!model.cells[rowId]) {
model.cells[rowId] = Object.create(null);
if (!model.props.cells[rowId]) {
model.props.cells[rowId] = Object.create(null);
}
if (model.cells[rowId]) {
model.cells[rowId][columnId] = {
if (model.props.cells[rowId]) {
model.props.cells[rowId][columnId] = {
columnId,
value,
};
@@ -208,17 +208,17 @@ export function updateProperty(
updater: ColumnUpdater,
defaultValue?: Record<string, unknown>
) {
const index = model.columns.findIndex(v => v.id === id);
const index = model.props.columns.findIndex(v => v.id === id);
if (index == null) {
return;
}
model.doc.transact(() => {
const column = model.columns[index];
const column = model.props.columns[index];
if (!column) {
return;
}
const result = updater(column);
model.columns[index] = { ...defaultValue, ...column, ...result };
model.props.columns[index] = { ...defaultValue, ...column, ...result };
});
return id;
}
@@ -229,7 +229,7 @@ export const updateView = <ViewData extends ViewBasicDataType>(
update: (data: ViewData) => Partial<ViewData>
) => {
model.doc.transact(() => {
model.views = model.views.map(v => {
model.props.views = model.props.views.map(v => {
if (v.id !== id) {
return v;
}