Skip to content

Item - detail bug when grid has parent component #1299

Description

@kravcik

The problem occurs when a Grid is used in the component. The item detail view stops working because it no longer matches the full name. I'm not sure what the right approach is yet, but as a temporary workaround, the following Composer patch can be used to alter the code.

diff --git a/assets/plugins/features/item-detail.ts b/assets/plugins/features/item-detail.ts
index fed8d9f..c3eaeed 100644
--- a/assets/plugins/features/item-detail.ts
+++ b/assets/plugins/features/item-detail.ts
@@ -5,7 +5,13 @@ export class ItemDetailPlugin implements DatagridPlugin {
 	onDatagridInit(datagrid: Datagrid): boolean {
 		datagrid.el.querySelectorAll<HTMLElement>("[data-toggle-detail-grid]")
 			.forEach((el) => {
-				if (el.getAttribute("data-toggle-detail-grid") !== datagrid.name) return;
+				// datagrid.name is resolved from data-datagrid-name, which the template renders as the
+				// component full name. data-toggle-detail-grid holds the plain component name, so for a
+				// datagrid nested in another component the two never match and the detail never toggles.
+				const gridName = el.getAttribute("data-toggle-detail-grid-fullname")
+					?? el.getAttribute("data-toggle-detail-grid");
+
+				if (gridName !== datagrid.name) return;
 				const toggleId = el.getAttribute("data-toggle-detail")!;

Metadata

Metadata

Assignees

No one assigned

    Labels

    T: BugIssue Type Bug

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions