diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/collection/action/create/collection-create-action.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/collection/action/create/collection-create-action.element.ts index 2d2f98c6d70c..ff3117613dd9 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/collection/action/create/collection-create-action.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/collection/action/create/collection-create-action.element.ts @@ -1,15 +1,14 @@ -import { html, customElement, state, ifDefined } from '@umbraco-cms/backoffice/external/lit'; -import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; -import type { UmbExtensionApiInitializer } from '@umbraco-cms/backoffice/extension-api'; -import { UmbExtensionsApiInitializer } from '@umbraco-cms/backoffice/extension-api'; +import { customElement, html, ifDefined, state } from '@umbraco-cms/backoffice/external/lit'; import { umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry'; +import { UmbExtensionsApiInitializer } from '@umbraco-cms/backoffice/extension-api'; +import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; import { UMB_ENTITY_CONTEXT } from '@umbraco-cms/backoffice/entity'; import type { ManifestEntityCreateOptionAction } from '@umbraco-cms/backoffice/entity-create-option-action'; +import type { UmbExtensionApiInitializer } from '@umbraco-cms/backoffice/extension-api'; type ManifestType = ManifestEntityCreateOptionAction; -const elementName = 'umb-collection-create-action-button'; -@customElement(elementName) +@customElement('umb-collection-create-action-button') export class UmbCollectionCreateActionButtonElement extends UmbLitElement { @state() private _popoverOpen = false; @@ -58,7 +57,7 @@ export class UmbCollectionCreateActionButtonElement extends UmbLitElement { if (!this.#entityContext) return; const entityType = this.#entityContext.getEntityType(); - if (!entityType) throw new Error('No entityType found'); + if (!entityType) throw new Error('No entity type found'); const unique = this.#entityContext.getUnique(); if (unique === undefined) throw new Error('No unique found'); @@ -93,11 +92,16 @@ export class UmbCollectionCreateActionButtonElement extends UmbLitElement { } #renderSingleOptionAction() { - return html` this.#onClick(event, this._apiControllers[0])}>`; + const href = this._hrefList[0]; + return html` + this.#onClick(event, this._apiControllers[0], href)}> + `; } #renderMultiOptionAction() { @@ -139,9 +143,9 @@ export class UmbCollectionCreateActionButtonElement extends UmbLitElement { return html` this.#onClick(event, controller, href)} href=${ifDefined(href)} - target=${this.#getTarget(href)}> + target=${this.#getTarget(href)} + @click=${(event: Event) => this.#onClick(event, controller, href)}> `; @@ -152,6 +156,6 @@ export { UmbCollectionCreateActionButtonElement as element }; declare global { interface HTMLElementTagNameMap { - [elementName]: UmbCollectionCreateActionButtonElement; + 'umb-collection-create-action-button': UmbCollectionCreateActionButtonElement; } } diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/constants.ts index 8e60cb02fadf..6a7f64eed00f 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/constants.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/constants.ts @@ -1,4 +1,5 @@ export * from './entity-actions/constants.js'; +export * from './member-type-root/constants.js'; export * from './paths.js'; export * from './property-type/constants.js'; export * from './repository/constants.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/entity-actions/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/entity-actions/manifests.ts index 276b0d5545ca..5710fdf91446 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/entity-actions/manifests.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/entity-actions/manifests.ts @@ -1,7 +1,7 @@ import { UMB_MEMBER_TYPE_DETAIL_REPOSITORY_ALIAS, UMB_MEMBER_TYPE_ITEM_REPOSITORY_ALIAS } from '../constants.js'; import { UMB_MEMBER_TYPE_ENTITY_TYPE } from '../entity.js'; -import { manifests as duplicateManifests } from './duplicate/manifests.js'; import { manifests as createManifests } from './create/manifests.js'; +import { manifests as duplicateManifests } from './duplicate/manifests.js'; import type { UmbExtensionManifestKind } from '@umbraco-cms/backoffice/extension-registry'; export const manifests: Array = [ diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/entity.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/entity.ts index 10e66dffa20b..d0ad010ae119 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/entity.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/entity.ts @@ -1,5 +1,5 @@ -export const UMB_MEMBER_TYPE_ROOT_ENTITY_TYPE = 'member-type-root'; export const UMB_MEMBER_TYPE_ENTITY_TYPE = 'member-type'; +export const UMB_MEMBER_TYPE_ROOT_ENTITY_TYPE = 'member-type-root'; export type UmbMemberTypeEntityType = typeof UMB_MEMBER_TYPE_ENTITY_TYPE; export type UmbMemberTypeRootEntityType = typeof UMB_MEMBER_TYPE_ROOT_ENTITY_TYPE; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/index.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/index.ts index f915f28bd536..01796948998e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/index.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/index.ts @@ -2,8 +2,10 @@ import './components/index.js'; export * from './components/index.js'; export * from './constants.js'; +export * from './member-type-root/index.js'; export * from './modal/member-type-picker-modal.token.js'; export * from './repository/index.js'; export * from './tree/index.js'; export * from './workspace/constants.js'; + export type * from './types.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/manifests.ts index ba33f43db6f2..7b4d70b7bcdd 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/manifests.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/manifests.ts @@ -1,16 +1,19 @@ import { manifests as entityActionsManifests } from './entity-actions/manifests.js'; +import { manifests as memberTypeRootManifests } from './member-type-root/manifests.js'; import { manifests as menuManifests } from './menu/manifests.js'; import { manifests as propertyTypeManifests } from './property-type/manifests.js'; import { manifests as repositoryManifests } from './repository/manifests.js'; import { manifests as searchManifests } from './search/manifests.js'; import { manifests as treeManifests } from './tree/manifests.js'; import { manifests as workspaceManifests } from './workspace/manifests.js'; + import type { UmbExtensionManifestKind } from '@umbraco-cms/backoffice/extension-registry'; import './components/index.js'; export const manifests: Array = [ ...entityActionsManifests, + ...memberTypeRootManifests, ...menuManifests, ...propertyTypeManifests, ...repositoryManifests, diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/member-type-root/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/member-type-root/constants.ts new file mode 100644 index 000000000000..cb323ab54810 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/member-type-root/constants.ts @@ -0,0 +1 @@ +export const UMB_MEMBER_TYPE_ROOT_WORKSPACE_ALIAS = 'Umb.Workspace.MemberType.Root'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/member-type-root/index.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/member-type-root/index.ts new file mode 100644 index 000000000000..4f07201dcf0a --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/member-type-root/index.ts @@ -0,0 +1 @@ +export * from './constants.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/member-type-root/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/member-type-root/manifests.ts new file mode 100644 index 000000000000..4de50eab76a2 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/member-type-root/manifests.ts @@ -0,0 +1,14 @@ +import { UMB_MEMBER_TYPE_ROOT_ENTITY_TYPE } from '../entity.js'; + +export const manifests: Array = [ + { + type: 'workspace', + kind: 'default', + alias: 'Umb.Workspace.MemberType.Root', + name: 'Member Type Root Workspace', + meta: { + entityType: UMB_MEMBER_TYPE_ROOT_ENTITY_TYPE, + headline: '#treeHeaders_memberTypes', + }, + }, +]; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/constants.ts index 633623b44c80..0cde4d40c251 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/constants.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/constants.ts @@ -1,4 +1,7 @@ export const UMB_MEMBER_TYPE_TREE_REPOSITORY_ALIAS = 'Umb.Repository.MemberType.Tree'; export const UMB_MEMBER_TYPE_TREE_STORE_ALIAS = 'Umb.Store.MemberType.Tree'; export const UMB_MEMBER_TYPE_TREE_ALIAS = 'Umb.Tree.MemberType'; + export { UMB_MEMBER_TYPE_TREE_STORE_CONTEXT } from './member-type-tree.store.context-token.js'; + +export * from './tree-item-children/constants.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/manifests.ts index 934c8a43cfdb..8a2cb18e7688 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/manifests.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/manifests.ts @@ -1,10 +1,12 @@ +import { UMB_MEMBER_TYPE_ROOT_WORKSPACE_ALIAS } from '../constants.js'; import { UMB_MEMBER_TYPE_ENTITY_TYPE, UMB_MEMBER_TYPE_ROOT_ENTITY_TYPE } from '../entity.js'; import { UMB_MEMBER_TYPE_TREE_ALIAS, + UMB_MEMBER_TYPE_TREE_ITEM_CHILDREN_COLLECTION_ALIAS, UMB_MEMBER_TYPE_TREE_REPOSITORY_ALIAS, UMB_MEMBER_TYPE_TREE_STORE_ALIAS, } from './constants.js'; -import { manifests as reloadTreeItemChildrenManifest } from './reload-tree-item-children/manifests.js'; +import { manifests as treeItemChildrenManifest } from './tree-item-children/manifests.js'; export const manifests: Array = [ { @@ -36,14 +38,22 @@ export const manifests: Array = [ forEntityTypes: [UMB_MEMBER_TYPE_ROOT_ENTITY_TYPE, UMB_MEMBER_TYPE_ENTITY_TYPE], }, { - type: 'workspace', - kind: 'default', - alias: 'Umb.Workspace.MemberType.Root', - name: 'Member Type Root Workspace', + type: 'workspaceView', + kind: 'collection', + alias: 'Umb.WorkspaceView.MemberType.TreeItemChildrenCollection', + name: 'Member Type Tree Item Children Collection Workspace View', meta: { - entityType: UMB_MEMBER_TYPE_ROOT_ENTITY_TYPE, - headline: '#treeHeaders_memberTypes', + label: '#general_design', + pathname: 'design', + icon: 'icon-member-dashed-line', + collectionAlias: UMB_MEMBER_TYPE_TREE_ITEM_CHILDREN_COLLECTION_ALIAS, }, + conditions: [ + { + alias: 'Umb.Condition.WorkspaceAlias', + oneOf: [UMB_MEMBER_TYPE_ROOT_WORKSPACE_ALIAS], + }, + ], }, - ...reloadTreeItemChildrenManifest, + ...treeItemChildrenManifest, ]; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/action/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/action/manifests.ts new file mode 100644 index 000000000000..90c8c4e812ac --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/action/manifests.ts @@ -0,0 +1,17 @@ +import { UMB_MEMBER_TYPE_TREE_ITEM_CHILDREN_COLLECTION_ALIAS } from '../constants.js'; +import { UMB_COLLECTION_ALIAS_CONDITION } from '@umbraco-cms/backoffice/collection'; + +export const manifests: Array = [ + { + type: 'collectionAction', + kind: 'create', + alias: 'Umb.CollectionAction.MemberTypeTreeItemChildren.Create', + name: 'Member Type Tree Item Children Collection Create Action', + conditions: [ + { + alias: UMB_COLLECTION_ALIAS_CONDITION, + match: UMB_MEMBER_TYPE_TREE_ITEM_CHILDREN_COLLECTION_ALIAS, + }, + ], + }, +]; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/constants.ts new file mode 100644 index 000000000000..aa5532645107 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/constants.ts @@ -0,0 +1,2 @@ +export const UMB_MEMBER_TYPE_TREE_ITEM_CHILDREN_COLLECTION_ALIAS = 'Umb.Collection.MemberType.TreeItemChildren'; +export * from './repository/constants.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/index.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/index.ts new file mode 100644 index 000000000000..6c11f6abbb12 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/index.ts @@ -0,0 +1,2 @@ +export * from './constants.js'; +export * from './repository/index.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/manifests.ts new file mode 100644 index 000000000000..14e0e4773d50 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/manifests.ts @@ -0,0 +1,20 @@ +import { manifests as actionManifests } from './action/manifests.js'; +import { manifests as repositoryManifests } from './repository/manifests.js'; +import { manifests as viewManifests } from './views/manifests.js'; +import { UMB_MEMBER_TYPE_TREE_ITEM_CHILDREN_COLLECTION_ALIAS } from './constants.js'; +import { UMB_MEMBER_TYPE_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS } from './repository/index.js'; + +export const manifests: Array = [ + { + type: 'collection', + kind: 'default', + alias: UMB_MEMBER_TYPE_TREE_ITEM_CHILDREN_COLLECTION_ALIAS, + name: 'Member Type Tree Item Children Collection', + meta: { + repositoryAlias: UMB_MEMBER_TYPE_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS, + }, + }, + ...actionManifests, + ...repositoryManifests, + ...viewManifests, +]; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/repository/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/repository/constants.ts new file mode 100644 index 000000000000..762ac96a0d8c --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/repository/constants.ts @@ -0,0 +1,2 @@ +export const UMB_MEMBER_TYPE_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS = + 'Umb.Repository.MemberType.TreeItemChildrenCollection'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/repository/index.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/repository/index.ts new file mode 100644 index 000000000000..4f07201dcf0a --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/repository/index.ts @@ -0,0 +1 @@ +export * from './constants.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/repository/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/repository/manifests.ts new file mode 100644 index 000000000000..39db72543e2a --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/repository/manifests.ts @@ -0,0 +1,10 @@ +import { UMB_MEMBER_TYPE_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS } from './constants.js'; + +export const manifests: Array = [ + { + type: 'repository', + alias: UMB_MEMBER_TYPE_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS, + name: 'Member Type Tree Item Children Collection Repository', + api: () => import('./member-type-tree-item-children-collection.repository.js'), + }, +]; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/repository/member-type-tree-item-children-collection.repository.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/repository/member-type-tree-item-children-collection.repository.ts new file mode 100644 index 000000000000..2c45abe32690 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/repository/member-type-tree-item-children-collection.repository.ts @@ -0,0 +1,33 @@ +import { UmbMemberTypeTreeRepository } from '../../../member-type-tree.repository.js'; +import type { UmbCollectionFilterModel, UmbCollectionRepository } from '@umbraco-cms/backoffice/collection'; +import { UmbRepositoryBase } from '@umbraco-cms/backoffice/repository'; +import { UMB_ENTITY_CONTEXT, type UmbEntityModel } from '@umbraco-cms/backoffice/entity'; + +export class UmbMemberTypeTreeItemChildrenCollectionRepository + extends UmbRepositoryBase + implements UmbCollectionRepository +{ + #treeRepository = new UmbMemberTypeTreeRepository(this); + + async requestCollection(filter: UmbCollectionFilterModel) { + // TODO: get parent from args + const entityContext = await this.getContext(UMB_ENTITY_CONTEXT); + if (!entityContext) throw new Error('Entity context not found'); + + const entityType = entityContext.getEntityType(); + const unique = entityContext.getUnique(); + + if (!entityType) throw new Error('Entity type not found'); + if (unique === undefined) throw new Error('Unique not found'); + + const parent: UmbEntityModel = { entityType, unique }; + + if (parent.unique === null) { + return this.#treeRepository.requestTreeRootItems({ skip: filter.skip, take: filter.take }); + } else { + return this.#treeRepository.requestTreeItemsOf({ parent, skip: filter.skip, take: filter.take }); + } + } +} + +export { UmbMemberTypeTreeItemChildrenCollectionRepository as api }; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/types.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/types.ts new file mode 100644 index 000000000000..151a3f56eb4e --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/types.ts @@ -0,0 +1,6 @@ +import type { UmbCollectionFilterModel } from '@umbraco-cms/backoffice/collection'; +import type { UmbEntityModel } from '@umbraco-cms/backoffice/entity'; + +export interface UmbMemberTypeTreeItemChildrenCollectionFilterModel extends UmbCollectionFilterModel { + parent: UmbEntityModel; +} diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/views/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/views/manifests.ts new file mode 100644 index 000000000000..3ed1b0dfe92e --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/views/manifests.ts @@ -0,0 +1,23 @@ +import { UMB_MEMBER_TYPE_TREE_ITEM_CHILDREN_COLLECTION_ALIAS } from '../constants.js'; +import { UMB_COLLECTION_ALIAS_CONDITION } from '@umbraco-cms/backoffice/collection'; + +export const manifests: Array = [ + { + type: 'collectionView', + alias: 'Umb.CollectionView.MemberType.TreeItem.Table', + name: 'Member Type Tree Item Table Collection View', + element: () => import('./member-type-tree-item-table-collection-view.element.js'), + weight: 300, + meta: { + label: 'Table', + icon: 'icon-list', + pathName: 'table', + }, + conditions: [ + { + alias: UMB_COLLECTION_ALIAS_CONDITION, + match: UMB_MEMBER_TYPE_TREE_ITEM_CHILDREN_COLLECTION_ALIAS, + }, + ], + }, +]; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/views/member-type-tree-item-table-collection-view.element.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/views/member-type-tree-item-table-collection-view.element.ts new file mode 100644 index 000000000000..07835f8c69bf --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/collection/views/member-type-tree-item-table-collection-view.element.ts @@ -0,0 +1,121 @@ +import { UMB_EDIT_MEMBER_TYPE_WORKSPACE_PATH_PATTERN } from '../../../../paths.js'; +import type { UmbMemberTypeTreeItemModel } from '../../../types.js'; +import type { UmbDefaultCollectionContext } from '@umbraco-cms/backoffice/collection'; +import { UMB_COLLECTION_CONTEXT } from '@umbraco-cms/backoffice/collection'; +import type { UmbTableColumn, UmbTableConfig, UmbTableItem } from '@umbraco-cms/backoffice/components'; +import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit'; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; +import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; +import { UmbModalRouteRegistrationController, type UmbModalRouteBuilder } from '@umbraco-cms/backoffice/router'; +import { UMB_WORKSPACE_MODAL } from '@umbraco-cms/backoffice/workspace'; + +@customElement('umb-member-type-tree-item-table-collection-view') +export class UmbMemberTypeTreeItemTableCollectionViewElement extends UmbLitElement { + @state() + private _tableConfig: UmbTableConfig = { + allowSelection: false, + }; + + @state() + private _tableColumns: Array = [ + { + name: 'Name', + alias: 'name', + }, + { + name: '', + alias: 'entityActions', + align: 'right', + }, + ]; + + @state() + private _tableItems: Array = []; + + #collectionContext?: UmbDefaultCollectionContext; + #routeBuilder?: UmbModalRouteBuilder; + + constructor() { + super(); + + this.consumeContext(UMB_COLLECTION_CONTEXT, (instance) => { + this.#collectionContext = instance; + }); + + this.#registerModalRoute(); + } + + #registerModalRoute() { + new UmbModalRouteRegistrationController(this, UMB_WORKSPACE_MODAL) + .addAdditionalPath(':entityType') + .onSetup((params) => { + return { data: { entityType: params.entityType, preset: {} } }; + }) + .observeRouteBuilder((routeBuilder) => { + this.#routeBuilder = routeBuilder; + + // NOTE: Configuring the observations AFTER the route builder is ready, + // otherwise there is a race condition and `#collectionContext.items` tends to win. [LK] + this.#observeCollectionItems(); + }); + } + + #observeCollectionItems() { + if (!this.#collectionContext) return; + this.observe(this.#collectionContext.items, (items) => this.#createTableItems(items), 'umbCollectionItemsObserver'); + } + + #createTableItems(items: Array) { + const routeBuilder = this.#routeBuilder; + if (!routeBuilder) throw new Error('Route builder not ready'); + + this._tableItems = items.map((item) => { + const modalEditPath = + routeBuilder({ entityType: item.entityType }) + + UMB_EDIT_MEMBER_TYPE_WORKSPACE_PATH_PATTERN.generateLocal({ unique: item.unique }); + + return { + id: item.unique, + icon: item.icon, + data: [ + { + columnAlias: 'name', + value: html``, + }, + { + columnAlias: 'entityActions', + value: html``, + }, + ], + }; + }); + } + + override render() { + return html` + + `; + } + + static override styles = [ + UmbTextStyles, + css` + :host { + display: flex; + flex-direction: column; + } + `, + ]; +} + +export { UmbMemberTypeTreeItemTableCollectionViewElement as element }; + +declare global { + interface HTMLElementTagNameMap { + 'umb-member-type-tree-item-table-collection-view': UmbMemberTypeTreeItemTableCollectionViewElement; + } +} diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/constants.ts new file mode 100644 index 000000000000..d7b529d49c8c --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/constants.ts @@ -0,0 +1 @@ +export * from './collection/constants.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/manifests.ts new file mode 100644 index 000000000000..b6ea5ab54edd --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/manifests.ts @@ -0,0 +1,4 @@ +import { manifests as collectionManifests } from './collection/manifests.js'; +import { manifests as reloadEntityActionManifests } from './reload-entity-action/manifests.js'; + +export const manifests: Array = [...collectionManifests, ...reloadEntityActionManifests]; diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/reload-tree-item-children/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/reload-entity-action/manifests.ts similarity index 81% rename from src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/reload-tree-item-children/manifests.ts rename to src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/reload-entity-action/manifests.ts index b7337fbfb73f..79301de8d825 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/reload-tree-item-children/manifests.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/tree/tree-item-children/reload-entity-action/manifests.ts @@ -1,4 +1,4 @@ -import { UMB_MEMBER_TYPE_ROOT_ENTITY_TYPE } from '../../entity.js'; +import { UMB_MEMBER_TYPE_ROOT_ENTITY_TYPE } from '../../../entity.js'; export const manifests: Array = [ { diff --git a/src/Umbraco.Web.UI.Client/src/packages/members/member-type/workspace/index.ts b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/workspace/index.ts new file mode 100644 index 000000000000..253402013a8a --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/members/member-type/workspace/index.ts @@ -0,0 +1,2 @@ +export * from './member-type-workspace.context-token.js'; +export * from './constants.js';