Frappe Version 16 Tree view label

Frappe Framework
, ,
1

Hi everyone,

I’m facing an issue after upgrading Frappe from v15 to v16 related to the Tree View.

In v16, the tree node label seems to be rendered strictly from name, while in v15 I was able to customize the displayed label by modifying the query / logic to concatenate additional fields.

In v15, I customized the node label using the following SQL logic:

CONCAT(
	order_node,
	'. ',
	(CASE
		WHEN IFNULL({field}, '') = ''
		THEN ''
		ELSE CONCAT('[', {field}, '] ')
	END),
	(CASE
		WHEN is_group = 1 THEN {field}
		ELSE {field}
	END),
	'<span id="naming_node" style="display: none;">',
	name,
	'</span>'
)

This allowed me to display a custom label in the Tree View while still keeping the original name internally.

However, in v16, the Tree View rendering seems to rely on node.label, which is used directly in the standard code:

make_icon_and_label(node) {
	let icon_html = "";
	if (this.icon_set) {
		if (node.expandable) {
			icon_html = `<span class="node-parent">${this.icon_set.closed}</span>`;
		} else {
			icon_html = `<span>${this.icon_set.leaf}</span>`;
		}
	}

	$(icon_html).appendTo(node.$tree_link);
	$(
		`<a class="tree-label" data-doctype="${this.args.doctype}" data-name="${
			node.label
		}"> ${this.get_node_label(node)}</a>`
	).appendTo(node.$tree_link);

	node.$tree_link.on("click", () => {
		setTimeout(() => {
			this.on_node_click(node);
		}, 100);
	});

	node.$tree_link.hover(
		function () {
			$(this).parent().addClass("hover-active");
		},
		function () {
			$(this).parent().removeClass("hover-active");
		}
	);
}

Because of this change, my previous customization no longer works as expected after upgrading to v16.

My question is:
In Frappe v16, what is the recommended way to customize the Tree View node label so that:

  • A custom / formatted label can be displayed in the UI, and

  • The original name (naming) is still preserved and accessible (for example, to be used in get_children or other Tree View operations)

In v15, I was able to embed the name alongside the custom label (e.g. via a hidden span) so Tree View logic like get_children continued to work correctly.
Is there an equivalent or best-practice approach for achieving this in v16?

Any guidance or best practices would be greatly appreciated.
Thanks in advance :folded_hands: