chore: Use Form Builder banner on fields sections

frappe/core/doctype/doctype/doctype.js

@@ -21,10 +21,7 @@ frappe.ui.form.on("DocType", {
 			frm.toggle_enable("beta", 0);
 		}
 
-		!frm.is_new() &&
-			frm.add_custom_button(__("Try new form builder", [__(frm.doc.name)]), () => {
-				frappe.set_route("form-builder", frm.doc.name);
-			});
+		render_form_builder_message(frm);
 
 		if (!frm.is_new() && !frm.doc.istable) {
 			if (frm.doc.issingle) {
@@ -118,4 +115,31 @@ frappe.ui.form.on("DocField", {
 	},
 });
 
+function render_form_builder_message(frm) {
+	$(frm.fields_dict["try_form_builder_html"].wrapper).empty();
+	if (!frm.is_new() && frm.fields_dict["try_form_builder_html"]) {
+		let title = __("Use Form Builder to visually edit your form layout");
+		let msg = __(
+			"You can drag and drop fields to create your form layout, add tabs, sections and columns to organize your form and update field properties all from one screen."
+		);
+
+		let message = `
+		<div class="flex form-message blue p-3">
+			<div class="mr-3"><img style="border-radius: var(--border-radius-md)" width="360" src="/assets/frappe/images/form-builder.gif"></div>
+			<div>
+				<p style="font-size: var(--text-lg)">${title}</p>
+				<p>${msg}</p>
+				<div>
+					<a class="btn btn-primary btn-sm" href="/app/form-builder/${frm.doc.name}">
+						${__("Form Builder")} ${frappe.utils.icon("right", "xs")}
+					</a>
+				</div>
+			</div>
+		</div>
+		`;
+
+		$(frm.fields_dict["try_form_builder_html"].wrapper).html(message);
+	}
+}
+
 extend_cscript(cur_frm.cscript, new frappe.model.DocTypeController({ frm: cur_frm }));

frappe/core/doctype/doctype/doctype.json

@@ -26,6 +26,7 @@
   "is_virtual",
   "queue_in_background",
   "fields_section_break",
+  "try_form_builder_html",
   "fields",
   "sb1",
   "naming_rule",
@@ -630,6 +631,11 @@
    "fieldname": "is_calendar_and_gantt",
    "fieldtype": "Check",
    "label": "Is Calendar and Gantt"
+  },
+  {
+   "fieldname": "try_form_builder_html",
+   "fieldtype": "HTML",
+   "label": "Try Form Builder HTML"
   }
  ],
  "icon": "fa fa-bolt",
@@ -712,7 +718,7 @@
    "link_fieldname": "reference_doctype"
   }
  ],
- "modified": "2023-03-23 16:15:51.067267",
+ "modified": "2023-05-15 14:07:51.526257",
  "modified_by": "Administrator",
  "module": "Core",
  "name": "DocType",