diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/publishing/unpublish/modal/document-unpublish-modal.element.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/publishing/unpublish/modal/document-unpublish-modal.element.ts index 8dcafc0edb..8d68fcb438 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/publishing/unpublish/modal/document-unpublish-modal.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/publishing/unpublish/modal/document-unpublish-modal.element.ts @@ -1,5 +1,5 @@ import { UmbDocumentVariantState, type UmbDocumentVariantOptionModel } from '../../../types.js'; -import { UmbDocumentReferenceRepository } from '../../../reference/index.js'; +import { UMB_DOCUMENT_ITEM_REPOSITORY_ALIAS, UMB_DOCUMENT_REFERENCE_REPOSITORY_ALIAS } from '../../../constants.js'; import { UMB_DOCUMENT_CONFIGURATION_CONTEXT } from '../../../global-contexts/index.js'; import type { UmbDocumentUnpublishModalData, @@ -9,6 +9,11 @@ import { css, customElement, html, nothing, state } from '@umbraco-cms/backoffic import { UmbModalBaseElement } from '@umbraco-cms/backoffice/modal'; import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbSelectionManager } from '@umbraco-cms/backoffice/utils'; +import type { + UmbConfirmActionModalEntityReferencesConfig, + UmbConfirmActionModalEntityReferencesElement, +} from '@umbraco-cms/backoffice/relations'; +import type { UmbChangeEvent } from '@umbraco-cms/backoffice/event'; import '../../../modals/shared/document-variant-language-picker.element.js'; @@ -30,7 +35,6 @@ export class UmbDocumentUnpublishModalElement extends UmbModalBaseElement< UmbDocumentUnpublishModalValue > { protected readonly _selectionManager = new UmbSelectionManager(this); - #referencesRepository = new UmbDocumentReferenceRepository(this); @state() _options: Array = []; @@ -39,10 +43,7 @@ export class UmbDocumentUnpublishModalElement extends UmbModalBaseElement< _selection: Array = []; @state() - _hasReferences = false; - - @state() - _hasUnpublishPermission = true; + _canUnpublish = true; @state() _hasInvalidSelection = true; @@ -50,6 +51,9 @@ export class UmbDocumentUnpublishModalElement extends UmbModalBaseElement< @state() _isInvariant = false; + @state() + _referencesConfig?: UmbConfirmActionModalEntityReferencesConfig; + #pickableFilter = (option: UmbDocumentVariantOptionModel) => { if (!option.variant) { return false; @@ -58,7 +62,7 @@ export class UmbDocumentUnpublishModalElement extends UmbModalBaseElement< }; override firstUpdated() { - this.#getReferences(); + this.#configureReferences(); // If invariant, don't display the variant selection component. if (this.data?.options.length === 1 && this.data.options[0].unique === 'invariant') { @@ -70,6 +74,16 @@ export class UmbDocumentUnpublishModalElement extends UmbModalBaseElement< this.#configureSelectionManager(); } + #configureReferences() { + if (!this.data?.documentUnique) return; + + this._referencesConfig = { + itemRepositoryAlias: UMB_DOCUMENT_ITEM_REPOSITORY_ALIAS, + referenceRepositoryAlias: UMB_DOCUMENT_REFERENCE_REPOSITORY_ALIAS, + unique: this.data.documentUnique, + }; + } + async #configureSelectionManager() { this._selectionManager.setMultiple(true); this._selectionManager.setSelectable(true); @@ -103,30 +117,8 @@ export class UmbDocumentUnpublishModalElement extends UmbModalBaseElement< ); } - async #getReferences() { - if (!this.data?.documentUnique) return; - - const { data, error } = await this.#referencesRepository.requestReferencedBy(this.data?.documentUnique, 0, 1); - - if (error) { - console.error(error); - return; - } - - if (!data) return; - - this._hasReferences = data.total > 0; - - // If there are references, we also want to check if we are allowed to unpublish the document: - if (this._hasReferences) { - const documentConfigurationContext = await this.getContext(UMB_DOCUMENT_CONFIGURATION_CONTEXT); - this._hasUnpublishPermission = - (await documentConfigurationContext.getDocumentConfiguration())?.disableUnpublishWhenReferenced === false; - } - } - #submit() { - if (this._hasUnpublishPermission) { + if (this._canUnpublish) { const selection = this._isInvariant ? ['invariant'] : this._selection; this.value = { selection }; this.modalContext?.submit(); @@ -139,6 +131,19 @@ export class UmbDocumentUnpublishModalElement extends UmbModalBaseElement< this.modalContext?.reject(); } + async #onReferencesChange(event: UmbChangeEvent) { + event.stopPropagation(); + const target = event.target as UmbConfirmActionModalEntityReferencesElement; + const getReferencedByTotal = target.getTotalReferencedBy(); + const descendantsWithReferencesTotal = target.getTotalDescendantsWithReferences(); + const total = getReferencedByTotal + descendantsWithReferencesTotal; + + if (total > 0) { + const context = await this.getContext(UMB_DOCUMENT_CONFIGURATION_CONTEXT); + this._canUnpublish = (await context.getDocumentConfiguration())?.disableUnpublishWhenReferenced === false; + } + } + private _requiredFilter = (variantOption: UmbDocumentVariantOptionModel): boolean => { return variantOption.language.isMandatory && !this._selection.includes(variantOption.unique); }; @@ -166,20 +171,10 @@ export class UmbDocumentUnpublishModalElement extends UmbModalBaseElement<

- ${this.data?.documentUnique - ? html` - - ` - : nothing} - ${this._hasReferences - ? html` - - This item or its descendants is being referenced. Unpublishing can lead to broken links on your website. - Please take the appropriate actions. - - ` + ${this._referencesConfig + ? html`` : nothing}
@@ -187,7 +182,7 @@ export class UmbDocumentUnpublishModalElement extends UmbModalBaseElement< or element instead + * @class UmbDocumentReferenceTableElement + */ @customElement('umb-document-reference-table') export class UmbDocumentReferenceTableElement extends UmbLitElement { #documentReferenceRepository = new UmbDocumentReferenceRepository(this); @@ -32,6 +37,13 @@ export class UmbDocumentReferenceTableElement extends UmbLitElement { _errorMessage = ''; override firstUpdated() { + new UmbDeprecation({ + removeInVersion: '17', + deprecated: ' element', + solution: + 'For modals use the or element instead', + }).warn(); + this.#getReferences(); } diff --git a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/bulk-delete/modal/bulk-delete-with-relation-modal.element.ts b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/bulk-delete/modal/bulk-delete-with-relation-modal.element.ts index c7d2a22c79..a6fb984818 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/bulk-delete/modal/bulk-delete-with-relation-modal.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/bulk-delete/modal/bulk-delete-with-relation-modal.element.ts @@ -1,3 +1,4 @@ +import type { UmbConfirmBulkActionModalEntityReferencesConfig } from '../../../global-components/types.js'; import type { UmbBulkDeleteWithRelationConfirmModalData, UmbBulkDeleteWithRelationConfirmModalValue, @@ -15,16 +16,13 @@ import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbModalBaseElement } from '@umbraco-cms/backoffice/modal'; import { umbFocus } from '@umbraco-cms/backoffice/lit-element'; -// import of local component -import '../../local-components/confirm-bulk-action-entity-references.element.js'; - @customElement('umb-bulk-delete-with-relation-confirm-modal') export class UmbBulkDeleteWithRelationConfirmModalElement extends UmbModalBaseElement< UmbBulkDeleteWithRelationConfirmModalData, UmbBulkDeleteWithRelationConfirmModalValue > { @state() - _referencesConfig?: any; + _referencesConfig?: UmbConfirmBulkActionModalEntityReferencesConfig; protected override firstUpdated(_changedProperties: PropertyValues): void { super.firstUpdated(_changedProperties); diff --git a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/bulk-trash/modal/bulk-trash-with-relation-modal.element.ts b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/bulk-trash/modal/bulk-trash-with-relation-modal.element.ts index 8785fe42e1..6468189296 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/bulk-trash/modal/bulk-trash-with-relation-modal.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/bulk-trash/modal/bulk-trash-with-relation-modal.element.ts @@ -1,3 +1,4 @@ +import type { UmbConfirmBulkActionModalEntityReferencesConfig } from '../../../global-components/types.js'; import type { UmbBulkTrashWithRelationConfirmModalData, UmbBulkTrashWithRelationConfirmModalValue, @@ -15,16 +16,13 @@ import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbModalBaseElement } from '@umbraco-cms/backoffice/modal'; import { umbFocus } from '@umbraco-cms/backoffice/lit-element'; -// import of local component -import '../../local-components/confirm-bulk-action-entity-references.element.js'; - @customElement('umb-bulk-trash-with-relation-confirm-modal') export class UmbBulkTrashWithRelationConfirmModalElement extends UmbModalBaseElement< UmbBulkTrashWithRelationConfirmModalData, UmbBulkTrashWithRelationConfirmModalValue > { @state() - _referencesConfig?: any; + _referencesConfig?: UmbConfirmBulkActionModalEntityReferencesConfig; protected override firstUpdated(_changedProperties: PropertyValues): void { super.firstUpdated(_changedProperties); diff --git a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/delete/modal/delete-with-relation-modal.element.ts b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/delete/modal/delete-with-relation-modal.element.ts index 539568c271..9df34a33b0 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/delete/modal/delete-with-relation-modal.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/delete/modal/delete-with-relation-modal.element.ts @@ -1,3 +1,4 @@ +import type { UmbConfirmActionModalEntityReferencesConfig } from '../../../global-components/types.js'; import type { UmbDeleteWithRelationConfirmModalData, UmbDeleteWithRelationConfirmModalValue, @@ -17,8 +18,6 @@ import { umbFocus } from '@umbraco-cms/backoffice/lit-element'; import type { UmbItemRepository } from '@umbraco-cms/backoffice/repository'; import { createExtensionApiByAlias } from '@umbraco-cms/backoffice/extension-registry'; -import '../../local-components/confirm-action-entity-references.element.js'; - @customElement('umb-delete-with-relation-confirm-modal') export class UmbDeleteWithRelationConfirmModalElement extends UmbModalBaseElement< UmbDeleteWithRelationConfirmModalData, @@ -28,7 +27,7 @@ export class UmbDeleteWithRelationConfirmModalElement extends UmbModalBaseElemen _name?: string; @state() - _referencesConfig?: any; + _referencesConfig?: UmbConfirmActionModalEntityReferencesConfig; #itemRepository?: UmbItemRepository; diff --git a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/trash/modal/trash-with-relation-modal.element.ts b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/trash/modal/trash-with-relation-modal.element.ts index 61f40cf2bc..e6f3e21a42 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/trash/modal/trash-with-relation-modal.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/trash/modal/trash-with-relation-modal.element.ts @@ -1,3 +1,4 @@ +import type { UmbConfirmActionModalEntityReferencesConfig } from '../../../global-components/types.js'; import type { UmbTrashWithRelationConfirmModalData, UmbTrashWithRelationConfirmModalValue, @@ -17,9 +18,6 @@ import { umbFocus } from '@umbraco-cms/backoffice/lit-element'; import type { UmbItemRepository } from '@umbraco-cms/backoffice/repository'; import { createExtensionApiByAlias } from '@umbraco-cms/backoffice/extension-registry'; -// import of local component -import '../../local-components/confirm-action-entity-references.element.js'; - @customElement('umb-trash-with-relation-confirm-modal') export class UmbTrashWithRelationConfirmModalElement extends UmbModalBaseElement< UmbTrashWithRelationConfirmModalData, @@ -29,7 +27,7 @@ export class UmbTrashWithRelationConfirmModalElement extends UmbModalBaseElement _name?: string; @state() - _referencesConfig?: any; + _referencesConfig?: UmbConfirmActionModalEntityReferencesConfig; #itemRepository?: UmbItemRepository; diff --git a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/local-components/confirm-action-entity-references.element.ts b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/global-components/confirm-action-modal-entity-references.element.ts similarity index 89% rename from src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/local-components/confirm-action-entity-references.element.ts rename to src/Umbraco.Web.UI.Client/src/packages/relations/relations/global-components/confirm-action-modal-entity-references.element.ts index 282d2c2987..37cac2a5f2 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/local-components/confirm-action-entity-references.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/global-components/confirm-action-modal-entity-references.element.ts @@ -1,4 +1,4 @@ -import type { UmbEntityReferenceRepository, UmbReferenceItemModel } from '../../reference/types.js'; +import type { UmbEntityReferenceRepository, UmbReferenceItemModel } from '../reference/types.js'; import { html, customElement, @@ -12,16 +12,18 @@ import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import type { UmbItemRepository } from '@umbraco-cms/backoffice/repository'; import { createExtensionApiByAlias } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; +import { UmbChangeEvent } from '@umbraco-cms/backoffice/event'; + +export interface UmbConfirmActionModalEntityReferencesConfig { + itemRepositoryAlias: string; + referenceRepositoryAlias: string; + unique: string; +} @customElement('umb-confirm-action-modal-entity-references') export class UmbConfirmActionModalEntityReferencesElement extends UmbLitElement { @property({ type: Object, attribute: false }) - config?: { - itemRepositoryAlias: string; - referenceRepositoryAlias: string; - entityType: string; - unique: string; - }; + config?: UmbConfirmActionModalEntityReferencesConfig; @state() _referencedByItems: Array = []; @@ -40,6 +42,14 @@ export class UmbConfirmActionModalEntityReferencesElement extends UmbLitElement #limitItems = 3; + getTotalReferencedBy() { + return this._totalReferencedByItems; + } + + getTotalDescendantsWithReferences() { + return this._totalDescendantsWithReferences; + } + protected override firstUpdated(_changedProperties: PropertyValues): void { super.firstUpdated(_changedProperties); this.#initData(); @@ -88,6 +98,7 @@ export class UmbConfirmActionModalEntityReferencesElement extends UmbLitElement if (data) { this._referencedByItems = [...data.items]; this._totalReferencedByItems = data.total; + this.dispatchEvent(new UmbChangeEvent()); } } @@ -118,6 +129,7 @@ export class UmbConfirmActionModalEntityReferencesElement extends UmbLitElement const uniques = data.items.map((item) => item.unique).filter((unique) => unique) as Array; const { data: items } = await this.#itemRepository.requestItems(uniques); this._descendantsWithReferences = items ?? []; + this.dispatchEvent(new UmbChangeEvent()); } } @@ -163,8 +175,6 @@ export class UmbConfirmActionModalEntityReferencesElement extends UmbLitElement ]; } -export { UmbConfirmActionModalEntityReferencesElement as element }; - declare global { interface HTMLElementTagNameMap { 'umb-confirm-action-modal-entity-references': UmbConfirmActionModalEntityReferencesElement; diff --git a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/local-components/confirm-bulk-action-entity-references.element.ts b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/global-components/confirm-bulk-action-modal-entity-references.element.ts similarity index 93% rename from src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/local-components/confirm-bulk-action-entity-references.element.ts rename to src/Umbraco.Web.UI.Client/src/packages/relations/relations/global-components/confirm-bulk-action-modal-entity-references.element.ts index 4d07370a05..4c7f4f75b4 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/entity-actions/local-components/confirm-bulk-action-entity-references.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/global-components/confirm-bulk-action-modal-entity-references.element.ts @@ -1,4 +1,4 @@ -import type { UmbEntityReferenceRepository } from '../../reference/types.js'; +import type { UmbEntityReferenceRepository } from '../reference/types.js'; import { html, customElement, @@ -13,6 +13,12 @@ import type { UmbItemRepository } from '@umbraco-cms/backoffice/repository'; import { createExtensionApiByAlias } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; +export interface UmbConfirmBulkActionModalEntityReferencesConfig { + uniques: Array; + itemRepositoryAlias: string; + referenceRepositoryAlias: string; +} + @customElement('umb-confirm-bulk-action-modal-entity-references') export class UmbConfirmBulkActionModalEntityReferencesElement extends UmbLitElement { @property({ type: Object, attribute: false }) @@ -125,8 +131,6 @@ export class UmbConfirmBulkActionModalEntityReferencesElement extends UmbLitElem ]; } -export { UmbConfirmBulkActionModalEntityReferencesElement as element }; - declare global { interface HTMLElementTagNameMap { 'umb-confirm-bulk-action-modal-entity-references': UmbConfirmBulkActionModalEntityReferencesElement; diff --git a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/global-components/index.ts b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/global-components/index.ts new file mode 100644 index 0000000000..5c2fd4749d --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/global-components/index.ts @@ -0,0 +1,5 @@ +import './confirm-action-modal-entity-references.element.js'; +import './confirm-bulk-action-modal-entity-references.element.js'; + +export * from './confirm-action-modal-entity-references.element.js'; +export * from './confirm-bulk-action-modal-entity-references.element.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/global-components/types.ts b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/global-components/types.ts new file mode 100644 index 0000000000..44d4676fc7 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/global-components/types.ts @@ -0,0 +1,2 @@ +export type * from './confirm-action-modal-entity-references.element.js'; +export type * from './confirm-bulk-action-modal-entity-references.element.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/index.ts b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/index.ts index 52a1c94b33..6bea1f6141 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/index.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/index.ts @@ -1,6 +1,7 @@ -export * from './constants.js'; export * from './collection/index.js'; +export * from './constants.js'; export * from './entity.js'; +export * from './global-components/index.js'; export * from './utils.js'; export type * from './types.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/types.ts b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/types.ts index f82c4baafe..3306f451e1 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/relations/relations/types.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/relations/relations/types.ts @@ -1,4 +1,5 @@ import type { UmbRelationEntityType } from './entity.js'; +export type * from './global-components/types.js'; export type * from './reference/types.js'; export interface UmbRelationDetailModel {