From cfb24ade8f2bc303240814ee455dc7c45b65d465 Mon Sep 17 00:00:00 2001 From: leekelleher Date: Mon, 29 Apr 2024 18:35:45 +0100 Subject: [PATCH] Implements correct `sortOrder` property Removes the faux sort order value. --- .../document-collection.server.data-source.ts | 1 + .../packages/documents/documents/collection/types.ts | 1 + .../grid/document-grid-collection-view.element.ts | 12 +++++------- .../documents/documents/collection/views/index.ts | 4 ++-- .../table/document-table-collection-view.element.ts | 6 ++---- .../media-collection.server.data-source.ts | 1 + .../src/packages/media/media/collection/types.ts | 1 + .../table/media-table-collection-view.element.ts | 10 ++++------ .../property-editors/collection/manifests.ts | 2 +- 9 files changed, 18 insertions(+), 20 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/repository/document-collection.server.data-source.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/repository/document-collection.server.data-source.ts index c6899b78ed..6c726464d5 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/repository/document-collection.server.data-source.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/repository/document-collection.server.data-source.ts @@ -43,6 +43,7 @@ export class UmbDocumentCollectionServerDataSource implements UmbCollectionDataS creator: item.creator, icon: item.documentType.icon, name: variant.name, + sortOrder: item.sortOrder, state: variant.state, updateDate: new Date(variant.updateDate), updater: item.updater, diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/types.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/types.ts index 103dde6ac0..ffcbcb13d3 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/types.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/types.ts @@ -17,6 +17,7 @@ export interface UmbDocumentCollectionItemModel { creator?: string | null; icon: string; name: string; + sortOrder: number; state: string; updateDate: Date; updater?: string | null; diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/grid/document-grid-collection-view.element.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/grid/document-grid-collection-view.element.ts index ac83466e2f..8ec535ba7f 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/grid/document-grid-collection-view.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/grid/document-grid-collection-view.element.ts @@ -96,14 +96,13 @@ export class UmbDocumentGridCollectionViewElement extends UmbLitElement { ${repeat( this._items, (item) => item.unique, - (item, index) => this.#renderCard(index, item), + (item) => this.#renderCard(item), )} `; } - #renderCard(index: number, item: UmbDocumentCollectionItemModel) { - const sortOrder = this._skip + index; + #renderCard(item: UmbDocumentCollectionItemModel) { return html` this.#onSelect(item)} @deselected=${() => this.#onDeselect(item)}> - ${this.#renderState(item)} ${this.#renderProperties(sortOrder, item)} + ${this.#renderState(item)} ${this.#renderProperties(item)} `; } @@ -142,15 +141,14 @@ export class UmbDocumentGridCollectionViewElement extends UmbLitElement { } } - #renderProperties(sortOrder: number, item: UmbDocumentCollectionItemModel) { + #renderProperties(item: UmbDocumentCollectionItemModel) { if (!this._userDefinedProperties) return; return html` `; diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/index.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/index.ts index daed2df844..bad7d3c6de 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/index.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/index.ts @@ -3,7 +3,7 @@ import { fromCamelCase } from '@umbraco-cms/backoffice/utils'; export { UMB_DOCUMENT_GRID_COLLECTION_VIEW_ALIAS, UMB_DOCUMENT_TABLE_COLLECTION_VIEW_ALIAS } from './manifests.js'; -export function getPropertyValueByAlias(sortOrder: number, item: UmbDocumentCollectionItemModel, alias: string) { +export function getPropertyValueByAlias(item: UmbDocumentCollectionItemModel, alias: string) { switch (alias) { case 'contentTypeAlias': return item.contentTypeAlias; @@ -19,7 +19,7 @@ export function getPropertyValueByAlias(sortOrder: number, item: UmbDocumentColl case 'published': return item.state !== 'Draft' ? 'True' : 'False'; case 'sortOrder': - return sortOrder; + return item.sortOrder; case 'updateDate': return item.updateDate.toLocaleString(); case 'updater': diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/table/document-table-collection-view.element.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/table/document-table-collection-view.element.ts index c74937fa10..943588f16e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/table/document-table-collection-view.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/table/document-table-collection-view.element.ts @@ -126,16 +126,14 @@ export class UmbDocumentTableCollectionViewElement extends UmbLitElement { } #createTableItems(items: Array) { - this._tableItems = items.map((item, rowIndex) => { + this._tableItems = items.map((item) => { if (!item.unique) throw new Error('Item id is missing.'); - const sortOrder = this._skip + rowIndex; - const data = this._tableColumns?.map((column) => { return { columnAlias: column.alias, - value: column.elementName ? item : getPropertyValueByAlias(sortOrder, item, column.alias), + value: column.elementName ? item : getPropertyValueByAlias(item, column.alias), }; }) ?? []; diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/repository/media-collection.server.data-source.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/repository/media-collection.server.data-source.ts index d8a243868f..b75fadfff8 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/repository/media-collection.server.data-source.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/repository/media-collection.server.data-source.ts @@ -36,6 +36,7 @@ export class UmbMediaCollectionServerDataSource implements UmbCollectionDataSour creator: item.creator, icon: item.mediaType.icon, name: variant.name, + sortOrder: item.sortOrder, updateDate: new Date(variant.updateDate), values: item.values.map((item) => { return { alias: item.alias, value: item.value as string }; diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/types.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/types.ts index 9a5246af9f..1ae06b64f7 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/types.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/types.ts @@ -14,6 +14,7 @@ export interface UmbMediaCollectionItemModel { creator?: string | null; icon: string; name: string; + sortOrder: number; updateDate: Date; values: Array<{ alias: string; value: string }>; } diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/views/table/media-table-collection-view.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/views/table/media-table-collection-view.element.ts index bf64d7a0f2..044508a91e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/views/table/media-table-collection-view.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/views/table/media-table-collection-view.element.ts @@ -124,16 +124,14 @@ export class UmbMediaTableCollectionViewElement extends UmbLitElement { this.#createTableHeadings(); } - this._tableItems = items.map((item, rowIndex) => { + this._tableItems = items.map((item) => { if (!item.unique) throw new Error('Item id is missing.'); - const sortOrder = this._skip + rowIndex; - const data = this._tableColumns?.map((column) => { return { columnAlias: column.alias, - value: column.elementName ? item : this.#getPropertyValueByAlias(sortOrder, item, column.alias), + value: column.elementName ? item : this.#getPropertyValueByAlias(item, column.alias), }; }) ?? []; @@ -145,7 +143,7 @@ export class UmbMediaTableCollectionViewElement extends UmbLitElement { }); } - #getPropertyValueByAlias(sortOrder: number, item: UmbMediaCollectionItemModel, alias: string) { + #getPropertyValueByAlias(item: UmbMediaCollectionItemModel, alias: string) { switch (alias) { case 'createDate': return item.createDate.toLocaleString(); @@ -155,7 +153,7 @@ export class UmbMediaTableCollectionViewElement extends UmbLitElement { case 'owner': return item.creator; case 'sortOrder': - return sortOrder; + return item.sortOrder; case 'updateDate': return item.updateDate.toLocaleString(); default: diff --git a/src/Umbraco.Web.UI.Client/src/packages/property-editors/collection/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/property-editors/collection/manifests.ts index aa4f383b1c..c008f1a678 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/property-editors/collection/manifests.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/property-editors/collection/manifests.ts @@ -89,7 +89,7 @@ const propertyEditorUiManifest: ManifestPropertyEditorUi = { ], }, { alias: 'pageSize', value: 10 }, - { alias: 'orderBy', value: 'updateDate' }, + { alias: 'orderBy', value: 'sortOrder' }, { alias: 'orderDirection', value: 'desc' }, { alias: 'bulkActionPermissions',