stream_color: Extract update_stream_color to new module.

Signed-off-by: Anders Kaseorg <anders@zulip.com>

tools/test-js-with-node

@@ -198,6 +198,7 @@ EXEMPT_FILES = make_set(
         "web/src/starred_messages_ui.js",
         "web/src/stream_bar.js",
         "web/src/stream_color.js",
+        "web/src/stream_color_events.js",
         "web/src/stream_create.js",
         "web/src/stream_create_subscribers.js",
         "web/src/stream_edit.js",

web/src/stream_color.js

@@ -4,11 +4,6 @@ import mixPlugin from "colord/plugins/mix";
 import $ from "jquery";
 
 import {$t} from "./i18n";
-import * as inbox_util from "./inbox_util";
-import * as message_lists from "./message_lists";
-import * as message_view_header from "./message_view_header";
-import * as overlays from "./overlays";
-import * as row from "./rows";
 import * as settings_data from "./settings_data";
 import * as stream_data from "./stream_data";
 import * as stream_settings_ui from "./stream_settings_ui";
@@ -52,47 +47,6 @@ export function get_recipient_bar_color(color) {
         .toHex();
 }
 
-function update_table_message_recipient_stream_color(table, stream_name, recipient_bar_color) {
-    const $stream_labels = table.find(".stream_label");
-    for (const label of $stream_labels) {
-        const $label = $(label);
-        if ($label.text().trim() === stream_name) {
-            $label
-                .closest(".message_header_stream .message-header-contents")
-                .css({background: recipient_bar_color});
-        }
-    }
-}
-
-function update_stream_privacy_color(id, color) {
-    $(`.stream-privacy-original-color-${CSS.escape(id)}`).css("color", color);
-    color = get_stream_privacy_icon_color(color);
-    // `modified-color` is only used in recipient bars.
-    $(`.stream-privacy-modified-color-${CSS.escape(id)}`).css("color", color);
-}
-
-function update_message_recipient_color(stream_name, color) {
-    const recipient_color = get_recipient_bar_color(color);
-    for (const msg_list of message_lists.all_rendered_message_lists()) {
-        const $table = row.get_table(msg_list.table_name);
-        update_table_message_recipient_stream_color($table, stream_name, recipient_color);
-    }
-
-    // Update color for drafts if open.
-    if (overlays.drafts_open()) {
-        update_table_message_recipient_stream_color(
-            $(".drafts-container"),
-            stream_name,
-            recipient_color,
-        );
-    }
-
-    if (inbox_util.is_visible()) {
-        const stream_id = stream_data.get_stream_id(stream_name);
-        $(`#inbox-stream-header-${stream_id}`).css("background", recipient_color);
-    }
-}
-
 const stream_color_palette = [
     ["a47462", "c2726a", "e4523d", "e7664d", "ee7e4a", "f4ae55"],
     ["76ce90", "53a063", "94c849", "bfd56f", "fae589", "f5ce6e"],
@@ -115,34 +69,6 @@ export function set_colorpicker_color(colorpicker, color) {
     });
 }
 
