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

utilize the selection manager directly in the collection context

Browse Source
This commit is contained in:
Mads Rasmussen
2023-11-21 14:21:50 +01:00
parent cfb8d028a9
commit e07b563b04
10 changed files with 43 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
src/Umbraco.Web.UI.Client/src/packages/core/collection/collection.context.ts
View File

@@ -25,9 +25,6 @@ export class UmbCollectionContext<
#totalItems = new UmbNumberState(0);
public readonly totalItems = this.#totalItems.asObservable();
#selectionManager = new UmbSelectionManager();
public readonly selection = this.#selectionManager.selection;
#filter = new UmbObjectState<FilterModelType | object>({});
public readonly filter = this.#filter.asObservable();
@@ -48,6 +45,7 @@ export class UmbCollectionContext<
});
public readonly pagination = new UmbPaginationManager();
public readonly selection = new UmbSelectionManager();
constructor(host: UmbControllerHostElement, config: UmbCollectionConfiguration = { pageSize: 50 }) {
super(host);
@@ -82,60 +80,6 @@ export class UmbCollectionContext<
return this.#alias;
}
/**
* Returns true if the given id is selected.
* @param {string} id
* @return {Boolean}
* @memberof UmbCollectionContext
*/
public isSelected(id: string) {
return this.#selectionManager.isSelected(id);
}
/**
* Sets the current selection.
* @param {Array<string>} selection
* @memberof UmbCollectionContext
*/
public setSelection(selection: Array<string>) {
this.#selectionManager.setSelection(selection);
}
/**
* Returns the current selection.
* @return {Array<string>}
* @memberof UmbCollectionContext
*/
public getSelection() {
this.#selectionManager.getSelection();
}
/**
* Clears the current selection.
* @memberof UmbCollectionContext
*/
public clearSelection() {
this.#selectionManager.clearSelection();
}
/**
* Appends the given id to the current selection.
* @param {string} id
* @memberof UmbCollectionContext
*/
public select(id: string) {
this.#selectionManager.select(id);
}
/**
* Removes the given id from the current selection.
* @param {string} id
* @memberof UmbCollectionContext
*/
public deselect(id: string) {
this.#selectionManager.deselect(id);
}
/**
* Requests the collection from the repository.
* @return {*}
@@ -185,7 +129,7 @@ export class UmbCollectionContext<
}
#configure(configuration: UmbCollectionConfiguration) {
this.#selectionManager.setMultiple(true);
this.selection.setMultiple(true);
this.pagination.setPageSize(configuration.pageSize);
this.#filter.next({ ...this.#filter.getValue(), skip: 0, take: configuration.pageSize });
}

6
src/Umbraco.Web.UI.Client/src/packages/core/collection/components/collection-selection-actions.element.ts
View File

@@ -34,7 +34,7 @@ export class UmbCollectionSelectionActionsElement extends UmbLitElement {
}
private _handleClearSelection() {
this._collectionContext?.clearSelection();
this._collectionContext?.selection.clearSelection();
}
private _observeCollectionContext() {
@@ -49,7 +49,7 @@ export class UmbCollectionSelectionActionsElement extends UmbLitElement {
);
this.observe(
this._collectionContext.selection,
this._collectionContext.selection.selection,
(selection) => {
this._selectionLength = selection.length;
this._selection = selection;
@@ -65,7 +65,7 @@ export class UmbCollectionSelectionActionsElement extends UmbLitElement {
#onActionExecuted(event: UmbActionExecutedEvent) {
event.stopPropagation();
this._collectionContext?.clearSelection();
this._collectionContext?.selection.clearSelection();
}
render() {

2
src/Umbraco.Web.UI.Client/src/packages/core/extension-registry/models/index.ts
View File

@@ -40,6 +40,8 @@ import type {
ManifestEntryPoint,
} from '@umbraco-cms/backoffice/extension-api';
export * from './collection.models.js';
export * from './collection-action.model.js';
export * from './collection-view.model.js';
export * from './dashboard-collection.model.js';
export * from './dashboard.model.js';

8
src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/table/document-table-collection-view.element.ts
View File

@@ -1,4 +1,4 @@
import { UmbTextStyles } from "@umbraco-cms/backoffice/style";
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit';
import {
@@ -68,7 +68,7 @@ export class UmbDocumentTableCollectionViewElement extends UmbLitElement {
this._createTableItems(this._items);
});
this.observe(this._collectionContext.selection, (selection) => {
this.observe(this._collectionContext.selection.selection, (selection) => {
this._selection = selection;
});
}
@@ -99,14 +99,14 @@ export class UmbDocumentTableCollectionViewElement extends UmbLitElement {
event.stopPropagation();
const table = event.target as UmbTableElement;
const selection = table.selection;
this._collectionContext?.setSelection(selection);
this._collectionContext?.selection.setSelection(selection);
}
private _handleDeselect(event: UmbTableDeselectedEvent) {
event.stopPropagation();
const table = event.target as UmbTableElement;
const selection = table.selection;
this._collectionContext?.setSelection(selection);
this._collectionContext?.selection.setSelection(selection);
}
private _handleOrdering(event: UmbTableOrderedEvent) {

10
src/Umbraco.Web.UI.Client/src/packages/media/media/collection-view/media-grid-collection-view.element.ts
View File

@@ -1,4 +1,4 @@
import { UmbTextStyles } from "@umbraco-cms/backoffice/style";
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
import { css, html, customElement, state, repeat } from '@umbraco-cms/backoffice/external/lit';
import { UmbCollectionContext, UMB_COLLECTION_CONTEXT } from '@umbraco-cms/backoffice/collection';
import { UmbLitElement } from '@umbraco-cms/internal/lit-element';
@@ -52,7 +52,7 @@ export class UmbMediaGridCollectionViewElement extends UmbLitElement {
this._mediaItems = [...mediaItems].sort((a, b) => (a.hasChildren === b.hasChildren ? 0 : a ? -1 : 1));
});
this.observe(this._collectionContext.selection, (selection) => {
this.observe(this._collectionContext.selection.selection, (selection) => {
this._selection = selection;
});
}
@@ -64,13 +64,13 @@ export class UmbMediaGridCollectionViewElement extends UmbLitElement {
private _handleSelect(mediaItem: EntityTreeItemResponseModel) {
if (mediaItem.id) {
this._collectionContext?.select(mediaItem.id);
this._collectionContext?.selection.select(mediaItem.id);
}
}
private _handleDeselect(mediaItem: EntityTreeItemResponseModel) {
if (mediaItem.id) {
this._collectionContext?.deselect(mediaItem.id);
this._collectionContext?.selection.deselect(mediaItem.id);
}
}
@@ -109,7 +109,7 @@ export class UmbMediaGridCollectionViewElement extends UmbLitElement {
? repeat(
this._mediaItems,
(file, index) => (file.id || '') + index,
(file) => this._renderMediaItem(file)
(file) => this._renderMediaItem(file),
)
: ''}
</div>

6
src/Umbraco.Web.UI.Client/src/packages/media/media/collection-view/media-table-collection-view.element.ts
View File

@@ -56,7 +56,7 @@ export class UmbMediaTableCollectionViewElement extends UmbLitElement {
this._createTableItems(this._mediaItems);
});
this.observe(this._collectionContext.selection, (selection) => {
this.observe(this._collectionContext.selection.selection, (selection) => {
this._selection = selection;
});
}
@@ -81,14 +81,14 @@ export class UmbMediaTableCollectionViewElement extends UmbLitElement {
event.stopPropagation();
const table = event.target as UmbTableElement;
const selection = table.selection;
this._collectionContext?.setSelection(selection);
this._collectionContext?.selection.setSelection(selection);
}
private _handleDeselect(event: UmbTableDeselectedEvent) {
event.stopPropagation();
const table = event.target as UmbTableElement;
const selection = table.selection;
this._collectionContext?.setSelection(selection);
this._collectionContext?.selection.setSelection(selection);
}
private _handleOrdering(event: UmbTableOrderedEvent) {

22
src/Umbraco.Web.UI.Client/src/packages/user/user-group/collection/views/user-group-collection-view.element.ts
View File

@@ -61,11 +61,19 @@ export class UmbUserGroupCollectionTableViewElement extends UmbLitElement {
this.consumeContext(UMB_COLLECTION_CONTEXT, (instance) => {
this.#collectionContext = instance;
this.observe(this.#collectionContext.selection, (selection) => (this._selection = selection), 'umbCollectionSelectionObserver');
this.observe(this.#collectionContext.items, (items) => {
this._userGroups = items;
this._createTableItems(items);
}, 'umbCollectionItemsObserver');
this.observe(
this.#collectionContext.selection.selection,
(selection) => (this._selection = selection),
'umbCollectionSelectionObserver',
);
this.observe(
this.#collectionContext.items,
(items) => {
this._userGroups = items;
this._createTableItems(items);
},
'umbCollectionItemsObserver',
);
});
}
@@ -102,14 +110,14 @@ export class UmbUserGroupCollectionTableViewElement extends UmbLitElement {
event.stopPropagation();
const table = event.target as UmbTableElement;
const selection = table.selection;
this.#collectionContext?.setSelection(selection);
this.#collectionContext?.selection.setSelection(selection);
}
private _handleDeselected(event: UmbTableDeselectedEvent) {
event.stopPropagation();
const table = event.target as UmbTableElement;
const selection = table.selection;
this.#collectionContext?.setSelection(selection);
this.#collectionContext?.selection.setSelection(selection);
}
render() {

2
src/Umbraco.Web.UI.Client/src/packages/user/user/collection/manifests.ts
View File

@@ -2,6 +2,7 @@ import { UMB_USER_COLLECTION_REPOSITORY_ALIAS } from './repository/index.js';
import { manifests as collectionRepositoryManifests } from './repository/manifests.js';
import { manifests as collectionViewManifests } from './views/manifests.js';
import { manifests as collectionActionManifests } from './action/manifests.js';
import { UmbUserCollectionContext } from './user-collection.context.js';
import { ManifestTypes } from '@umbraco-cms/backoffice/extension-registry';
export const UMB_USER_COLLECTION_ALIAS = 'Umb.Collection.User';
@@ -9,6 +10,7 @@ const collectionManifest: ManifestTypes = {
type: 'collection',
alias: UMB_USER_COLLECTION_ALIAS,
name: 'User Collection',
api: UmbUserCollectionContext,
meta: {
repositoryAlias: UMB_USER_COLLECTION_REPOSITORY_ALIAS,
},

8
src/Umbraco.Web.UI.Client/src/packages/user/user/collection/views/grid/user-grid-collection-view.element.ts
View File

@@ -29,7 +29,7 @@ export class UmbUserGridCollectionViewElement extends UmbLitElement {
this.consumeContext(UMB_COLLECTION_CONTEXT, (instance) => {
this.#collectionContext = instance as UmbUserCollectionContext;
this.observe(
this.#collectionContext.selection,
this.#collectionContext.selection.selection,
(selection) => (this._selection = selection),
'umbCollectionSelectionObserver',
);
@@ -54,11 +54,11 @@ export class UmbUserGridCollectionViewElement extends UmbLitElement {
}
#onSelect(user: UmbUserDetail) {
this.#collectionContext?.select(user.id ?? '');
this.#collectionContext?.selection.select(user.id ?? '');
}
#onDeselect(user: UmbUserDetail) {
this.#collectionContext?.deselect(user.id ?? '');
this.#collectionContext?.selection.deselect(user.id ?? '');
}
render() {
@@ -80,7 +80,7 @@ export class UmbUserGridCollectionViewElement extends UmbLitElement {
.name=${user.name ?? 'Unnamed user'}
selectable
?select-only=${this._selection.length > 0}
?selected=${this.#collectionContext?.isSelected(user.id ?? '')}
?selected=${this.#collectionContext?.selection.isSelected(user.id ?? '')}
@open=${() => this._handleOpenCard(user.id ?? '')}
@selected=${() => this.#onSelect(user)}
@deselected=${() => this.#onDeselect(user)}>

6
src/Umbraco.Web.UI.Client/src/packages/user/user/collection/views/table/user-table-collection-view.element.ts
View File

@@ -70,7 +70,7 @@ export class UmbUserTableCollectionViewElement extends UmbLitElement {
this.consumeContext(UMB_COLLECTION_CONTEXT, (instance) => {
this.#collectionContext = instance as UmbUserCollectionContext;
this.observe(
this.#collectionContext.selection,
this.#collectionContext.selection.selection,
(selection) => (this._selection = selection),
'umbCollectionSelectionObserver',
);
@@ -142,14 +142,14 @@ export class UmbUserTableCollectionViewElement extends UmbLitElement {
event.stopPropagation();
const table = event.target as UmbTableElement;
const selection = table.selection;
this.#collectionContext?.setSelection(selection);
this.#collectionContext?.selection.setSelection(selection);
}
#onDeselected(event: UmbTableDeselectedEvent) {
event.stopPropagation();
const table = event.target as UmbTableElement;
const selection = table.selection;
this.#collectionContext?.setSelection(selection);
this.#collectionContext?.selection.setSelection(selection);
}
#onOrdering(event: UmbTableOrderedEvent) {