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

Merge branch 'feature-connected-stores' into feature-detail-repository-base

Browse Source
This commit is contained in:
Mads Rasmussen
2023-11-27 11:15:21 +01:00
parent 6d05fe4ef4 5cb1472d0b
commit a42fe46473
13 changed files with 52 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/Umbraco.Web.UI.Client/examples/workspace-context-counter/counter-workspace-view.ts
View File

@@ -9,7 +9,7 @@ export class ExampleCounterWorkspaceView extends UmbElementMixin(LitElement) {
#counterContext?: typeof EXAMPLE_COUNTER_CONTEXT.TYPE;
@state()
private count = '';
private count = 0;
constructor() {
super();
@@ -30,12 +30,8 @@ export class ExampleCounterWorkspaceView extends UmbElementMixin(LitElement) {
return html`
<uui-box class="uui-text">
<h1 class="uui-h2" style="margin-top: var(--uui-size-layout-1);">Counter Example</h1>
<p class="uui-lead">
Current count value: ${this.count}
</p>
<p>
This is a Workspace View, that consumes the Counter Context, and displays the current count.
</p>
<p class="uui-lead">Current count value: ${this.count}</p>
<p>This is a Workspace View, that consumes the Counter Context, and displays the current count.</p>
</uui-box>
`;
}

2
src/Umbraco.Web.UI.Client/src/libs/observable-api/array-state.ts
View File

@@ -12,7 +12,7 @@ import { pushToUniqueArray } from './push-to-unique-array.function.js';
* The ArrayState provides methods to append data when the data is an Object.
*/
export class UmbArrayState<T> extends UmbDeepState<T[]> {
getUnique: (entry: T) => unknown;
readonly getUnique: (entry: T) => unknown;
#sortMethod?: (a: T, b: T) => number;
constructor(initialData: T[], getUniqueMethod: (entry: T) => unknown) {

6
src/Umbraco.Web.UI.Client/src/packages/core/data-type/repository/folder/data-type-folder.repository.ts
View File

@@ -37,7 +37,7 @@ export class UmbDataTypeFolderRepository extends UmbRepositoryBase implements Um
}
// TODO: temp create type until backend is ready. Remove the id addition when new types are generated.
async createFolder(folderRequest: CreateFolderRequestModel & { id?: string | undefined }) {
async createFolder(folderRequest: CreateFolderRequestModel) {
if (!folderRequest) throw new Error('folder request is missing');
await this.#init;
@@ -46,7 +46,7 @@ export class UmbDataTypeFolderRepository extends UmbRepositoryBase implements Um
if (!error) {
// TODO: We need to push a new item to the tree store to update the tree. How do we want to create the tree items?
const folderTreeItem = createFolderTreeItem(folderRequest);
this.#treeStore!.appendItems([folderTreeItem]);
this.#treeStore!.append(folderTreeItem);
}
return { error };
@@ -73,6 +73,8 @@ export class UmbDataTypeFolderRepository extends UmbRepositoryBase implements Um
const { error } = await this.#folderSource.update(id, folder);
if (!error) {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
this.#treeStore!.updateItem(id, { name: folder.name });
}

28
src/Umbraco.Web.UI.Client/src/packages/core/data-type/repository/utils.ts
View File

@@ -1,30 +1,16 @@
import {
CreateDataTypeRequestModel,
CreateFolderRequestModel,
FolderTreeItemResponseModel,
} from '@umbraco-cms/backoffice/backend-api';
import { CreateFolderRequestModel } from '@umbraco-cms/backoffice/backend-api';
export const createTreeItem = (item: CreateDataTypeRequestModel): FolderTreeItemResponseModel => {
export const createFolderTreeItem = (item: CreateFolderRequestModel) => {
if (!item) throw new Error('item is null or undefined');
if (!item.id) throw new Error('item.id is null or undefined');
return {
type: 'data-type',
parentId: item.parentId,
name: item.name,
id: item.id,
isFolder: false,
unique: item.id!,
parentUnique: item.parentId!,
name: item.name!,
type: 'data-type-folder',
isFolder: true,
isContainer: false,
hasChildren: false,
};
};
export const createFolderTreeItem = (item: CreateFolderRequestModel): FolderTreeItemResponseModel => {
if (!item) throw new Error('item is null or undefined');
if (!item.id) throw new Error('item.id is null or undefined');
return {
...createTreeItem(item),
isFolder: true,
};
};

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

@@ -30,6 +30,7 @@ export class UmbDataTypeTreeStore extends UmbUniqueTreeStore {
);
}
// TODO: revisit this when we have decided on detail model sizes
#createTreeItemMapper = (item: UmbDataTypeDetailModel) => {
return {
unique: item.unique!,
@@ -42,6 +43,7 @@ export class UmbDataTypeTreeStore extends UmbUniqueTreeStore {
};
};
// TODO: revisit this when we have decided on detail model sizes
#updateTreeItemMapper = (item: UmbDataTypeDetailModel) => {
return {
name: item.name,

4
src/Umbraco.Web.UI.Client/src/packages/core/store/events/index.ts
View File

@@ -1,4 +1,4 @@
export * from './store-create.event.js';
export * from './store-append.event.js';
export * from './store.event.js';
export * from './store-delete.event.js';
export * from './store-remove.event.js';
export * from './store-update.event.js';

9
src/Umbraco.Web.UI.Client/src/packages/core/store/events/store-append.event.ts Normal file
View File

@@ -0,0 +1,9 @@
import { UmbStoreEvent } from './store.event.js';
export class UmbStoreAppendEvent extends UmbStoreEvent {
static readonly TYPE = 'append';
public constructor(uniques: Array<string>) {
super(UmbStoreAppendEvent.TYPE, uniques);
}
}

9
src/Umbraco.Web.UI.Client/src/packages/core/store/events/store-create.event.ts
View File

@@ -1,9 +0,0 @@
import { UmbStoreEvent } from './store.event.js';
export class UmbStoreCreateEvent extends UmbStoreEvent {
static readonly TYPE = 'create';
public constructor(uniques: Array<string>) {
super(UmbStoreCreateEvent.TYPE, uniques);
}
}

9
src/Umbraco.Web.UI.Client/src/packages/core/store/events/store-delete.event.ts
View File

@@ -1,9 +0,0 @@
import { UmbStoreEvent } from './store.event.js';
export class UmbStoreDeleteEvent extends UmbStoreEvent {
static readonly TYPE = 'delete';
public constructor(uniques: Array<string>) {
super(UmbStoreDeleteEvent.TYPE, uniques);
}
}

9
src/Umbraco.Web.UI.Client/src/packages/core/store/events/store-remove.event.ts Normal file
View File

@@ -0,0 +1,9 @@
import { UmbStoreEvent } from './store.event.js';
export class UmbStoreRemoveEvent extends UmbStoreEvent {
static readonly TYPE = 'remove';
public constructor(uniques: Array<string>) {
super(UmbStoreRemoveEvent.TYPE, uniques);
}
}

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

@@ -1,7 +1,7 @@
import { UmbStore } from './store.interface.js';
import { UmbStoreDeleteEvent } from './events/store-delete.event.js';
import { UmbStoreRemoveEvent } from './events/store-remove.event.js';
import { UmbStoreUpdateEvent } from './events/store-update.event.js';
import { UmbStoreCreateEvent } from './events/store-create.event.js';
import { UmbStoreAppendEvent } from './events/store-append.event.js';
import { UmbContextProviderController } from '@umbraco-cms/backoffice/context-api';
import { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
import { type UmbApi } from '@umbraco-cms/backoffice/extension-api';
@@ -32,7 +32,7 @@ export class UmbStoreBase<StoreItemType = any> extends EventTarget implements Um
append(item: StoreItemType) {
this._data.append([item]);
const unique = this._data.getUnique(item) as string;
this.dispatchEvent(new UmbStoreCreateEvent([unique]));
this.dispatchEvent(new UmbStoreAppendEvent([unique]));
}
/**
@@ -43,7 +43,7 @@ export class UmbStoreBase<StoreItemType = any> extends EventTarget implements Um
appendItems(items: Array<StoreItemType>) {
this._data.append(items);
const uniques = items.map((item) => this._data.getUnique(item)) as Array<string>;
this.dispatchEvent(new UmbStoreCreateEvent(uniques));
this.dispatchEvent(new UmbStoreAppendEvent(uniques));
}
/**
@@ -64,7 +64,7 @@ export class UmbStoreBase<StoreItemType = any> extends EventTarget implements Um
*/
removeItem(unique: string) {
this._data.removeOne(unique);
this.dispatchEvent(new UmbStoreDeleteEvent([unique]));
this.dispatchEvent(new UmbStoreRemoveEvent([unique]));
}
/**
@@ -74,7 +74,7 @@ export class UmbStoreBase<StoreItemType = any> extends EventTarget implements Um
*/
removeItems(uniques: Array<string>) {
this._data.remove(uniques);
this.dispatchEvent(new UmbStoreDeleteEvent(uniques));
this.dispatchEvent(new UmbStoreRemoveEvent(uniques));
}
/**
@@ -84,11 +84,7 @@ export class UmbStoreBase<StoreItemType = any> extends EventTarget implements Um
* @memberof UmbStoreBase
*/
getItems(uniques: Array<string>) {
return this._data.getValue().filter((item) => uniques.includes(this._data.getUnique(item)));
}
getAll() {
return this._data.getValue();
return this._data.getValue().filter((item) => uniques.includes(this._data.getUnique(item) as string));
}
/**

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

@@ -1,5 +1,5 @@
import { UmbStoreBase } from './store-base.js';
import { UmbStoreCreateEvent, UmbStoreDeleteEvent, UmbStoreUpdateEvent } from './events/index.js';
import { UmbStoreAppendEvent, UmbStoreRemoveEvent, UmbStoreUpdateEvent } from './events/index.js';
import { UmbStore } from './store.interface.js';
import { UmbContextConsumerController, UmbContextToken } from '@umbraco-cms/backoffice/context-api';
import { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
@@ -9,7 +9,7 @@ export class UmbStoreConnector<StoreType, ConnectedStoreType> {
#store: UmbStore<StoreType>;
#connectedStore?: UmbStore<ConnectedStoreType>;
#onNewStoreItem: (item: ConnectedStoreType) => StoreType;
#onUpdateStoreItem: (item: ConnectedStoreType) => StoreType;
#onUpdateStoreItem: (item: ConnectedStoreType) => Partial<StoreType>;
constructor(
host: UmbControllerHost,
@@ -22,6 +22,8 @@ export class UmbStoreConnector<StoreType, ConnectedStoreType> {
this.#onNewStoreItem = onNewStoreItem;
this.#onUpdateStoreItem = onUpdateStoreItem;
console.warn('UmbStoreConnector is a work in progress and should not be used yet');
new UmbContextConsumerController(host, connectToStoreAlias, (instance) => {
this.#connectedStore = instance;
@@ -33,12 +35,12 @@ export class UmbStoreConnector<StoreType, ConnectedStoreType> {
#listenToConnectedStore = () => {
if (!this.#connectedStore) return;
this.#connectedStore.addEventListener(UmbStoreCreateEvent.TYPE, this.#updateStoreItems as EventListener);
this.#connectedStore.addEventListener(UmbStoreAppendEvent.TYPE, this.#updateStoreItems as EventListener);
this.#connectedStore.addEventListener(UmbStoreUpdateEvent.TYPE, this.#updateStoreItems as EventListener);
this.#connectedStore.addEventListener(UmbStoreDeleteEvent.TYPE, this.#removeStoreItems as EventListener);
this.#connectedStore.addEventListener(UmbStoreRemoveEvent.TYPE, this.#removeStoreItems as EventListener);
};
#updateStoreItems = (event: UmbStoreCreateEvent | UmbStoreUpdateEvent) => {
#updateStoreItems = (event: UmbStoreAppendEvent | UmbStoreUpdateEvent) => {
event.uniques.forEach((unique) => {
const storeHasItem = this.#store.getItems([unique]).length > 0;
const connectedStoreItem = this.#connectedStore!.getItems([unique])[0];
@@ -52,7 +54,7 @@ export class UmbStoreConnector<StoreType, ConnectedStoreType> {
});
};
#removeStoreItems = (event: UmbStoreDeleteEvent) => {
#removeStoreItems = (event: UmbStoreRemoveEvent) => {
this.#store.removeItems(event.uniques);
};
}

1
src/Umbraco.Web.UI.Client/src/packages/core/store/store.interface.ts
View File

@@ -8,5 +8,4 @@ export interface UmbStore<T> extends EventTarget {
removeItems: (uniques: Array<string>) => void;
getItems: (uniques: Array<string>) => Array<T>;
all: () => Observable<Array<T>>;
getAll: () => Array<T>;
}