yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update callbacks

Browse Source
This commit is contained in:
Mads Rasmussen
2023-11-23 20:54:32 +01:00
parent eea24b38d1
commit 15e10edd0a
5 changed files with 63 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
src/Umbraco.Web.UI.Client/src/packages/core/data-type/repository/detail/data-type-detail.server.data-source.ts
View File

@@ -1,4 +1,4 @@
import { UmbDataTypeDetailModel } from '../../types.js';
import { UmbDataTypeDetailModel, UmbDataTypePropertyModel } from '../../types.js';
import { UmbId } from '@umbraco-cms/backoffice/id';
import { UmbDetailDataSource } from '@umbraco-cms/backoffice/repository';
import {
@@ -49,7 +49,7 @@ export class UmbDataTypeServerDataSource implements UmbDetailDataSource<UmbDataT
/**
* Fetches a Data Type with the given id from the server
* @param {string} id
* @param {string} unique
* @return {*}
* @memberof UmbDataTypeServerDataSource
*/
@@ -58,19 +58,20 @@ export class UmbDataTypeServerDataSource implements UmbDetailDataSource<UmbDataT
const { data, error } = await tryExecuteAndNotify(this.#host, DataTypeResource.getDataTypeById({ id: unique }));
if (error) {
if (error || !data) {
return { error };
}
// map to client model
// TODO: investigate why all server fields are optional
const dataType = {
entityType: 'data-type',
unique: data.id,
parentUnique: data.parentId,
name: data.name,
propertyEditorAlias: data.propertyEditorAlias,
propertyEditorUiAlias: data.propertyEditorAlias,
values: data.values,
type: 'data-type',
unique: data.id!,
parentUnique: data.parentId!,
name: data.name!,
propertyEditorAlias: data.propertyEditorAlias!,
propertyEditorUiAlias: data.propertyEditorAlias!,
values: data.values as Array<UmbDataTypePropertyModel>,
};
return { data: dataType };
@@ -84,7 +85,7 @@ export class UmbDataTypeServerDataSource implements UmbDetailDataSource<UmbDataT
*/
async create(dataType: UmbDataTypeDetailModel) {
if (!dataType) throw new Error('Data Type is missing');
if (!dataType.unique) throw new Error('Data Type id is missing');
if (!dataType.unique) throw new Error('Data Type unique is missing');
// map to server model
const requestBody: CreateDataTypeRequestModel = {
@@ -107,7 +108,7 @@ export class UmbDataTypeServerDataSource implements UmbDetailDataSource<UmbDataT
return { error: createError };
}
// we have to fetch the data type again. The server can have modified the data after creation
// We have to fetch the data type again. The server can have modified the data after creation
return this.read(dataType.unique);
}
@@ -127,13 +128,20 @@ export class UmbDataTypeServerDataSource implements UmbDetailDataSource<UmbDataT
values: data.values,
};
return tryExecuteAndNotify(
const { error } = await tryExecuteAndNotify(
this.#host,
DataTypeResource.putDataTypeById({
id: data.unique,
requestBody,
}),
);
if (error) {
return { error };
}
// We have to fetch the data type again. The server can have modified the data after update
return this.read(data.unique);
}
/**

7
src/Umbraco.Web.UI.Client/src/packages/core/data-type/tree/data-type.tree.store.ts
View File

@@ -20,6 +20,7 @@ export class UmbDataTypeTreeStore extends UmbUniqueTreeStore {
*/
constructor(host: UmbControllerHost) {
super(host, UMB_DATA_TYPE_TREE_STORE_CONTEXT.toString());
new UmbStoreConnector<UmbDataTypeTreeItemModel, UmbDataTypeDetailModel>(
host,
this,
@@ -30,7 +31,6 @@ export class UmbDataTypeTreeStore extends UmbUniqueTreeStore {
}
#createTreeItemMapper = (item: UmbDataTypeDetailModel) => {
console.log('create tree item for', item);
return {
unique: item.unique!,
parentUnique: item.parentUnique,
@@ -43,8 +43,9 @@ export class UmbDataTypeTreeStore extends UmbUniqueTreeStore {
};
#updateTreeItemMapper = (item: UmbDataTypeDetailModel) => {
console.log('update tree item for', item);
return item;
return {
name: item.name,
};
};
}

17
src/Umbraco.Web.UI.Client/src/packages/core/data-type/types.ts
View File

@@ -1,7 +1,14 @@
import { DataTypeResponseModel } from '@umbraco-cms/backoffice/backend-api';
export type UmbDataTypeDetailModel = Omit<DataTypeResponseModel, 'id' | 'parentId'> & {
export type UmbDataTypeDetailModel = {
type: string;
unique: string | undefined; // TODO - remove this when server doesn't allow undefined
parentUnique: string | null | undefined; // TODO - remove this when server doesn't allow undefined
unique: string;
parentUnique: string | null;
name: string;
propertyEditorAlias: string | undefined;
propertyEditorUiAlias: string | null;
values: Array<UmbDataTypePropertyModel>;
};
export interface UmbDataTypePropertyModel {
alias: string;
value: any;
}

4
src/Umbraco.Web.UI.Client/src/packages/core/store/store-base.ts
View File

@@ -87,6 +87,10 @@ export class UmbStoreBase<StoreItemType = any> extends EventTarget implements Um
return this._data.getValue().filter((item) => uniques.includes(this._data.getUnique(item)));
}
getAll() {
return this._data.getValue();
}
/**
* Returns an observable of the entire store
* @memberof UmbStoreBase

44
src/Umbraco.Web.UI.Client/src/packages/core/store/store-connector.ts
View File

@@ -5,21 +5,21 @@ import { UmbContextConsumerController, UmbContextToken } from '@umbraco-cms/back
import { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
export class UmbStoreConnector<StoreType, ConnectedStoreType> {
#store: UmbStoreBase;
#store: UmbStore<StoreType>;
#connectedStore?: UmbStore<ConnectedStoreType>;
#createMapperFunction: (item: ConnectedStoreType) => StoreType;
#updateMapperFunction?: (item: ConnectedStoreType) => StoreType;
#onNewStoreItem: (item: ConnectedStoreType) => StoreType;
#onUpdateStoreItem: (item: ConnectedStoreType) => StoreType;
constructor(
host: UmbControllerHost,
store: UmbStoreBase,
connectToStoreAlias: UmbContextToken<any, any> | string,
createMapperFunction: (item: ConnectedStoreType) => StoreType,
updateMapperFunction: (item: ConnectedStoreType) => StoreType,
onNewStoreItem: (item: ConnectedStoreType) => StoreType,
onUpdateStoreItem: (item: ConnectedStoreType) => Partial<StoreType>,
) {
this.#store = store;
this.#createMapperFunction = createMapperFunction;
this.#updateMapperFunction = updateMapperFunction;
this.#onNewStoreItem = onNewStoreItem;
this.#onUpdateStoreItem = onUpdateStoreItem;
new UmbContextConsumerController(host, connectToStoreAlias, (instance) => {
this.#connectedStore = instance;
@@ -32,25 +32,25 @@ export class UmbStoreConnector<StoreType, ConnectedStoreType> {
#listenToConnectedStore = () => {
if (!this.#connectedStore) return;
this.#connectedStore.addEventListener(UmbStoreCreateEvent.TYPE, this.#onConnectedStoreCreate as EventListener);
this.#connectedStore.addEventListener(UmbStoreUpdateEvent.TYPE, this.#onConnectedStoreUpdate as EventListener);
this.#connectedStore.addEventListener(UmbStoreDeleteEvent.TYPE, this.#onConnectedStoreDelete as EventListener);
this.#connectedStore.addEventListener(UmbStoreCreateEvent.TYPE, this.#updateStoreItems as EventListener);
this.#connectedStore.addEventListener(UmbStoreUpdateEvent.TYPE, this.#updateStoreItems as EventListener);
this.#connectedStore.addEventListener(UmbStoreDeleteEvent.TYPE, this.#removeStoreItems as EventListener);
};
#onConnectedStoreCreate = (event: UmbStoreCreateEvent) => {
const items = this.#connectedStore!.getItems(event.uniques);
const mappedItems = items.map((item) => this.#createMapperFunction(item));
this.#store.appendItems(mappedItems);
#updateStoreItems = (event: UmbStoreCreateEvent | UmbStoreUpdateEvent) => {
event.uniques.forEach((unique) => {
const storeHasItem = this.#store.getItems([unique]).length > 0;
const connectedStoreItem = this.#connectedStore!.getItems([unique])[0];
if (storeHasItem) {
this.#store.updateItem(unique, this.#onUpdateStoreItem(connectedStoreItem!));
} else {
this.#store.append(this.#onNewStoreItem(connectedStoreItem!));
}
});
};
#onConnectedStoreUpdate = (event: UmbStoreUpdateEvent) => {
const uniques = event.uniques;
const items = this.#connectedStore!.getItems(uniques);
const mappedItems = items.map((item) => this.#updateMapperFunction(item));
mappedItems.forEach((mappedItem, index) => this.#store.updateItem(uniques[index], mappedItem));
};
#onConnectedStoreDelete = (event: UmbStoreDeleteEvent) => {
#removeStoreItems = (event: UmbStoreDeleteEvent) => {
this.#store.removeItems(event.uniques);
};
}