stream_settings: Add live update code for can-remove-subscribers-group.

This commit adds code to live update the UI element for
can_remove_subscribers_group setting.

static/js/stream_data.js

@@ -462,6 +462,10 @@ export function update_message_retention_setting(sub, message_retention_days) {
     sub.message_retention_days = message_retention_days;
 }
 
+export function update_can_remove_subscribers_group_id(sub, can_remove_subscribers_group_id) {
+    sub.can_remove_subscribers_group_id = can_remove_subscribers_group_id;
+}
+
 export function receives_notifications(stream_id, notification_name) {
     const sub = sub_store.get(stream_id);
     if (sub === undefined) {

static/js/stream_edit_subscribers.js

@@ -2,6 +2,7 @@ import $ from "jquery";
 
 import render_unsubscribe_private_stream_modal from "../templates/confirm_dialog/confirm_unsubscribe_private_stream.hbs";
 import render_stream_member_list_entry from "../templates/stream_settings/stream_member_list_entry.hbs";
+import render_stream_members from "../templates/stream_settings/stream_members.hbs";
 import render_stream_subscription_request_result from "../templates/stream_settings/stream_subscription_request_result.hbs";
 
 import * as add_subscribers_pill from "./add_subscribers_pill";
@@ -15,6 +16,7 @@ import * as peer_data from "./peer_data";
 import * as people from "./people";
 import * as settings_data from "./settings_data";
 import * as stream_data from "./stream_data";
+import * as stream_settings_containers from "./stream_settings_containers";
 import * as sub_store from "./sub_store";
 import * as subscriber_api from "./subscriber_api";
 import * as ui from "./ui";
@@ -308,6 +310,43 @@ function update_subscribers_list_widget(subscriber_ids) {
     subscribers_list_widget.replace_list_data(users);
 }
 
+export function rerender_subscribers_list(sub) {
+    if (!hash_util.is_editing_stream(sub.stream_id)) {
+        blueslip.info("ignoring subscription for stream that is no longer being edited");
+        return;
+    }
+
+    if (sub.stream_id !== current_stream_id) {
+        // This should never happen if the prior check works correctly.
+        blueslip.error("current_stream_id does not match sub.stream_id for some reason");
+        return;
+    }
+
+    if (!stream_data.can_view_subscribers(sub)) {
+        return;
+    }
+
+    const user_ids = peer_data.get_subscribers(sub.stream_id);
+    const user_can_remove_subscribers = stream_data.can_unsubscribe_others(sub);
+    const $parent_container = stream_settings_containers
+        .get_edit_container(sub)
+        .find(".edit_subscribers_for_stream");
+
+    $parent_container.html(
+        render_stream_members({
+            can_access_subscribers: true,
+            can_remove_subscribers: user_can_remove_subscribers,
+            render_subscribers: sub.render_subscribers,
+        }),
+    );
+    subscribers_list_widget = make_list_widget({
+        $parent_container,
+        name: "stream_subscribers",
+        user_ids,
+        user_can_remove_subscribers,
+    });
+}
+
 export function initialize() {
     add_subscribers_pill.set_up_handlers({
         get_pill_widget: () => pill_widget,

static/js/stream_events.js

@@ -90,6 +90,9 @@ export function update_property(stream_id, property, value, other_values) {
         case "message_retention_days":
             stream_settings_ui.update_message_retention_setting(sub, value);
             break;
+        case "can_remove_subscribers_group_id":
+            stream_settings_ui.update_can_remove_subscribers_group_id(sub, value);
+            break;
         default:
             blueslip.warn("Unexpected subscription property type", {
                 property,

static/js/stream_settings_ui.js

@@ -241,6 +241,12 @@ export function update_message_retention_setting(sub, new_value) {
     stream_ui_updates.update_setting_element(sub, "message_retention_days");
 }
 
+export function update_can_remove_subscribers_group_id(sub, new_value) {
+    stream_data.update_can_remove_subscribers_group_id(sub, new_value);
+    stream_ui_updates.update_setting_element(sub, "can_remove_subscribers_group_id");
+    stream_edit_subscribers.rerender_subscribers_list(sub);
+}
+
 export function set_color(stream_id, color) {
     const sub = sub_store.get(stream_id);
     stream_edit.set_stream_property(sub, "color", color);