feat: support list view for "show titles instead of name" (#18060) (#…

…18681)

* initial commit

* fix: account for set_fields not being called

* fix: two links with title field with the same name: add prefix

* chore: add semicolons

* fix: only fetch for title field value for link title doctypes

* fix: linting errors

* style: formatting

[skip ci]

Co-authored-by: Raymond Reggers <raymond@adaptiv.nl>
Co-authored-by: Saqib Ansari <nextchamp.saqib@gmail.com>
(cherry picked from commit 42f6aa6)

Co-authored-by: Tom-Finke <tom.finke@webterra.de>

frappe/public/js/frappe/list/base_list.js

@@ -77,12 +77,12 @@ frappe.views.BaseList = class BaseList {
 			.then((doc) => (this.list_view_settings = doc.message || {}));
 	}
 
-	setup_fields() {
-		this.set_fields();
+	async setup_fields() {
+		await this.set_fields();
 		this.build_fields();
 	}
 
-	set_fields() {
+	async set_fields() {
 		let fields = [].concat(frappe.model.std_fields_list, this.meta.title_field);
 
 		fields.forEach((f) => this._add_field(f));

frappe/public/js/frappe/list/list_view.js

@@ -170,7 +170,18 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 		);
 	}
 
-	set_fields() {
+	get_fields() {
+		return super
+			.get_fields()
+			.concat(
+				Object.entries(this.link_field_title_fields || {}).map(
+					(entry) => entry.join(".") + " as " + entry.join("_")
+				)
+			);
+	}
+
+	async set_fields() {
+		this.link_field_title_fields = {};
 		let fields = [].concat(
 			frappe.model.std_fields_list,
 			this.get_fields_in_list_view(),
@@ -183,7 +194,34 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 			"color"
 		);
 
-		fields.forEach((f) => this._add_field(f));
+		await Promise.all(
+			fields.map((f) => {
+				return new Promise((resolve) => {
+					const df =
+						typeof f === "string" ? frappe.meta.get_docfield(this.doctype, f) : f;
+					if (
+						df &&
+						df.fieldtype == "Link" &&
+						frappe.boot.link_title_doctypes.includes(df.options)
+					) {
+						frappe.model.with_doctype(df.options, () => {
+							const meta = frappe.get_meta(df.options);
+							if (meta.show_title_field_in_link) {
+								this.link_field_title_fields[
+									typeof f === "string" ? f : f.fieldname
+								] = meta.title_field;
+							}
+
+							this._add_field(f);
+							resolve();
+						});
+					} else {
+						this._add_field(f);
+						resolve();
+					}
+				});
+			})
+		);
 
 		this.fields.forEach((f) => {
 			const df = frappe.meta.get_docfield(f[1], f[0]);
@@ -691,8 +729,11 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 		const df = col.df || {};
 		const label = df.label;
 		const fieldname = df.fieldname;
+		const link_title_fieldname = this.link_field_title_fields[fieldname];
 		const value = doc[fieldname] || "";
-
+		const value_display = link_title_fieldname
+			? doc[fieldname + "_" + link_title_fieldname] || value
+			: value;
 		const format = () => {
 			if (df.fieldtype === "Code") {
 				return value;
@@ -716,9 +757,12 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 				(df.fetch_from && ["Text", "Small Text"].includes(df.fieldtype));
 
 			if (strip_html_required) {
-				_value = strip_html(value);
+				_value = strip_html(value_display);
 			} else {
-				_value = typeof value === "string" ? frappe.utils.escape_html(value) : value;
+				_value =
+					typeof value_display === "string"
+						? frappe.utils.escape_html(value_display)
+						: value_display;
 			}
 
 			if (df.fieldtype === "Rating") {