Skip to content

Collection: Add table kind collection view#22163

Merged
nielslyngsoe merged 42 commits into
mainfrom
v17/feature/table-kind-collection-view
Apr 27, 2026
Merged

Collection: Add table kind collection view#22163
nielslyngsoe merged 42 commits into
mainfrom
v17/feature/table-kind-collection-view

Conversation

@madsrasmussen

@madsrasmussen madsrasmussen commented Mar 18, 2026

Copy link
Copy Markdown
Member

Description

Introduces a new table kind for collectionView manifests. This provides a reusable, declarative table-based collection view that can be used by any collection without requiring a custom element implementation for each one.

const manifest: UmbExtensionManifest = {
  type: 'collectionView',
  kind: 'table',
  alias: 'My.CollectionView.Table',
  name: 'My Table Collection View',
  meta: {
    columns: [
      { field: 'email', label: 'Email' },
      { field: 'status', label: 'Status' },
    ],
  },
  conditions: [
    {
      alias: 'Umb.Condition.CollectionAlias',
      match: 'My.Collection',
    },
  ],
};

Please pay extra attention to:

  1. The onRowRendered callback on umb-table — This is the mechanism that lets the table collection view provide a per-row context without umb-table knowing about entity contexts, entity actions, or any CMS concepts. The goal is to keep umb-table generic enough to move to the UUI Library as an "advanced table" component in the future.

  2. How the table collection view provides context — It creates an UmbElementControllerHost + UmbEntityContext per row via the onRowRendered callback, and cleans them up when rows are removed, or the component disconnects.

  3. The column solution in the kind manifest — The meta.columns array is a fast, declarative way to set up columns for known system data fields on a model. Columns reference properties by field name and display their values directly.

Known limitations

Table columns can currently only display "simple" values (strings, numbers). This is a known limitation. Similar to other generic table implementations (e.g., the Document/Media collection views) when it comes to complex/composite values. This will be addressed in a separate feature.

Deprecation: umb-entity-actions-table-column-view value property

The value property on <umb-entity-actions-table-column-view> previously accepted UmbEntityModel | UmbNamedEntityModel with entityType, unique, and name. Passing entityType and unique via value is now deprecated and will be removed in Umbraco 19. These should instead be provided via the UMB_ENTITY_CONTEXT context. The element now implements UmbTableColumnLayoutElement and only requires { name?: string } as its value. Existing consumers passing entityType and unique will continue to work but will see a runtime deprecation warning.

How to test

  1. Run the collection example (this is currently the only place the table kind is used)
  2. Verify the table view renders with name column, description column (when items have descriptions), and
    any declared manifest columns
  3. Verify entity actions work on each row (the action menu should appear and resolve the correct entity)
  4. Verify selection (single and multi-select) works

@madsrasmussen madsrasmussen added the category/dx Developer experience label Apr 8, 2026

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Adds a reusable collectionView kind (table) that renders collections using the shared <umb-table> component and enables per-row entity context provisioning (to support entity actions, selection, etc.) without requiring bespoke collection view elements.

Changes:

  • Introduces the table kind for collectionView manifests, including manifest typing and a new umb-table-collection-view implementation with manifest-driven columns.
  • Extends <umb-table> with an onRowRendered callback to allow consumers to attach per-row concerns (e.g., context provisioning).
  • Adds UmbElementControllerHost to host controllers/contexts on arbitrary DOM elements, and updates entity-actions column value handling with a deprecation path.

Reviewed changes

Copilot reviewed 24 out of 24 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
src/Umbraco.Web.UI.Client/src/packages/user/user/collection/views/manifests.ts Uses the shared UMB_USER_COLLECTION_ALIAS constant in conditions.
src/Umbraco.Web.UI.Client/src/packages/core/entity-action/global-components/entity-actions-table-column-view/entity-actions-table-column-view.element.ts Deprecates passing entityType/unique via value and adapts to table column layout API.
src/Umbraco.Web.UI.Client/src/packages/core/components/table/table.element.ts Adds onRowRendered callback hook and wires it via ref on each row.
src/Umbraco.Web.UI.Client/src/packages/core/collection/view/umb-collection-view-element-base.ts Adds a manifest property to collection view base elements for kind/meta access.
src/Umbraco.Web.UI.Client/src/packages/core/collection/view/types.ts Re-exports table-kind collection view types.
src/Umbraco.Web.UI.Client/src/packages/core/collection/view/table/types.ts Defines ManifestCollectionViewTableKind and its meta.columns contract.
src/Umbraco.Web.UI.Client/src/packages/core/collection/view/table/table-collection-view.element.ts Implements the reusable table-based collection view + per-row entity context provisioning/cleanup.
src/Umbraco.Web.UI.Client/src/packages/core/collection/view/table/table-collection-view.element.test.ts Adds tests for columns, description column behavior, per-row entity context, and selection delegation.
src/Umbraco.Web.UI.Client/src/packages/core/collection/view/table/manifests.ts Registers the collectionView kind manifest for table.
src/Umbraco.Web.UI.Client/src/packages/core/collection/view/table/entity-name-table-column-layout.element.ts Adds a table column layout for rendering entity names (optionally linked).
src/Umbraco.Web.UI.Client/src/packages/core/collection/view/manifests.ts Includes the new table kind manifests in the collection view manifests bundle.
src/Umbraco.Web.UI.Client/src/packages/core/collection/view/collection-view.manager.ts Passes the resolved manifest into the created view element via component.manifest.
src/Umbraco.Web.UI.Client/src/libs/controller-api/index.ts Exports UmbElementControllerHost from the controller-api barrel.
src/Umbraco.Web.UI.Client/src/libs/controller-api/element-controller-host.ts Introduces UmbElementControllerHost for hosting controllers/contexts on plain DOM elements.
src/Umbraco.Web.UI.Client/src/libs/controller-api/element-controller-host.test.ts Adds tests covering lifecycle and context provision behavior for UmbElementControllerHost.
src/Umbraco.Web.UI.Client/src/assets/lang/da.ts Adds Danish translation for general_description.
src/Umbraco.Web.UI.Client/examples/collection/index.ts Includes example entity actions manifests in the collection example bundle.
src/Umbraco.Web.UI.Client/examples/collection/entity-actions/manifests.ts Adds example entity action manifests used to validate per-row entity actions.
src/Umbraco.Web.UI.Client/examples/collection/entity-actions/hello.action.ts Example entity action implementation.
src/Umbraco.Web.UI.Client/examples/collection/entity-actions/goodbye.action.ts Example entity action implementation.
src/Umbraco.Web.UI.Client/examples/collection/collection/table-view/manifests.ts Switches the example table view to the new kind: 'table' manifest approach with columns meta.
src/Umbraco.Web.UI.Client/examples/collection/collection/table-view/collection-view.element.ts Removes the bespoke example table collection view element (superseded by the kind).
src/Umbraco.Web.UI.Client/examples/collection/collection/repository/types.ts Updates example collection item model to include description + status and align with shared model interfaces.
src/Umbraco.Web.UI.Client/examples/collection/collection/repository/collection.repository.ts Adds description/status sample data to demonstrate the new table view capabilities.

madsrasmussen and others added 3 commits April 8, 2026 13:01
…al-components/entity-actions-table-column-view/entity-actions-table-column-view.element.ts

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Comment thread src/Umbraco.Web.UI.Client/src/packages/core/components/table/table.element.ts Outdated

@nielslyngsoe nielslyngsoe left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A few smaller comments, generally looking good. I have not tested this, Just looked at code.

nielslyngsoe and others added 8 commits April 15, 2026 17:05
Allow onRowRendered to accept an undefined element and clean up row contexts when a row is unmounted. Update the callback signature in table.element.ts and handle the undefined case in table-collection-view.element.ts by destroying the host and removing the stored context for the item to avoid memory leaks when rows are removed.

@engijlr engijlr left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Manual test done:

  • Table renders with correct columns
  • Entity actions work per row
  • Selection checkboxes appear(only when bulk actions are registered )
  • Multi-select works
  • Pagination works
  • Selection count is accurate ("2 of 5")
Image

If you are happy with the code review, this is good to go 👍

@nielslyngsoe

Copy link
Copy Markdown
Member

We will await 17.5 for this one! so skipping 17.4

@nielslyngsoe nielslyngsoe enabled auto-merge (squash) April 24, 2026 09:42
@nielslyngsoe nielslyngsoe merged commit 03cfdb6 into main Apr 27, 2026
30 of 31 checks passed
@nielslyngsoe nielslyngsoe deleted the v17/feature/table-kind-collection-view branch April 27, 2026 18:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants