From 74bcfa5a9fecd8e1cec9b84ffa5ce15ef0db560e Mon Sep 17 00:00:00 2001
From: m-e-l-u-h-a-n <purushottam.tiwari.cd.cse19@itbhu.ac.in>
Date: Fri, 12 May 2023 22:34:52 +0530
Subject: [PATCH] user groups: Update handling of user group add event.

Group list data in group_list_widget was not updated correctly,
on user group event as a result the group items shown on the
left panel were some times not according to the filters and selected
tab.
We make changes to appropriately update group list data of
group_list_widget on group add event and show group settings for
newly created group even in cases when the newely created group row
is not present in the left panel due to search filter or tab toggles.
---
 web/src/user_group_edit.js         | 20 +++++++++++---------
 web/src/user_groups_settings_ui.js |  5 ++---
 2 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/web/src/user_group_edit.js b/web/src/user_group_edit.js
index d8b3a6a16a..47a99736bd 100644
--- a/web/src/user_group_edit.js
+++ b/web/src/user_group_edit.js
@@ -128,8 +128,7 @@ export function update_settings_pane(group) {
     $edit_container.find(".group-description").text(group.description);
 }
 
-export function show_settings_for(node) {
-    const group = get_user_group_for_target(node);
+export function show_settings_for(group) {
     const html = render_user_group_settings({
         group,
         can_edit: can_edit(group.id),
@@ -146,7 +145,7 @@ export function show_settings_for(node) {
     show_membership_settings(group);
 }
 
-export function setup_group_settings(node) {
+export function setup_group_settings(group) {
     toggler = components.toggle({
         child_wants_focus: true,
         values: [
@@ -160,7 +159,7 @@ export function setup_group_settings(node) {
         },
     });
 
-    show_settings_for(node);
+    show_settings_for(group);
 }
 
 export function setup_group_list_tab_hash(tab_key_value) {
@@ -209,14 +208,17 @@ export function handle_deleted_group(group_id) {
     user_group_settings_ui.redraw_user_group_list();
 }
 
-export function open_group_edit_panel_for_row(group_row) {
-    const group = get_user_group_for_target(group_row);
-
+export function show_group_settings(group) {
     $(".group-row.active").removeClass("active");
     user_group_settings_ui.show_user_group_settings_pane.settings(group);
-    $(group_row).addClass("active");
+    user_group_settings_ui.row_for_group_id(group.id).addClass("active");
     setup_group_edit_hash(group);
-    setup_group_settings(group_row);
+    setup_group_settings(group);
+}
+
+export function open_group_edit_panel_for_row(group_row) {
+    const group = get_user_group_for_target(group_row);
+    show_group_settings(group);
 }
 
 export function initialize() {
diff --git a/web/src/user_groups_settings_ui.js b/web/src/user_groups_settings_ui.js
index c07227b27b..da6c5a646d 100644
--- a/web/src/user_groups_settings_ui.js
+++ b/web/src/user_groups_settings_ui.js
@@ -129,19 +129,18 @@ export function add_group_to_table(group) {
         can_edit: user_group_edit.can_edit(group.id),
     });
 
-    group_list_widget.replace_list_data(user_groups.get_realm_user_groups());
+    redraw_user_group_list();
     scroll_util
         .get_content_element($("#groups_overlay_container .settings"))
         .append($(settings_html));
 
-    // TODO: Address issue for visibility of newely created group.
     if (user_group_create.get_name() === group.name) {
         // This `user_group_create.get_name()` check tells us whether the
         // group was just created in this browser window; it's a hack
         // to work around the server_events code flow not having a
         // good way to associate with this request because the group
         // ID isn't known yet.
-        row_for_group_id(group.id).trigger("click");
+        user_group_edit.show_group_settings(group);
         user_group_create.reset_name();
     }
 }