-export function update_stream_color(sub, color) {
-    sub.color = color;
-    const stream_id = sub.stream_id;
-    // The swatch in the subscription row header.
-    $(`.stream-row[data-stream-id='${CSS.escape(stream_id)}'] .icon`).css(
-        "background-color",
-        color,
-    );
-    // The swatch in the color picker.
-    set_colorpicker_color(
-        $(
-            `#subscription_overlay .subscription_settings[data-stream-id='${CSS.escape(
-                stream_id,
-            )}'] .colorpicker`,
-        ),
-        color,
-    );
-    $(
-        `#subscription_overlay .subscription_settings[data-stream-id='${CSS.escape(
-            stream_id,
-        )}'] .large-icon`,
-    ).css("color", color);
-
-    update_message_recipient_color(sub.name, color);
-    update_stream_privacy_color(stream_id, color);
-    message_view_header.colorize_message_view_header();
-}
-
 export const sidebar_popover_colorpicker_options_full = {
     clickoutFiresChange: false,
     showPalette: true,

web/src/stream_color_events.js

@@ -0,0 +1,78 @@
+import $ from "jquery";
+
+import * as inbox_util from "./inbox_util";
+import * as message_lists from "./message_lists";
+import * as message_view_header from "./message_view_header";
+import * as overlays from "./overlays";
+import * as row from "./rows";
+import * as stream_color from "./stream_color";
+import * as stream_data from "./stream_data";
+
+function update_table_message_recipient_stream_color(table, stream_name, recipient_bar_color) {
+    const $stream_labels = table.find(".stream_label");
+    for (const label of $stream_labels) {
+        const $label = $(label);
+        if ($label.text().trim() === stream_name) {
+            $label
+                .closest(".message_header_stream .message-header-contents")
+                .css({background: recipient_bar_color});
+        }
+    }
+}
+
+function update_stream_privacy_color(id, color) {
+    $(`.stream-privacy-original-color-${CSS.escape(id)}`).css("color", color);
+    color = stream_color.get_stream_privacy_icon_color(color);
+    // `modified-color` is only used in recipient bars.
+    $(`.stream-privacy-modified-color-${CSS.escape(id)}`).css("color", color);
+}
+
+function update_message_recipient_color(stream_name, color) {
+    const recipient_color = stream_color.get_recipient_bar_color(color);
+    for (const msg_list of message_lists.all_rendered_message_lists()) {
+        const $table = row.get_table(msg_list.table_name);
+        update_table_message_recipient_stream_color($table, stream_name, recipient_color);
+    }
+
+    // Update color for drafts if open.
+    if (overlays.drafts_open()) {
+        update_table_message_recipient_stream_color(
+            $(".drafts-container"),
+            stream_name,
+            recipient_color,
+        );
+    }
+
+    if (inbox_util.is_visible()) {
+        const stream_id = stream_data.get_stream_id(stream_name);
+        $(`#inbox-stream-header-${stream_id}`).css("background", recipient_color);
+    }
+}
+
+export function update_stream_color(sub, color) {
+    sub.color = color;
+    const stream_id = sub.stream_id;
+    // The swatch in the subscription row header.
+    $(`.stream-row[data-stream-id='${CSS.escape(stream_id)}'] .icon`).css(
+        "background-color",
+        color,
+    );
+    // The swatch in the color picker.
+    stream_color.set_colorpicker_color(
+        $(
+            `#subscription_overlay .subscription_settings[data-stream-id='${CSS.escape(
+                stream_id,
+            )}'] .colorpicker`,
+        ),
+        color,
+    );
+    $(
+        `#subscription_overlay .subscription_settings[data-stream-id='${CSS.escape(
+            stream_id,
+        )}'] .large-icon`,
+    ).css("color", color);
+
+    update_message_recipient_color(sub.name, color);
+    update_stream_privacy_color(stream_id, color);
+    message_view_header.colorize_message_view_header();
+}

web/src/stream_events.js

@@ -12,7 +12,7 @@ import * as peer_data from "./peer_data";
 import * as people from "./people";
 import * as recent_view_ui from "./recent_view_ui";
 import * as settings_notifications from "./settings_notifications";
-import * as stream_color from "./stream_color";
+import * as stream_color_events from "./stream_color_events";
 import * as stream_data from "./stream_data";
 import * as stream_list from "./stream_list";
 import * as stream_muting from "./stream_muting";
@@ -45,7 +45,7 @@ export function update_property(stream_id, property, value, other_values) {
 
     switch (property) {
         case "color":
-            stream_color.update_stream_color(sub, value);
+            stream_color_events.update_stream_color(sub, value);
             break;
         case "in_home_view":
             // Legacy in_home_view events are only sent as duplicates of
@@ -123,7 +123,7 @@ export function mark_subscribed(sub, subscribers, color) {
     // If the backend sent us a color, use that
     if (color !== undefined && sub.color !== color) {
         sub.color = color;
-        stream_color.update_stream_color(sub, color);
+        stream_color_events.update_stream_color(sub, color);
     } else if (sub.color === undefined) {
         // If the backend didn't, and we have a color already, send
         // the backend that color.  It's not clear this code path is

web/tests/stream_events.test.js

@@ -12,7 +12,7 @@ const noop = () => {};
 
 const color_data = mock_esm("../src/color_data");
 const compose_fade = mock_esm("../src/compose_fade");
-const stream_color = mock_esm("../src/stream_color");
+const stream_color_events = mock_esm("../src/stream_color_events");
 const stream_list = mock_esm("../src/stream_list");
 const stream_muting = mock_esm("../src/stream_muting");
 const stream_settings_ui = mock_esm("../src/stream_settings_ui", {
@@ -112,7 +112,7 @@ test("update_property", ({override, override_rewire}) => {
     // Test update color
     {
         const stub = make_stub();
-        override(stream_color, "update_stream_color", stub.f);
+        override(stream_color_events, "update_stream_color", stub.f);
         stream_events.update_property(stream_id, "color", "blue");
         assert.equal(stub.num_calls, 1);
         const args = stub.get_args("sub", "val");
@@ -285,7 +285,7 @@ test("marked_subscribed (error)", () => {
 test("marked_subscribed (normal)", ({override}) => {
     const sub = {...frontend};
     stream_data.add_sub(sub);
-    override(stream_color, "update_stream_color", noop);
+    override(stream_color_events, "update_stream_color", noop);
 
     narrow_to_frontend();
 
@@ -357,7 +357,7 @@ test("marked_subscribed (color)", ({override}) => {
 test("marked_subscribed (emails)", ({override}) => {
     const sub = {...frontend};
     stream_data.add_sub(sub);
-    override(stream_color, "update_stream_color", noop);
+    override(stream_color_events, "update_stream_color", noop);
 
     // Test assigning subscriber emails
     // narrow state is undefined