fix(ux): list view bulk operations

- disable realtime list update when bulk action is being executed
- clear checked items after bulk action is completed

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

@@ -312,7 +312,7 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 		let $check_all_checkbox = this.$checkbox_actions.find(".list-check-all");
 
 		if ($check_all_checkbox.prop("checked") && target && !target.prop("checked")) {
-			$check_all_checkbox.prop("checked", false); 
+			$check_all_checkbox.prop("checked", false);
 		}
 
 		$check_all_checkbox.prop("checked", this.$checks.length === this.data.length);
@@ -1317,7 +1317,7 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 			return;
 		}
 		frappe.realtime.on("list_update", (data) => {
-			if (this.filter_area.is_being_edited()) {
+			if (this.avoid_realtime_update()) {
 				return;
 			}
 
@@ -1379,6 +1379,19 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 		});
 	}
 
+	avoid_realtime_update() {
+		if (this.filter_area.is_being_edited()) {
+			return true;
+		}
+		// this is set when a bulk operation is called from a list view which might update the list view
+		// this is to avoid the list view from refreshing a lot of times
+		// the list view is updated once after the bulk operation is complete
+		if (this.disable_list_update) {
+			return true;
+		}
+		return false;
+	}
+
 	set_rows_as_checked() {
 		$.each(this.$checks, (i, el) => {
 			let docname = $(el).attr("data-name");
@@ -1433,6 +1446,11 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 		return this.data.filter((d) => docnames.includes(d.name));
 	}
 
+	clear_checked_items() {
+		this.$checks && this.$checks.prop("checked", false);
+		this.on_row_checked();
+	}
+
 	save_view_user_settings(obj) {
 		return frappe.model.user_settings.save(
 			this.doctype,
@@ -1655,11 +1673,17 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 		const bulk_assignment = () => {
 			return {
 				label: __("Assign To"),
-				action: () =>
+				action: () => {
+					this.disable_list_update = true;
 					bulk_operations.assign(
 						this.get_checked_items(true),
-						this.refresh
-					),
+						() => {
+							this.disable_list_update = false;
+							this.clear_checked_items();
+							this.refresh();
+						}
+					)
+				},
 				standard: true,
 			};
 		};
@@ -1667,11 +1691,17 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 		const bulk_assignment_rule = () => {
 			return {
 				label: __("Apply Assignment Rule"),
-				action: () =>
+				action: () => {
+					this.disable_list_update = true;
 					bulk_operations.apply_assignment_rule(
 						this.get_checked_items(true),
-						this.refresh
-					),
+						() => {
+							this.disable_list_update = false;
+							this.clear_checked_items();
+							this.refresh();
+						}
+					)
+				},
 				standard: true,
 			};
 		};
@@ -1679,11 +1709,17 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 		const bulk_add_tags = () => {
 			return {
 				label: __("Add Tags"),
-				action: () =>
+				action: () => {
+					this.disable_list_update = true;
 					bulk_operations.add_tags(
 						this.get_checked_items(true),
-						this.refresh
-					),
+						() => {
+							this.disable_list_update = false;
+							this.clear_checked_items();
+							this.refresh();
+						}
+					)
+				},
 				standard: true,
 			};
 		};
@@ -1705,7 +1741,14 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 					);
 					frappe.confirm(
 						__("Delete {0} items permanently?", [docnames.length]),
-						() => bulk_operations.delete(docnames, this.refresh)
+						() => {
+							this.disable_list_update = true;
+							bulk_operations.delete(docnames, () => {
+								this.disable_list_update = false;
+								this.clear_checked_items();
+								this.refresh();
+							});
+						}
 					);
 				},
 				standard: true,
@@ -1720,13 +1763,18 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 					if (docnames.length > 0) {
 						frappe.confirm(
 							__("Cancel {0} documents?", [docnames.length]),
-							() =>
+							() => {
+								this.disable_list_update = true;
 								bulk_operations.submit_or_cancel(
 									docnames,
 									"cancel",
-									this.refresh
+									() => {
+										this.disable_list_update = false;
+										this.clear_checked_items();
+										this.refresh();
+									}
 								)
-						);
+							});
 					}
 				},
 				standard: true,
@@ -1741,12 +1789,18 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 					if (docnames.length > 0) {
 						frappe.confirm(
 							__("Submit {0} documents?", [docnames.length]),
-							() =>
+							() => {
+								this.disable_list_update = true;
 								bulk_operations.submit_or_cancel(
 									docnames,
 									"submit",
-									this.refresh
+									() => {
+										this.disable_list_update = false;
+										this.clear_checked_items();
+										this.refresh();
+									}
 								)
+							}
 						);
 					}
 				},
@@ -1769,12 +1823,15 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 						}
 					});
 
-					const docnames = this.get_checked_items(true);
-
+					this.disable_list_update = true;
 					bulk_operations.edit(
-						docnames,
+						this.get_checked_items(true),
 						field_mappings,
-						this.refresh
+						() => {
+							this.disable_list_update = false;
+							this.clear_checked_items();
+							this.refresh();
+						}
 					);
 				},
 				standard: true,