From 7392762d8f1795dd94e05434afe96ba9c0472fbb Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 6 Mar 2024 10:57:25 +0100 Subject: [PATCH 01/22] create a new function to enable to assign to a frozen object --- .../observable-api/utils/assign-to-frozen-object.function.ts | 3 +++ .../src/libs/observable-api/utils/index.ts | 1 + 2 files changed, 4 insertions(+) create mode 100644 src/Umbraco.Web.UI.Client/src/libs/observable-api/utils/assign-to-frozen-object.function.ts diff --git a/src/Umbraco.Web.UI.Client/src/libs/observable-api/utils/assign-to-frozen-object.function.ts b/src/Umbraco.Web.UI.Client/src/libs/observable-api/utils/assign-to-frozen-object.function.ts new file mode 100644 index 0000000000..f0f2665bbb --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/libs/observable-api/utils/assign-to-frozen-object.function.ts @@ -0,0 +1,3 @@ +export function assignToFrozenObject(target: T, source: Partial): T { + return Object.assign(Object.create(Object.getPrototypeOf(target)), target, source); +} diff --git a/src/Umbraco.Web.UI.Client/src/libs/observable-api/utils/index.ts b/src/Umbraco.Web.UI.Client/src/libs/observable-api/utils/index.ts index 0c77207194..f207030636 100644 --- a/src/Umbraco.Web.UI.Client/src/libs/observable-api/utils/index.ts +++ b/src/Umbraco.Web.UI.Client/src/libs/observable-api/utils/index.ts @@ -1,4 +1,5 @@ export * from './append-to-frozen-array.function.js'; +export * from './assign-to-frozen-object.function.js'; export * from './create-observable-part.function.js'; export * from './deep-freeze.function.js'; export * from './default-memoization.function.js'; From 6914a7c938d74de726c1ebf9ec4bbe6304c96cdc Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 6 Mar 2024 10:57:52 +0100 Subject: [PATCH 02/22] organize imports and ensure the image cropper can assign to a frozen object --- .../input-image-cropper.element.ts | 27 +++++++++++++------ 1 file changed, 19 insertions(+), 8 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-image-cropper/input-image-cropper.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-image-cropper/input-image-cropper.element.ts index f4bc06e0a8..f87d1663d4 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-image-cropper/input-image-cropper.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-image-cropper/input-image-cropper.element.ts @@ -1,14 +1,17 @@ import type { UmbImageCropperPropertyEditorValue } from './types.js'; +import type { UmbInputImageCropperFieldElement } from './image-cropper-field.element.js'; import { html, customElement, property, query, state } from '@umbraco-cms/backoffice/external/lit'; -import './image-cropper.element.js'; -import './image-cropper-focus-setter.element.js'; -import './image-cropper-preview.element.js'; -import './image-cropper-field.element.js'; import type { UUIFileDropzoneElement, UUIFileDropzoneEvent } from '@umbraco-cms/backoffice/external/uui'; import { UmbId } from '@umbraco-cms/backoffice/id'; import { UmbChangeEvent } from '@umbraco-cms/backoffice/event'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; import { type TemporaryFileQueueItem, UmbTemporaryFileManager } from '@umbraco-cms/backoffice/temporary-file'; +import { assignToFrozenObject } from '@umbraco-cms/backoffice/observable-api'; + +import './image-cropper.element.js'; +import './image-cropper-focus-setter.element.js'; +import './image-cropper-preview.element.js'; +import './image-cropper-field.element.js'; @customElement('umb-input-image-cropper') export class UmbInputImageCropperElement extends UmbLitElement { @@ -53,7 +56,8 @@ export class UmbInputImageCropperElement extends UmbLitElement { this.file = file; this.fileUnique = unique; - this.value.src = unique; + + assignToFrozenObject(this.value, { src: unique }); this.#manager?.uploadOne(unique, file, 'waiting'); @@ -66,7 +70,7 @@ export class UmbInputImageCropperElement extends UmbLitElement { } #onRemove = () => { - this.value = { ...this.value, src: '' }; + assignToFrozenObject(this.value, { src: '' }); if (!this.fileUnique) return; this.#manager?.removeOne(this.fileUnique); this.fileUnique = undefined; @@ -91,9 +95,16 @@ export class UmbInputImageCropperElement extends UmbLitElement { `; } - #onChange(e: any) { - this.value = e.target.value; + #onChange(e: CustomEvent) { + const value = (e.target as UmbInputImageCropperFieldElement).value; + if (!value) { + this.value = { src: '', crops: [], focalPoint: { left: 0.5, top: 0.5 } }; + this.dispatchEvent(new UmbChangeEvent()); + return; + } + + this.value = value; this.dispatchEvent(new UmbChangeEvent()); } From 5f2a096198069db4b4b6c3f060828f5d17d42744 Mon Sep 17 00:00:00 2001 From: JesmoDev Date: Wed, 6 Mar 2024 14:45:51 +0100 Subject: [PATCH 03/22] fix picker --- .../input-media/input-media.context.ts | 3 +- .../input-media/input-media.element.ts | 2 +- ...property-editor-ui-media-picker.element.ts | 34 ++++++++++++++----- 3 files changed, 29 insertions(+), 10 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-media/input-media.context.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-media/input-media.context.ts index 44e59a35cf..4d8ba6ece6 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-media/input-media.context.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-media/input-media.context.ts @@ -1,4 +1,5 @@ import type { UmbMediaItemModel } from '../../repository/item/types.js'; +import { UMB_MEDIA_ITEM_REPOSITORY_ALIAS } from '../../repository/index.js'; import { UmbPickerInputContext } from '@umbraco-cms/backoffice/picker-input'; import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api'; import { UMB_MEDIA_TREE_PICKER_MODAL } from '@umbraco-cms/backoffice/modal'; @@ -7,6 +8,6 @@ export class UmbMediaPickerContext extends UmbPickerInputContext = { getUniqueOfElement: (element) => { diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts index 2443efbfa6..26d22b9a6e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts @@ -1,10 +1,8 @@ import type { UmbInputMediaElement } from '../../components/input-media/input-media.element.js'; import '../../components/input-media/input-media.element.js'; +import type { PropertyValueMap } from '@umbraco-cms/backoffice/external/lit'; import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; -import { - UmbPropertyValueChangeEvent, - type UmbPropertyEditorConfigCollection, -} from '@umbraco-cms/backoffice/property-editor'; +import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; import type { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; @@ -14,7 +12,7 @@ import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; @customElement('umb-property-editor-ui-media-picker') export class UmbPropertyEditorUIMediaPickerElement extends UmbLitElement implements UmbPropertyEditorUiElement { @property() - public value?: string; + public value: string = ''; @property({ attribute: false }) public set config(config: UmbPropertyEditorConfigCollection | undefined) { @@ -30,21 +28,41 @@ export class UmbPropertyEditorUIMediaPickerElement extends UmbLitElement impleme return undefined; } + @state() + _items: Array = []; + @state() private _limitMin: number = 0; @state() private _limitMax: number = Infinity; + protected updated(_changedProperties: PropertyValueMap | Map): void { + super.updated(_changedProperties); + if (_changedProperties.has('value')) { + if (typeof this.value !== 'string') { + //TODO: Temp fix for when the value is an array, this should be fixed elsewhere. + this.value = ''; + } + this._items = this.value ? this.value.split(',') : []; + } + } + private _onChange(event: CustomEvent) { - this.value = (event.target as UmbInputMediaElement).selectedIds.join(','); - this.dispatchEvent(new UmbPropertyValueChangeEvent()); + const selectedIds = (event.target as UmbInputMediaElement).selectedIds; + //TODO: This is a hack, something changed so now we need to convert the array to a comma separated string to make it work with the server. + const toCommaSeparatedString = selectedIds.join(','); + // this.value = (event.target as UmbInputMediaElement).selectedIds; + + this.value = toCommaSeparatedString; + console.log('property-value-change', this.value); + this.dispatchEvent(new CustomEvent('property-value-change')); } render() { return html` Add From 62ccab0309af138acc32458e9d5719175d93fbb0 Mon Sep 17 00:00:00 2001 From: JesmoDev Date: Wed, 6 Mar 2024 18:12:56 +0100 Subject: [PATCH 04/22] use correct value model --- ...property-editor-ui-media-picker.element.ts | 25 ++++++++++--------- 1 file changed, 13 insertions(+), 12 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts index 26d22b9a6e..4edb989e9f 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts @@ -5,14 +5,15 @@ import { html, customElement, property, state } from '@umbraco-cms/backoffice/ex import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; import type { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; +import { UmbId } from '@umbraco-cms/backoffice/id'; /** * @element umb-property-editor-ui-media-picker */ @customElement('umb-property-editor-ui-media-picker') export class UmbPropertyEditorUIMediaPickerElement extends UmbLitElement implements UmbPropertyEditorUiElement { - @property() - public value: string = ''; + @property({ attribute: false }) + public value: Array<{ key: string; mediaKey: string; mediaTypeAlias: string }> = []; @property({ attribute: false }) public set config(config: UmbPropertyEditorConfigCollection | undefined) { @@ -39,22 +40,22 @@ export class UmbPropertyEditorUIMediaPickerElement extends UmbLitElement impleme protected updated(_changedProperties: PropertyValueMap | Map): void { super.updated(_changedProperties); if (_changedProperties.has('value')) { - if (typeof this.value !== 'string') { - //TODO: Temp fix for when the value is an array, this should be fixed elsewhere. - this.value = ''; - } - this._items = this.value ? this.value.split(',') : []; + this._items = this.value ? this.value.map((x) => x.mediaKey) : []; } } private _onChange(event: CustomEvent) { const selectedIds = (event.target as UmbInputMediaElement).selectedIds; - //TODO: This is a hack, something changed so now we need to convert the array to a comma separated string to make it work with the server. - const toCommaSeparatedString = selectedIds.join(','); - // this.value = (event.target as UmbInputMediaElement).selectedIds; - this.value = toCommaSeparatedString; - console.log('property-value-change', this.value); + const result = selectedIds.map((mediaKey) => { + return { + key: UmbId.new(), + mediaKey, + mediaTypeAlias: 'Image', + }; + }); + + this.value = result; this.dispatchEvent(new CustomEvent('property-value-change')); } From a7bcc7949edcd7a679844441f7ed407b35486c80 Mon Sep 17 00:00:00 2001 From: JesmoDev Date: Wed, 6 Mar 2024 18:38:43 +0100 Subject: [PATCH 05/22] you can now remove media items --- .../property-editor-ui-media-picker.element.ts | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts index 4edb989e9f..1636c5fe24 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts @@ -14,6 +14,8 @@ import { UmbId } from '@umbraco-cms/backoffice/id'; export class UmbPropertyEditorUIMediaPickerElement extends UmbLitElement implements UmbPropertyEditorUiElement { @property({ attribute: false }) public value: Array<{ key: string; mediaKey: string; mediaTypeAlias: string }> = []; + //TODO: Add support for document specific crops. The server side already supports this. + //TODO: Add crops and focalpoint to value. @property({ attribute: false }) public set config(config: UmbPropertyEditorConfigCollection | undefined) { @@ -37,11 +39,10 @@ export class UmbPropertyEditorUIMediaPickerElement extends UmbLitElement impleme @state() private _limitMax: number = Infinity; - protected updated(_changedProperties: PropertyValueMap | Map): void { - super.updated(_changedProperties); - if (_changedProperties.has('value')) { - this._items = this.value ? this.value.map((x) => x.mediaKey) : []; - } + protected firstUpdated(_changedProperties: PropertyValueMap | Map): void { + super.firstUpdated(_changedProperties); + + this._items = this.value ? this.value.map((x) => x.mediaKey) : []; } private _onChange(event: CustomEvent) { @@ -56,6 +57,7 @@ export class UmbPropertyEditorUIMediaPickerElement extends UmbLitElement impleme }); this.value = result; + this._items = this.value ? this.value.map((x) => x.mediaKey) : []; this.dispatchEvent(new CustomEvent('property-value-change')); } From e3c1cf163c88f36ac726451248a04ddb0b7b14b0 Mon Sep 17 00:00:00 2001 From: JesmoDev Date: Thu, 7 Mar 2024 14:48:42 +0100 Subject: [PATCH 06/22] set value --- .../input-image-cropper/input-image-cropper.element.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-image-cropper/input-image-cropper.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-image-cropper/input-image-cropper.element.ts index f87d1663d4..1172d1863e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-image-cropper/input-image-cropper.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-image-cropper/input-image-cropper.element.ts @@ -57,7 +57,7 @@ export class UmbInputImageCropperElement extends UmbLitElement { this.file = file; this.fileUnique = unique; - assignToFrozenObject(this.value, { src: unique }); + this.value = assignToFrozenObject(this.value, { src: unique }); this.#manager?.uploadOne(unique, file, 'waiting'); @@ -70,7 +70,7 @@ export class UmbInputImageCropperElement extends UmbLitElement { } #onRemove = () => { - assignToFrozenObject(this.value, { src: '' }); + this.value = assignToFrozenObject(this.value, { src: '' }); if (!this.fileUnique) return; this.#manager?.removeOne(this.fileUnique); this.fileUnique = undefined; From d052bc00097dc4c568c401686c337065f24e4ba4 Mon Sep 17 00:00:00 2001 From: JesmoDev Date: Thu, 7 Mar 2024 15:09:31 +0100 Subject: [PATCH 07/22] use config --- ...roperty-editor-ui-image-cropper.element.ts | 28 +++++++++---------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/image-cropper/property-editor-ui-image-cropper.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/image-cropper/property-editor-ui-image-cropper.element.ts index 90b5cbb01e..c2aa61f1b2 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/image-cropper/property-editor-ui-image-cropper.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/image-cropper/property-editor-ui-image-cropper.element.ts @@ -3,6 +3,7 @@ import { html, customElement, property, nothing } from '@umbraco-cms/backoffice/ import type { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; import '../../components/input-image-cropper/input-image-cropper.element.js'; +import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; /** * @element umb-property-editor-ui-image-cropper @@ -29,21 +30,20 @@ export class UmbPropertyEditorUIImageCropperElement extends UmbLitElement implem } } - // #crops = []; + @property({ attribute: false }) + public set config(config: UmbPropertyEditorConfigCollection | undefined) { + const crops = config?.getValueByAlias('crops') ?? []; - // @property({ attribute: false }) - // public set config(config: UmbPropertyEditorConfigCollection | undefined) { - // this.#crops = config?.getValueByAlias('crops') ?? []; - - // if (!this.value) { - // //TODO: How should we combine the crops from the value with the configuration? - // this.value = { - // crops: this.#crops, - // focalPoint: { left: 0.5, top: 0.5 }, - // src: 'https://picsum.photos/seed/picsum/1920/1080', - // }; - // } - // } + if (!this.value) { + this.value = { + src: '', + crops: crops, + focalPoint: { left: 0.5, top: 0.5 }, + }; + } else { + this.value.crops = crops; + } + } #onChange(e: Event) { this.value = (e.target as any).value; From 80fa513f30a09fd3253cbd0a3ffc7f0580dc7154 Mon Sep 17 00:00:00 2001 From: JesmoDev <26099018+JesmoDev@users.noreply.github.com> Date: Mon, 11 Mar 2024 13:15:24 +0100 Subject: [PATCH 08/22] add icon to scaffold --- .../repository/detail/media-type-detail.server.data-source.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/detail/media-type-detail.server.data-source.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/detail/media-type-detail.server.data-source.ts index 9837b7d73c..28c704c689 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/detail/media-type-detail.server.data-source.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/detail/media-type-detail.server.data-source.ts @@ -42,7 +42,7 @@ export class UmbMediaTypeServerDataSource implements UmbDetailDataSource Date: Mon, 11 Mar 2024 13:15:36 +0100 Subject: [PATCH 09/22] remove empty space in button to allow label to be shown --- .../views/design/media-type-workspace-view-edit-tab.element.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/workspace/views/design/media-type-workspace-view-edit-tab.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/workspace/views/design/media-type-workspace-view-edit-tab.element.ts index 818c6604a3..b1dcf8b275 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/workspace/views/design/media-type-workspace-view-edit-tab.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/workspace/views/design/media-type-workspace-view-edit-tab.element.ts @@ -209,8 +209,7 @@ export class UmbMediaTypeWorkspaceViewEditTabElement extends UmbLitElement { label=${this.localize.term('contentTypeEditor_addGroup')} id="add" look="placeholder" - @click=${this.#onAddGroup}> - ` + @click=${this.#onAddGroup}>` : ''} `; } From 6c9619a1e569c4c2877b49bf20f1e8fdf9ef5a2d Mon Sep 17 00:00:00 2001 From: Lone Iversen <108085781+loivsen@users.noreply.github.com> Date: Mon, 11 Mar 2024 15:45:46 +0100 Subject: [PATCH 10/22] Feature: LogViewer pagination --- .../log-viewer/workspace/logviewer.context.ts | 6 +-- .../logviewer/logviewer-workspace.element.ts | 6 ++- ...ewer-message-templates-overview.element.ts | 53 ++++++++++++------- ...-viewer-saved-searches-overview.element.ts | 30 +++++++++-- .../log-viewer-messages-list.element.ts | 8 ++- .../views/search/log-search-view.element.ts | 4 ++ 6 files changed, 79 insertions(+), 28 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/logviewer.context.ts b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/logviewer.context.ts index 6dbbe79933..39fc6efa54 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/logviewer.context.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/logviewer.context.ts @@ -67,7 +67,7 @@ export class UmbLogViewerWorkspaceContext extends UmbControllerBase implements U }; #savedSearches = new UmbObjectState(undefined); - savedSearches = this.#savedSearches.asObservablePart((data) => data?.items); + savedSearches = this.#savedSearches.asObservablePart((data) => data); #logCount = new UmbObjectState(null); logCount = this.#logCount.asObservable(); @@ -168,8 +168,8 @@ export class UmbLogViewerWorkspaceContext extends UmbControllerBase implements U return this.#dateRange.getValue(); } - async getSavedSearches() { - const { data } = await this.#repository.getSavedSearches({ skip: 0, take: 100 }); + async getSavedSearches({ skip = 0, take = 15 }: { skip?: number; take?: number } = {}) { + const { data } = await this.#repository.getSavedSearches({ skip, take }); if (data) { this.#savedSearches.setValue(data); } else { diff --git a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/logviewer/logviewer-workspace.element.ts b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/logviewer/logviewer-workspace.element.ts index c0aed6bc80..aea79e21e9 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/logviewer/logviewer-workspace.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/logviewer/logviewer-workspace.element.ts @@ -33,7 +33,11 @@ export class UmbLogViewerWorkspaceElement extends UmbLitElement { } render() { - return html` `; + return html` + + `; } static styles = [ diff --git a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-message-templates-overview.element.ts b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-message-templates-overview.element.ts index 56e67450cd..b4b8c53919 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-message-templates-overview.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-message-templates-overview.element.ts @@ -1,25 +1,31 @@ import type { UmbLogViewerWorkspaceContext } from '../../../logviewer.context.js'; import { UMB_APP_LOG_VIEWER_CONTEXT } from '../../../logviewer.context.js'; import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; -import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit'; +import { css, html, customElement, state, nothing } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; import type { - PagedLogTemplateResponseModel, + LogTemplateResponseModel, SavedLogSearchResponseModel, } from '@umbraco-cms/backoffice/external/backend-api'; +import type { UUIPaginationEvent } from '@umbraco-cms/backoffice/external/uui'; -//TODO: fix pagination bug when API is fixed @customElement('umb-log-viewer-message-templates-overview') export class UmbLogViewerMessageTemplatesOverviewElement extends UmbLitElement { + #itemsPerPage = 10; + #currentPage = 1; + @state() - private _messageTemplates: PagedLogTemplateResponseModel | null = null; + private _total = 0; + + @state() + private _messageTemplates: Array = []; #logViewerContext?: UmbLogViewerWorkspaceContext; constructor() { super(); this.consumeContext(UMB_APP_LOG_VIEWER_CONTEXT, (instance) => { this.#logViewerContext = instance; - this.#logViewerContext?.getMessageTemplates(0, 10); + this.#logViewerContext?.getMessageTemplates(0, this.#itemsPerPage); this.#observeStuff(); }); } @@ -27,13 +33,20 @@ export class UmbLogViewerMessageTemplatesOverviewElement extends UmbLitElement { #observeStuff() { if (!this.#logViewerContext) return; this.observe(this.#logViewerContext.messageTemplates, (templates) => { - this._messageTemplates = templates ?? null; + this._messageTemplates = templates?.items ?? []; + this._total = templates?.total ?? 0; }); } #getMessageTemplates() { - const take = this._messageTemplates?.items?.length ?? 0; - this.#logViewerContext?.getMessageTemplates(0, take + 10); + //const take = this._messageTemplates?.length ?? 0; + const skip = this.#currentPage * this.#itemsPerPage - this.#itemsPerPage; + this.#logViewerContext?.getMessageTemplates(skip, this.#itemsPerPage); + } + + #onChangePage(event: UUIPaginationEvent) { + this.#currentPage = event.target.current; + this.#getMessageTemplates(); } #renderSearchItem = (searchListItem: SavedLogSearchResponseModel) => { @@ -54,11 +67,11 @@ export class UmbLogViewerMessageTemplatesOverviewElement extends UmbLitElement { render() { return html` -

Total Unique Message types: ${this._messageTemplates?.total}

+

Total Unique Message types: ${this._total}

${this._messageTemplates - ? this._messageTemplates.items.map( + ? this._messageTemplates.map( (template) => html` @@ -70,17 +83,15 @@ export class UmbLogViewerMessageTemplatesOverviewElement extends UmbLitElement { `, - ) + ) : ''} - - - Show more - + ${this._total > this.#itemsPerPage + ? html`` + : nothing} `; } @@ -88,6 +99,10 @@ export class UmbLogViewerMessageTemplatesOverviewElement extends UmbLitElement { static styles = [ UmbTextStyles, css` + uui-pagination { + margin-top: var(--uui-size-layout-1); + } + #show-more-templates-btn { margin-top: var(--uui-size-space-5); } diff --git a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts index 517a46d848..ca34b34fcd 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts @@ -1,23 +1,30 @@ import type { UmbLogViewerWorkspaceContext } from '../../../logviewer.context.js'; import { UMB_APP_LOG_VIEWER_CONTEXT } from '../../../logviewer.context.js'; import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; -import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit'; +import { css, html, customElement, state, nothing } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; import type { SavedLogSearchResponseModel } from '@umbraco-cms/backoffice/external/backend-api'; +import type { UUIPaginationEvent } from '@umbraco-cms/backoffice/external/uui'; //TODO: implement the saved searches pagination when the API total bug is fixed @customElement('umb-log-viewer-saved-searches-overview') export class UmbLogViewerSavedSearchesOverviewElement extends UmbLitElement { + #itemsPerPage = 15; + #currentPage = 1; + @state() private _savedSearches: SavedLogSearchResponseModel[] = []; + @state() + private _total = 0; + #logViewerContext?: UmbLogViewerWorkspaceContext; constructor() { super(); this.consumeContext(UMB_APP_LOG_VIEWER_CONTEXT, (instance) => { this.#logViewerContext = instance; - this.#logViewerContext?.getSavedSearches(); + this.#logViewerContext?.getSavedSearches({ skip: 0, take: this.#itemsPerPage }); this.#observeStuff(); }); } @@ -25,10 +32,21 @@ export class UmbLogViewerSavedSearchesOverviewElement extends UmbLitElement { #observeStuff() { if (!this.#logViewerContext) return; this.observe(this.#logViewerContext.savedSearches, (savedSearches) => { - this._savedSearches = savedSearches ?? []; + this._savedSearches = savedSearches?.items ?? []; + this._total = savedSearches?.total ?? 0; }); } + #getSavedSearches() { + const skip = this.#currentPage * this.#itemsPerPage - this.#itemsPerPage; + this.#logViewerContext?.getSavedSearches({ skip, take: this.#itemsPerPage }); + } + + #onChangePage(event: UUIPaginationEvent) { + this.#currentPage = event.target.current; + this.#getSavedSearches(); + } + #renderSearchItem = (searchListItem: SavedLogSearchResponseModel) => { return html`
  • ${this.#renderSearchItem({ name: 'All logs', query: '' })} ${this._savedSearches.map(this.#renderSearchItem)} + ${this._total > this.#itemsPerPage + ? html`` + : nothing} `; } diff --git a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/components/log-viewer-messages-list.element.ts b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/components/log-viewer-messages-list.element.ts index ec98da6550..88a8fa48a1 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/components/log-viewer-messages-list.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/components/log-viewer-messages-list.element.ts @@ -89,12 +89,12 @@ export class UmbLogViewerMessagesListElement extends UmbLitElement { .properties=${log.properties ?? []} .exception=${log.exception ?? ''} .messageTemplate=${log.messageTemplate ?? ''}>`, - )}` + )}` : html` Sorry, we cannot find what you are looking for. - `}`; + `}`; } render() { @@ -124,6 +124,10 @@ export class UmbLogViewerMessagesListElement extends UmbLitElement { static styles = [ css` + uui-pagination { + display: block; + margin-bottom: var(--uui-size-layout-1); + } uui-box { --uui-box-default-padding: 0; } diff --git a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/log-search-view.element.ts b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/log-search-view.element.ts index 9443eb507a..7ca2dd25cd 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/log-search-view.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/log-search-view.element.ts @@ -57,6 +57,10 @@ export class UmbLogViewerSearchViewElement extends UmbLitElement { static styles = [ UmbTextStyles, css` + :host { + margin-bottom: var(--uui-size-space-2); + } + uui-box { --uui-box-default-padding: 0; } From 320e2511d593e60f8c98304d630a2d104daef8e7 Mon Sep 17 00:00:00 2001 From: Lone Iversen <108085781+loivsen@users.noreply.github.com> Date: Tue, 12 Mar 2024 09:09:50 +0100 Subject: [PATCH 11/22] items --- .../search/components/log-viewer-search-input.element.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/components/log-viewer-search-input.element.ts b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/components/log-viewer-search-input.element.ts index aeaa9df8f1..d07c85ef72 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/components/log-viewer-search-input.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/components/log-viewer-search-input.element.ts @@ -71,7 +71,7 @@ export class UmbLogViewerSearchInputElement extends UmbLitElement { #observeStuff() { if (!this.#logViewerContext) return; this.observe(this.#logViewerContext.savedSearches, (savedSearches) => { - this._savedSearches = savedSearches ?? []; + this._savedSearches = savedSearches?.items ?? []; this._isQuerySaved = this._savedSearches.some((search) => search.query === this._inputQuery); }); @@ -156,13 +156,13 @@ export class UmbLogViewerSearchInputElement extends UmbLitElement { ${this._showLoader ? html`
    -
    ` + ` : ''} ${this._inputQuery ? html`${!this._isQuerySaved ? html`` + >` : ''}` From 16ebae756aea21d287b9af0e07409ce842660697 Mon Sep 17 00:00:00 2001 From: Lone Iversen <108085781+loivsen@users.noreply.github.com> Date: Tue, 12 Mar 2024 09:15:56 +0100 Subject: [PATCH 12/22] remove todo --- .../overview/components/log-viewer-log-level-overview.element.ts | 1 - .../components/log-viewer-saved-searches-overview.element.ts | 1 - 2 files changed, 2 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-log-level-overview.element.ts b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-log-level-overview.element.ts index 21c65ce697..24dc5c6022 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-log-level-overview.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-log-level-overview.element.ts @@ -4,7 +4,6 @@ import { html, nothing, customElement, property, state } from '@umbraco-cms/back import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; import type { LoggerResponseModel } from '@umbraco-cms/backoffice/external/backend-api'; -//TODO: implement the saved searches pagination when the API total bug is fixed @customElement('umb-log-viewer-log-level-overview') export class UmbLogViewerLogLevelOverviewElement extends UmbLitElement { #logViewerContext?: UmbLogViewerWorkspaceContext; diff --git a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts index ca34b34fcd..9ecc2ef98f 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts @@ -6,7 +6,6 @@ import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; import type { SavedLogSearchResponseModel } from '@umbraco-cms/backoffice/external/backend-api'; import type { UUIPaginationEvent } from '@umbraco-cms/backoffice/external/uui'; -//TODO: implement the saved searches pagination when the API total bug is fixed @customElement('umb-log-viewer-saved-searches-overview') export class UmbLogViewerSavedSearchesOverviewElement extends UmbLitElement { #itemsPerPage = 15; From 6d0016da82409093e169efd9e4cb1b71001113a4 Mon Sep 17 00:00:00 2001 From: Jason Elkin Date: Mon, 11 Mar 2024 15:57:08 +0000 Subject: [PATCH 13/22] Make icon search case insensitive --- .../modal/common/icon-picker/icon-picker-modal.element.ts | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/modal/common/icon-picker/icon-picker-modal.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/modal/common/icon-picker/icon-picker-modal.element.ts index 464a42f7e0..9e28e70b4e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/modal/common/icon-picker/icon-picker-modal.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/modal/common/icon-picker/icon-picker-modal.element.ts @@ -26,7 +26,7 @@ export class UmbIconPickerModalElement extends UmbModalBaseElement icon.name.includes(e.target.value)); + this._iconListFiltered = this._iconList.filter((icon) => + icon.name.toLowerCase().includes(e.target.value.toLowerCase()), + ); } else { this._iconListFiltered = this._iconList; } From ed1a0b6af4a8c611cd3beb2b73ed0338bb4e6714 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Tue, 12 Mar 2024 10:27:50 +0100 Subject: [PATCH 14/22] fix mock data so it works with pagination --- src/Umbraco.Web.UI.Client/src/mocks/data/log-viewer.data.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/log-viewer.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/log-viewer.data.ts index 33f66fb115..fa179f05e7 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/log-viewer.data.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/log-viewer.data.ts @@ -14,7 +14,7 @@ class UmbLogViewerSearchesData extends UmbMockDBBase { - return this.data.slice(skip, take); + return this.data.slice(skip, take + skip); } getByName(name: string) { @@ -29,7 +29,7 @@ class UmbLogViewerTemplatesData extends UmbMockDBBase // skip can be number or null getTemplates(skip = 0, take = this.data.length): Array { - return this.data.slice(skip, take); + return this.data.slice(skip, take + skip); } } From 586c90862e33c6677e7fa564544651cf292e5999 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Tue, 12 Mar 2024 10:33:56 +0100 Subject: [PATCH 15/22] fix mock data so it works with pagination --- .../src/mocks/handlers/log-viewer.handlers.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/mocks/handlers/log-viewer.handlers.ts b/src/Umbraco.Web.UI.Client/src/mocks/handlers/log-viewer.handlers.ts index c1aabd575f..acf457650e 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/handlers/log-viewer.handlers.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/handlers/log-viewer.handlers.ts @@ -14,7 +14,7 @@ export const handlers = [ const items = umbLogViewerData.searches.getSavedSearches(skipNumber, takeNumber); const response = { - total: items.length, + total: umbLogViewerData.searches.total, items, }; @@ -57,7 +57,7 @@ export const handlers = [ return res(ctx.delay(), ctx.status(200), ctx.json(response)); }), //#endregion - + //#region Logs rest.get(umbracoPath('/log-viewer/level'), (req, res, ctx) => { return res(ctx.delay(), ctx.status(200), ctx.json(umbLogViewerData.logLevels)); From a2a10fc3b4a3b42735fe25b8e682a96d6c075e8c Mon Sep 17 00:00:00 2001 From: JesmoDev <26099018+JesmoDev@users.noreply.github.com> Date: Tue, 12 Mar 2024 11:22:44 +0100 Subject: [PATCH 16/22] image cropper use config for crops --- ...roperty-editor-ui-image-cropper.element.ts | 36 ++++++++++++------- 1 file changed, 24 insertions(+), 12 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/image-cropper/property-editor-ui-image-cropper.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/image-cropper/property-editor-ui-image-cropper.element.ts index c2aa61f1b2..3162b622a2 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/image-cropper/property-editor-ui-image-cropper.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/image-cropper/property-editor-ui-image-cropper.element.ts @@ -1,9 +1,12 @@ import type { UmbImageCropperPropertyEditorValue } from '../../components/index.js'; -import { html, customElement, property, nothing } from '@umbraco-cms/backoffice/external/lit'; +import { html, customElement, property, nothing, state, PropertyValueMap } from '@umbraco-cms/backoffice/external/lit'; import type { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; import '../../components/input-image-cropper/input-image-cropper.element.js'; -import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; +import { + UmbPropertyValueChangeEvent, + type UmbPropertyEditorConfigCollection, +} from '@umbraco-cms/backoffice/property-editor'; /** * @element umb-property-editor-ui-image-cropper @@ -17,6 +20,9 @@ export class UmbPropertyEditorUIImageCropperElement extends UmbLitElement implem focalPoint: { left: 0.5, top: 0.5 }, }; + @state() + crops: UmbImageCropperPropertyEditorValue['crops'] = []; + updated(changedProperties: Map) { super.updated(changedProperties); if (changedProperties.has('value')) { @@ -32,22 +38,28 @@ export class UmbPropertyEditorUIImageCropperElement extends UmbLitElement implem @property({ attribute: false }) public set config(config: UmbPropertyEditorConfigCollection | undefined) { - const crops = config?.getValueByAlias('crops') ?? []; + this.crops = config?.getValueByAlias('crops') ?? []; - if (!this.value) { - this.value = { - src: '', - crops: crops, - focalPoint: { left: 0.5, top: 0.5 }, + // Replace crops from the value with the crops from the config while keeping the coordinates from the value if they exist. + const filteredCrops = this.crops.map((crop) => { + const cropFromValue = this.value.crops.find((valueCrop) => valueCrop.alias === crop.alias); + const result = { + ...crop, + coordinates: cropFromValue?.coordinates ?? undefined, }; - } else { - this.value.crops = crops; - } + + return result; + }); + + this.value = { + ...this.value, + crops: filteredCrops, + }; } #onChange(e: Event) { this.value = (e.target as any).value; - this.dispatchEvent(new CustomEvent('property-value-change')); + this.dispatchEvent(new UmbPropertyValueChangeEvent()); } render() { From 4436c20dd9fc9416e1371a4db2c200c2db28975d Mon Sep 17 00:00:00 2001 From: JesmoDev <26099018+JesmoDev@users.noreply.github.com> Date: Tue, 12 Mar 2024 12:32:41 +0100 Subject: [PATCH 17/22] move crops merge into the input --- .../input-image-cropper.element.ts | 36 +++++++++++++------ ...roperty-editor-ui-image-cropper.element.ts | 27 ++++---------- 2 files changed, 32 insertions(+), 31 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-image-cropper/input-image-cropper.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-image-cropper/input-image-cropper.element.ts index 1172d1863e..902f1f082a 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-image-cropper/input-image-cropper.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-image-cropper/input-image-cropper.element.ts @@ -5,7 +5,7 @@ import type { UUIFileDropzoneElement, UUIFileDropzoneEvent } from '@umbraco-cms/ import { UmbId } from '@umbraco-cms/backoffice/id'; import { UmbChangeEvent } from '@umbraco-cms/backoffice/event'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; -import { type TemporaryFileQueueItem, UmbTemporaryFileManager } from '@umbraco-cms/backoffice/temporary-file'; +import { UmbTemporaryFileManager } from '@umbraco-cms/backoffice/temporary-file'; import { assignToFrozenObject } from '@umbraco-cms/backoffice/observable-api'; import './image-cropper.element.js'; @@ -25,6 +25,9 @@ export class UmbInputImageCropperElement extends UmbLitElement { focalPoint: { left: 0.5, top: 0.5 }, }; + @property({ attribute: false }) + crops: UmbImageCropperPropertyEditorValue['crops'] = []; + @state() file?: File; @@ -36,18 +39,11 @@ export class UmbInputImageCropperElement extends UmbLitElement { constructor() { super(); this.#manager = new UmbTemporaryFileManager(this); - - // this.observe(this.#manager.isReady, (value) => (this.error = !value)); - this.observe(this.#manager.queue, this.#onQueueUpdate); } - #onQueueUpdate = (value: TemporaryFileQueueItem[]) => { - if (value.length) { - // this.file = value[0].file; - // this.fileUnique = value[0].unique; - // this.value.src = value[0].unique; - } - }; + protected firstUpdated(): void { + this.#mergeCrops(); + } #onUpload(e: UUIFileDropzoneEvent) { const file = e.detail.files[0]; @@ -79,6 +75,24 @@ export class UmbInputImageCropperElement extends UmbLitElement { this.dispatchEvent(new UmbChangeEvent()); }; + #mergeCrops() { + // Replace crops from the value with the crops from the config while keeping the coordinates from the value if they exist. + const filteredCrops = this.crops.map((crop) => { + const cropFromValue = this.value.crops.find((valueCrop) => valueCrop.alias === crop.alias); + const result = { + ...crop, + coordinates: cropFromValue?.coordinates ?? undefined, + }; + + return result; + }); + + this.value = { + ...this.value, + crops: filteredCrops, + }; + } + render() { if (this.value.src || this.file) { return this.#renderImageCropper(); diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/image-cropper/property-editor-ui-image-cropper.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/image-cropper/property-editor-ui-image-cropper.element.ts index 3162b622a2..6f04f15b06 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/image-cropper/property-editor-ui-image-cropper.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/image-cropper/property-editor-ui-image-cropper.element.ts @@ -1,5 +1,5 @@ -import type { UmbImageCropperPropertyEditorValue } from '../../components/index.js'; -import { html, customElement, property, nothing, state, PropertyValueMap } from '@umbraco-cms/backoffice/external/lit'; +import type { UmbImageCropperPropertyEditorValue, UmbInputImageCropperElement } from '../../components/index.js'; +import { html, customElement, property, nothing, state } from '@umbraco-cms/backoffice/external/lit'; import type { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; import '../../components/input-image-cropper/input-image-cropper.element.js'; @@ -39,33 +39,20 @@ export class UmbPropertyEditorUIImageCropperElement extends UmbLitElement implem @property({ attribute: false }) public set config(config: UmbPropertyEditorConfigCollection | undefined) { this.crops = config?.getValueByAlias('crops') ?? []; - - // Replace crops from the value with the crops from the config while keeping the coordinates from the value if they exist. - const filteredCrops = this.crops.map((crop) => { - const cropFromValue = this.value.crops.find((valueCrop) => valueCrop.alias === crop.alias); - const result = { - ...crop, - coordinates: cropFromValue?.coordinates ?? undefined, - }; - - return result; - }); - - this.value = { - ...this.value, - crops: filteredCrops, - }; } #onChange(e: Event) { - this.value = (e.target as any).value; + this.value = (e.target as UmbInputImageCropperElement).value; this.dispatchEvent(new UmbPropertyValueChangeEvent()); } render() { if (!this.value) return nothing; - return html``; + return html``; } } From 960ff842ecb332f83537d1eb900d7fabd9515179 Mon Sep 17 00:00:00 2001 From: JesmoDev <26099018+JesmoDev@users.noreply.github.com> Date: Tue, 12 Mar 2024 12:33:13 +0100 Subject: [PATCH 18/22] add type for media input property value --- .../property-editors/media-picker/index.ts | 8 +++++ ...property-editor-ui-media-picker.element.ts | 33 +++++++++++-------- 2 files changed, 28 insertions(+), 13 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/index.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/index.ts index 7eddcc7572..54a8835b52 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/index.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/index.ts @@ -1 +1,9 @@ export * from './property-editor-ui-media-picker.element.js'; + +export type UmbMediaPickerPropertyValue = { + key: string; + mediaKey: string; + mediaTypeAlias: string; + focalPoint: { left: number; top: number } | null; + crops: Array<{ alias: string; width: number; height: number }>; +}; diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts index 1636c5fe24..54ccf9af0f 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.ts @@ -1,8 +1,11 @@ import type { UmbInputMediaElement } from '../../components/input-media/input-media.element.js'; import '../../components/input-media/input-media.element.js'; -import type { PropertyValueMap } from '@umbraco-cms/backoffice/external/lit'; +import type { UmbMediaPickerPropertyValue } from './index.js'; import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; -import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; +import { + UmbPropertyValueChangeEvent, + type UmbPropertyEditorConfigCollection, +} from '@umbraco-cms/backoffice/property-editor'; import type { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; import { UmbId } from '@umbraco-cms/backoffice/id'; @@ -13,9 +16,15 @@ import { UmbId } from '@umbraco-cms/backoffice/id'; @customElement('umb-property-editor-ui-media-picker') export class UmbPropertyEditorUIMediaPickerElement extends UmbLitElement implements UmbPropertyEditorUiElement { @property({ attribute: false }) - public value: Array<{ key: string; mediaKey: string; mediaTypeAlias: string }> = []; + public set value(value: Array) { + this.#value = value; + this._items = this.value ? this.value.map((x) => x.mediaKey) : []; + } //TODO: Add support for document specific crops. The server side already supports this. - //TODO: Add crops and focalpoint to value. + + public get value() { + return this.#value; + } @property({ attribute: false }) public set config(config: UmbPropertyEditorConfigCollection | undefined) { @@ -39,32 +48,30 @@ export class UmbPropertyEditorUIMediaPickerElement extends UmbLitElement impleme @state() private _limitMax: number = Infinity; - protected firstUpdated(_changedProperties: PropertyValueMap | Map): void { - super.firstUpdated(_changedProperties); + #value: Array = []; - this._items = this.value ? this.value.map((x) => x.mediaKey) : []; - } - - private _onChange(event: CustomEvent) { + #onChange(event: CustomEvent) { const selectedIds = (event.target as UmbInputMediaElement).selectedIds; const result = selectedIds.map((mediaKey) => { return { key: UmbId.new(), mediaKey, - mediaTypeAlias: 'Image', + mediaTypeAlias: '', + focalPoint: null, + crops: [], }; }); this.value = result; this._items = this.value ? this.value.map((x) => x.mediaKey) : []; - this.dispatchEvent(new CustomEvent('property-value-change')); + this.dispatchEvent(new UmbPropertyValueChangeEvent()); } render() { return html` From 70d7145fa930ffd25a2e18b1411d30ca134b691d Mon Sep 17 00:00:00 2001 From: Lone Iversen <108085781+loivsen@users.noreply.github.com> Date: Tue, 12 Mar 2024 12:46:04 +0100 Subject: [PATCH 19/22] Update src/packages/log-viewer/workspace/views/overview/components/log-viewer-message-templates-overview.element.ts Co-authored-by: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> --- .../components/log-viewer-message-templates-overview.element.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-message-templates-overview.element.ts b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-message-templates-overview.element.ts index b4b8c53919..9edcbc0b0e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-message-templates-overview.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-message-templates-overview.element.ts @@ -39,7 +39,6 @@ export class UmbLogViewerMessageTemplatesOverviewElement extends UmbLitElement { } #getMessageTemplates() { - //const take = this._messageTemplates?.length ?? 0; const skip = this.#currentPage * this.#itemsPerPage - this.#itemsPerPage; this.#logViewerContext?.getMessageTemplates(skip, this.#itemsPerPage); } From bb5dea3c1fdfb0e3be0feb4cc1f5d959fd48c584 Mon Sep 17 00:00:00 2001 From: Lone Iversen <108085781+loivsen@users.noreply.github.com> Date: Tue, 12 Mar 2024 13:09:11 +0100 Subject: [PATCH 20/22] take 999 --- .../src/packages/log-viewer/workspace/logviewer.context.ts | 2 +- .../components/log-viewer-saved-searches-overview.element.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/logviewer.context.ts b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/logviewer.context.ts index 39fc6efa54..c5f467d934 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/logviewer.context.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/logviewer.context.ts @@ -168,7 +168,7 @@ export class UmbLogViewerWorkspaceContext extends UmbControllerBase implements U return this.#dateRange.getValue(); } - async getSavedSearches({ skip = 0, take = 15 }: { skip?: number; take?: number } = {}) { + async getSavedSearches({ skip = 0, take = 999 }: { skip?: number; take?: number } = {}) { const { data } = await this.#repository.getSavedSearches({ skip, take }); if (data) { this.#savedSearches.setValue(data); diff --git a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts index 9ecc2ef98f..c77d0f5e21 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts @@ -8,7 +8,7 @@ import type { UUIPaginationEvent } from '@umbraco-cms/backoffice/external/uui'; @customElement('umb-log-viewer-saved-searches-overview') export class UmbLogViewerSavedSearchesOverviewElement extends UmbLitElement { - #itemsPerPage = 15; + #itemsPerPage = 999; #currentPage = 1; @state() From c6de7f8fd563cc6dc2a6763bcbffd6752d8ac4b6 Mon Sep 17 00:00:00 2001 From: Mads Rasmussen Date: Tue, 12 Mar 2024 10:37:05 +0100 Subject: [PATCH 21/22] generate new server models --- .../src/external/backend-api/src/index.ts | 1 + .../models/ContentTreeItemResponseModel.ts | 1 - .../src/models/PagedWebhookResponseModel.ts | 12 +++++++++ .../src/models/TreeItemPresentationModel.ts | 1 - .../src/services/WebhookResource.ts | 25 +++++++++++++++++++ 5 files changed, 38 insertions(+), 2 deletions(-) create mode 100644 src/Umbraco.Web.UI.Client/src/external/backend-api/src/models/PagedWebhookResponseModel.ts diff --git a/src/Umbraco.Web.UI.Client/src/external/backend-api/src/index.ts b/src/Umbraco.Web.UI.Client/src/external/backend-api/src/index.ts index 0d1532cf44..3efb987f34 100644 --- a/src/Umbraco.Web.UI.Client/src/external/backend-api/src/index.ts +++ b/src/Umbraco.Web.UI.Client/src/external/backend-api/src/index.ts @@ -291,6 +291,7 @@ export type { PagedTagResponseModel } from './models/PagedTagResponseModel'; export type { PagedTelemetryResponseModel } from './models/PagedTelemetryResponseModel'; export type { PagedUserGroupResponseModel } from './models/PagedUserGroupResponseModel'; export type { PagedUserResponseModel } from './models/PagedUserResponseModel'; +export type { PagedWebhookResponseModel } from './models/PagedWebhookResponseModel'; export type { PartialViewFolderResponseModel } from './models/PartialViewFolderResponseModel'; export type { PartialViewItemResponseModel } from './models/PartialViewItemResponseModel'; export type { PartialViewResponseModel } from './models/PartialViewResponseModel'; diff --git a/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models/ContentTreeItemResponseModel.ts b/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models/ContentTreeItemResponseModel.ts index b2e1c8d529..bb5f9c106d 100644 --- a/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models/ContentTreeItemResponseModel.ts +++ b/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models/ContentTreeItemResponseModel.ts @@ -6,7 +6,6 @@ import type { ReferenceByIdModel } from './ReferenceByIdModel'; export type ContentTreeItemResponseModel = { - type: string; hasChildren: boolean; parent?: ReferenceByIdModel | null; noAccess: boolean; diff --git a/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models/PagedWebhookResponseModel.ts b/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models/PagedWebhookResponseModel.ts new file mode 100644 index 0000000000..1efc883d28 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models/PagedWebhookResponseModel.ts @@ -0,0 +1,12 @@ +/* generated using openapi-typescript-codegen -- do no edit */ +/* istanbul ignore file */ +/* tslint:disable */ +/* eslint-disable */ + +import type { WebhookResponseModel } from './WebhookResponseModel'; + +export type PagedWebhookResponseModel = { + total: number; + items: Array; +}; + diff --git a/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models/TreeItemPresentationModel.ts b/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models/TreeItemPresentationModel.ts index b6e40540ce..3f84670b27 100644 --- a/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models/TreeItemPresentationModel.ts +++ b/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models/TreeItemPresentationModel.ts @@ -4,7 +4,6 @@ /* eslint-disable */ export type TreeItemPresentationModel = { - type: string; hasChildren: boolean; }; diff --git a/src/Umbraco.Web.UI.Client/src/external/backend-api/src/services/WebhookResource.ts b/src/Umbraco.Web.UI.Client/src/external/backend-api/src/services/WebhookResource.ts index bbe951c01d..4e7f80c31f 100644 --- a/src/Umbraco.Web.UI.Client/src/external/backend-api/src/services/WebhookResource.ts +++ b/src/Umbraco.Web.UI.Client/src/external/backend-api/src/services/WebhookResource.ts @@ -3,6 +3,7 @@ /* tslint:disable */ /* eslint-disable */ import type { CreateWebhookRequestModel } from '../models/CreateWebhookRequestModel'; +import type { PagedWebhookResponseModel } from '../models/PagedWebhookResponseModel'; import type { UpdateWebhookRequestModel } from '../models/UpdateWebhookRequestModel'; import type { WebhookItemResponseModel } from '../models/WebhookItemResponseModel'; import type { WebhookResponseModel } from '../models/WebhookResponseModel'; @@ -13,6 +14,30 @@ import { request as __request } from '../core/request'; export class WebhookResource { + /** + * @returns PagedWebhookResponseModel Success + * @throws ApiError + */ + public static getWebhook({ + skip, + take = 100, + }: { + skip?: number, + take?: number, + }): CancelablePromise { + return __request(OpenAPI, { + method: 'GET', + url: '/umbraco/management/api/v1/webhook', + query: { + 'skip': skip, + 'take': take, + }, + errors: { + 401: `The resource is protected and requires an authentication token`, + }, + }); + } + /** * @returns string Created * @throws ApiError From a97d3bb0af823fcb5a009f08949495e0a1d3fd91 Mon Sep 17 00:00:00 2001 From: Mads Rasmussen Date: Tue, 12 Mar 2024 10:56:19 +0100 Subject: [PATCH 22/22] clean up mocks --- .../src/mocks/data/data-type/data-type.data.ts | 4 +--- .../src/mocks/data/dictionary/dictionary.data.ts | 4 +--- .../src/mocks/data/dictionary/dictionary.db.ts | 2 +- .../src/mocks/data/document-type/document-type.data.ts | 4 +--- .../src/mocks/data/document-type/document-type.db.ts | 4 +--- .../src/mocks/data/document/document.data.ts | 4 +--- .../src/mocks/data/document/document.db.ts | 2 +- .../src/mocks/data/media-type/media-type.data.ts | 10 ++++------ .../src/mocks/data/media-type/media-type.db.ts | 2 +- .../src/mocks/data/media/media.data.ts | 4 +--- .../src/mocks/data/media/media.db.ts | 2 +- .../src/mocks/data/partial-view/partial-view.data.ts | 4 +--- .../src/mocks/data/relations/relation-type.data.ts | 5 ----- .../src/mocks/data/script/script.data.ts | 4 +--- .../src/mocks/data/static-file/static-file.data.ts | 3 +-- .../src/mocks/data/stylesheet/stylesheet.data.ts | 4 +--- .../src/mocks/data/template/template.data.ts | 4 +--- src/Umbraco.Web.UI.Client/src/mocks/data/utils.ts | 3 +-- .../mocks/data/utils/entity/entity-folder.manager.ts | 2 +- .../src/mocks/data/utils/entity/entity-recycle-bin.ts | 4 +--- .../src/mocks/data/utils/entity/entity-tree.manager.ts | 2 +- .../data/utils/file-system/file-system-tree.manager.ts | 6 +++--- 22 files changed, 26 insertions(+), 57 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/data-type/data-type.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/data-type/data-type.data.ts index 52f12c19dc..492fd72563 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/data-type/data-type.data.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/data-type/data-type.data.ts @@ -4,9 +4,7 @@ import type { DataTypeTreeItemResponseModel, } from '@umbraco-cms/backoffice/external/backend-api'; -type UmbMockDataTypeModelHack = DataTypeResponseModel & DataTypeTreeItemResponseModel & DataTypeItemResponseModel; - -export interface UmbMockDataTypeModel extends Omit {} +export type UmbMockDataTypeModel = DataTypeResponseModel & DataTypeTreeItemResponseModel & DataTypeItemResponseModel; export const data: Array = [ { diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/dictionary/dictionary.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/dictionary/dictionary.data.ts index b135a1b516..3f68fa97f5 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/dictionary/dictionary.data.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/dictionary/dictionary.data.ts @@ -5,13 +5,11 @@ import type { NamedEntityTreeItemResponseModel, } from '@umbraco-cms/backoffice/external/backend-api'; -type UmbMockDictionaryModelHack = DictionaryItemResponseModel & +export type UmbMockDictionaryModel = DictionaryItemResponseModel & NamedEntityTreeItemResponseModel & DictionaryItemItemResponseModel & DictionaryOverviewResponseModel; -export interface UmbMockDictionaryModel extends Omit {} - export const data: Array = [ { name: 'Hello', diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/dictionary/dictionary.db.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/dictionary/dictionary.db.ts index 191f854604..bc8977c9ab 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/dictionary/dictionary.db.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/dictionary/dictionary.db.ts @@ -38,7 +38,7 @@ export class UmbDictionaryMockDB extends UmbEntityMockDbBase => { +const treeItemMapper = (model: UmbMockDictionaryModel): NamedEntityTreeItemResponseModel => { return { name: model.name, id: model.id, diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/document-type/document-type.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/document-type/document-type.data.ts index 182e04ef9c..22a13f84ce 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/document-type/document-type.data.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/document-type/document-type.data.ts @@ -5,12 +5,10 @@ import type { DocumentTypeTreeItemResponseModel, } from '@umbraco-cms/backoffice/external/backend-api'; -type UmbMockDocumentTypeModelHack = DocumentTypeResponseModel & +export type UmbMockDocumentTypeModel = DocumentTypeResponseModel & DocumentTypeTreeItemResponseModel & DocumentTypeItemResponseModel; -export interface UmbMockDocumentTypeModel extends Omit {} - export const data: Array = [ { allowedTemplates: [], diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/document-type/document-type.db.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/document-type/document-type.db.ts index 47428a85b5..24a362a1cb 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/document-type/document-type.db.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/document-type/document-type.db.ts @@ -122,9 +122,7 @@ const documentTypeDetailMapper = (item: UmbMockDocumentTypeModel): DocumentTypeR }; }; -const documentTypeTreeItemMapper = ( - item: UmbMockDocumentTypeModel, -): Omit => { +const documentTypeTreeItemMapper = (item: UmbMockDocumentTypeModel): DocumentTypeTreeItemResponseModel => { return { name: item.name, hasChildren: item.hasChildren, diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/document/document.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/document/document.data.ts index cf47af845a..1c0a6b60a2 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/document/document.data.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/document/document.data.ts @@ -5,9 +5,7 @@ import type { } from '@umbraco-cms/backoffice/external/backend-api'; import { DocumentVariantStateModel } from '@umbraco-cms/backoffice/external/backend-api'; -type UmbMockDocumentTypeModelHack = DocumentResponseModel & DocumentTreeItemResponseModel & DocumentItemResponseModel; - -export interface UmbMockDocumentModel extends Omit {} +export type UmbMockDocumentModel = DocumentResponseModel & DocumentTreeItemResponseModel & DocumentItemResponseModel; export const data: Array = [ { diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/document/document.db.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/document/document.db.ts index 76e2dfaafd..fdd0e3f23e 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/document/document.db.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/document/document.db.ts @@ -41,7 +41,7 @@ export class UmbDocumentMockDB extends UmbEntityMockDbBase } } -const treeItemMapper = (model: UmbMockDocumentModel): Omit => { +const treeItemMapper = (model: UmbMockDocumentModel): DocumentTreeItemResponseModel => { const documentType = umbDocumentTypeMockDb.read(model.documentType.id); if (!documentType) throw new Error(`Document type with id ${model.documentType.id} not found`); diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/media-type/media-type.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/media-type/media-type.data.ts index a7d235712b..aeba10c756 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/media-type/media-type.data.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/media-type/media-type.data.ts @@ -4,9 +4,9 @@ import type { MediaTypeTreeItemResponseModel, } from '@umbraco-cms/backoffice/external/backend-api'; -type UmbMockMediaTypeModelHack = MediaTypeResponseModel & MediaTypeTreeItemResponseModel & MediaTypeItemResponseModel; - -export interface UmbMockMediaTypeModel extends Omit {} +export type UmbMockMediaTypeModel = MediaTypeResponseModel & + MediaTypeTreeItemResponseModel & + MediaTypeItemResponseModel; export const data: Array = [ { @@ -91,9 +91,7 @@ export const data: Array = [ variesByCulture: false, variesBySegment: false, isElement: false, - allowedMediaTypes: [ - { mediaType: { id: 'media-type-1-id' }, sortOrder: 0 }, - ], + allowedMediaTypes: [{ mediaType: { id: 'media-type-1-id' }, sortOrder: 0 }], compositions: [], isFolder: false, hasChildren: false, diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/media-type/media-type.db.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/media-type/media-type.db.ts index 630e0d7e7c..874a4e4374 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/media-type/media-type.db.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/media-type/media-type.db.ts @@ -110,7 +110,7 @@ const mediaTypeDetailMapper = (item: UmbMockMediaTypeModel): MediaTypeResponseMo }; }; -const mediaTypeTreeItemMapper = (item: UmbMockMediaTypeModel): Omit => { +const mediaTypeTreeItemMapper = (item: UmbMockMediaTypeModel): MediaTypeTreeItemResponseModel => { return { name: item.name, hasChildren: item.hasChildren, diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.data.ts index 211c9aa3f2..012ab54620 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.data.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.data.ts @@ -4,9 +4,7 @@ import type { MediaTreeItemResponseModel, } from '@umbraco-cms/backoffice/external/backend-api'; -type UmbMockMediaModelHack = MediaResponseModel & MediaTreeItemResponseModel & MediaItemResponseModel; - -export interface UmbMockMediaModel extends Omit {} +export type UmbMockMediaModel = MediaResponseModel & MediaTreeItemResponseModel & MediaItemResponseModel; export const data: Array = [ { diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.db.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.db.ts index a87acd02d9..e0a6337152 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.db.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.db.ts @@ -28,7 +28,7 @@ export class UmbMediaMockDB extends UmbEntityMockDbBase { } } -const treeItemMapper = (model: UmbMockMediaModel): Omit => { +const treeItemMapper = (model: UmbMockMediaModel): MediaTreeItemResponseModel => { const mediaType = umbMediaTypeMockDb.read(model.mediaType.id); if (!mediaType) throw new Error(`Media type with id ${model.mediaType.id} not found`); diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/partial-view/partial-view.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/partial-view/partial-view.data.ts index 86efd983d6..0fa1bf78c7 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/partial-view/partial-view.data.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/partial-view/partial-view.data.ts @@ -5,12 +5,10 @@ import type { PartialViewSnippetResponseModel, } from '@umbraco-cms/backoffice/external/backend-api'; -type UmbMockPartialViewModelHack = PartialViewResponseModel & +export type UmbMockPartialViewModel = PartialViewResponseModel & FileSystemTreeItemPresentationModel & PartialViewItemResponseModel; -export interface UmbMockPartialViewModel extends Omit {} - export const data: Array = [ { name: 'blockgrid', diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/relations/relation-type.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/relations/relation-type.data.ts index ae17352881..77d6c8cb05 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/relations/relation-type.data.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/relations/relation-type.data.ts @@ -79,7 +79,6 @@ export const treeData: Array = [ id: 'e0d39ff5-71d8-453f-b682-9d8d31ee5e06', parent: null, name: 'Relate Document On Copy', - type: 'relation-type', hasChildren: false, }, { @@ -87,28 +86,24 @@ export const treeData: Array = [ parent: null, name: 'Relate Parent Document On Delete', - type: 'relation-type', hasChildren: false, }, { id: '6f9b800c-762c-42d4-85d9-bf40a77d689e', parent: null, name: 'Relate Parent Media Folder On Delete', - type: 'relation-type', hasChildren: false, }, { id: 'd421727d-43de-4205-b4c6-037404f309ad', parent: null, name: 'Related Media', - type: 'relation-type', hasChildren: false, }, { id: 'e9a0a28e-2d5b-4229-ac00-66f2df230513', parent: null, name: 'Related Document', - type: 'relation-type', hasChildren: false, }, ]; diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/script/script.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/script/script.data.ts index a71cfe367d..24b7fb53e0 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/script/script.data.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/script/script.data.ts @@ -4,9 +4,7 @@ import type { ScriptResponseModel, } from '@umbraco-cms/backoffice/external/backend-api'; -type UmbMockScriptModelHack = ScriptResponseModel & FileSystemTreeItemPresentationModel & ScriptItemResponseModel; - -export interface UmbMockScriptModel extends Omit {} +export type UmbMockScriptModel = ScriptResponseModel & FileSystemTreeItemPresentationModel & ScriptItemResponseModel; export const data: Array = [ { diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/static-file/static-file.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/static-file/static-file.data.ts index 052cdaca11..b0eb91d277 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/static-file/static-file.data.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/static-file/static-file.data.ts @@ -3,8 +3,7 @@ import type { StaticFileItemResponseModel, } from '@umbraco-cms/backoffice/external/backend-api'; -type UmbMockStaticFileModelHack = StaticFileItemResponseModel & FileSystemTreeItemPresentationModel; -export interface UmbMockStaticFileModel extends Omit {} +export type UmbMockStaticFileModel = StaticFileItemResponseModel & FileSystemTreeItemPresentationModel; export const data: Array = [ { diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/stylesheet/stylesheet.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/stylesheet/stylesheet.data.ts index 2ce1bcde20..1145bb66e9 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/stylesheet/stylesheet.data.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/stylesheet/stylesheet.data.ts @@ -4,12 +4,10 @@ import type { StylesheetResponseModel, } from '@umbraco-cms/backoffice/external/backend-api'; -type UmbMockStylesheetModelHack = StylesheetResponseModel & +export type UmbMockStylesheetModel = StylesheetResponseModel & FileSystemTreeItemPresentationModel & StylesheetItemResponseModel; -export interface UmbMockStylesheetModel extends Omit {} - export const data: Array = [ { name: 'Stylesheet File 1.css', diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/template/template.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/template/template.data.ts index fd6988429a..4aadfd758e 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/template/template.data.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/template/template.data.ts @@ -7,9 +7,7 @@ import type { } from '@umbraco-cms/backoffice/external/backend-api'; import { TemplateQueryPropertyTypeModel, OperatorModel } from '@umbraco-cms/backoffice/external/backend-api'; -type UmbMockTemplateModelHack = TemplateResponseModel & NamedEntityTreeItemResponseModel & TemplateItemResponseModel; - -export interface UmbMockTemplateModel extends Omit {} +export type UmbMockTemplateModel = TemplateResponseModel & NamedEntityTreeItemResponseModel & TemplateItemResponseModel; export const data: Array = [ { diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/utils.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/utils.ts index 54e1eee8ff..f3a9ac812e 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/utils.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/utils.ts @@ -7,7 +7,6 @@ import type { export const createEntityTreeItem = (item: any): NamedEntityTreeItemResponseModel => { return { name: item.name, - type: item.type, hasChildren: item.hasChildren, id: item.id, parent: item.parent, @@ -21,7 +20,7 @@ export const folderTreeItemMapper = (item: any): FolderTreeItemResponseModel => }; }; -export const createFileSystemTreeItem = (item: any): Omit => { +export const createFileSystemTreeItem = (item: any): FileSystemTreeItemPresentationModel => { return { path: item.path, parent: item.parent ?? null, diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/utils/entity/entity-folder.manager.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/utils/entity/entity-folder.manager.ts index 968fe7f8e7..87eaef9361 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/utils/entity/entity-folder.manager.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/utils/entity/entity-folder.manager.ts @@ -6,7 +6,7 @@ import type { UpdateFolderResponseModel, } from '@umbraco-cms/backoffice/external/backend-api'; -export class UmbMockEntityFolderManager> { +export class UmbMockEntityFolderManager { #db: UmbEntityMockDbBase; #createMockFolderMapper: (request: CreateFolderRequestModel) => MockItemType; diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/utils/entity/entity-recycle-bin.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/utils/entity/entity-recycle-bin.ts index fb6940cc7a..2cb6918b2d 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/utils/entity/entity-recycle-bin.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/utils/entity/entity-recycle-bin.ts @@ -2,9 +2,7 @@ import { UmbEntityMockDbBase } from './entity-base.js'; import { UmbMockEntityTreeManager } from './entity-tree.manager.js'; import type { ContentTreeItemResponseModel } from '@umbraco-cms/backoffice/external/backend-api'; -export class UmbEntityRecycleBin< - MockType extends Omit, -> extends UmbEntityMockDbBase { +export class UmbEntityRecycleBin extends UmbEntityMockDbBase { tree; constructor(data: Array, treeItemMapper: (model: MockType) => any) { diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/utils/entity/entity-tree.manager.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/utils/entity/entity-tree.manager.ts index 38c08ccad5..def3178707 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/utils/entity/entity-tree.manager.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/utils/entity/entity-tree.manager.ts @@ -3,7 +3,7 @@ import type { UmbEntityMockDbBase } from './entity-base.js'; import { UmbId } from '@umbraco-cms/backoffice/id'; import type { EntityTreeItemResponseModel } from '@umbraco-cms/backoffice/external/backend-api'; -export class UmbMockEntityTreeManager> { +export class UmbMockEntityTreeManager { #db: UmbEntityMockDbBase; #treeItemMapper: (item: T) => any; diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/utils/file-system/file-system-tree.manager.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/utils/file-system/file-system-tree.manager.ts index cad195d8f9..2641be20f2 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/utils/file-system/file-system-tree.manager.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/utils/file-system/file-system-tree.manager.ts @@ -3,7 +3,7 @@ import { createFileSystemTreeItem } from '../../utils.js'; import { pagedResult } from '../paged-result.js'; import type { FileSystemTreeItemPresentationModel } from '@umbraco-cms/backoffice/external/backend-api'; -export class UmbMockFileSystemTreeManager> { +export class UmbMockFileSystemTreeManager { #db: UmbMockDBBase; constructor(mockDb: UmbMockDBBase) { @@ -11,7 +11,7 @@ export class UmbMockFileSystemTreeManager>; + items: Array; total: number; } { const items = this.#db.getAll().filter((item) => item.parent === null); @@ -19,7 +19,7 @@ export class UmbMockFileSystemTreeManager>; + items: Array; total: number; } { const items = this.#db.getAll().filter((item) => item.parent?.path === parentPath);