pm_list: Set active-sub-filter in template.

Instead of doing various ad-hoc calculations of
which PM is "active" and plumbing it through various
functions and then updating it via jQuery instead of
just the template, we now just calculate `is_active`
in `_build_private_messages_list` with a little
helper function.

frontend_tests/node_tests/pm_list.js

@@ -56,11 +56,6 @@ global.people.add_in_realm(me);
 global.people.add_in_realm(bot_test);
 global.people.initialize_current_user(me.user_id);
 
-run_test('get_conversation_li', () => {
-    const test_conversation = 'foo@example.com,bar@example.com'; // people.js
-    pm_list.get_conversation_li(test_conversation);
-});
-
 run_test('close', () => {
     let collapsed;
     $('#private-container').empty = function () {
@@ -85,6 +80,7 @@ run_test('build_private_messages_list', () => {
         template_data = data;
     });
 
+    narrow_state.filter = () => {};
     pm_list._build_private_messages_list();
 
     const expected_data = {
@@ -94,6 +90,7 @@ run_test('build_private_messages_list', () => {
                 user_ids_string: '101,102',
                 unread: 1,
                 is_zero: false,
+                is_active: false,
                 url: '#narrow/pm-with/101,102-group',
                 user_circle_class: 'user_circle_fraction',
                 fraction_present: undefined,
@@ -139,6 +136,7 @@ run_test('build_private_messages_list_bot', () => {
                 user_ids_string: '314',
                 unread: 1,
                 is_zero: false,
+                is_active: false,
                 url: '#narrow/pm-with/314-outgoingwebhook',
                 user_circle_class: 'user_circle_green',
                 fraction_present: undefined,
@@ -149,6 +147,7 @@ run_test('build_private_messages_list_bot', () => {
                 user_ids_string: '101,102',
                 unread: 1,
                 is_zero: false,
+                is_active: false,
                 url: '#narrow/pm-with/101,102-group',
                 user_circle_class: 'user_circle_fraction',
                 fraction_present: undefined,
@@ -214,7 +213,7 @@ run_test('update_dom_with_unread_counts', () => {
     assert.equal(child_value.text(), '');
     assert.equal(total_value.text(), '');
 
-    const pm_li = pm_list.get_conversation_li("alice@zulip.com,bob@zulip.com");
+    const pm_li = pm_list.get_li_for_user_ids_string("101,102");
     pm_li.find = function (sel) {
         assert.equal(sel, '.private_message_count');
         return {find: function (sel) {
@@ -227,3 +226,32 @@ run_test('update_dom_with_unread_counts', () => {
     assert.equal(child_value.text(), '');
     assert.equal(total_value.text(), '');
 });
+
+run_test('get_active_user_ids_string', () => {
+    narrow_state.filter = () => {};
+
+    assert.equal(
+        pm_list.get_active_user_ids_string(),
+        undefined);
+
+    function set_filter_result(emails) {
+        narrow_state.filter = () => {
+            return {
+                operands: (operand) => {
+                    assert.equal(operand, 'pm-with');
+                    return emails;
+                },
+            };
+        };
+    }
+
+    set_filter_result([]);
+    assert.equal(
+        pm_list.get_active_user_ids_string(),
+        undefined);
+
+    set_filter_result(['bob@zulip.com,alice@zulip.com']);
+    assert.equal(
+        pm_list.get_active_user_ids_string(),
+        '101,102');
+});

static/js/pm_list.js

@@ -25,15 +25,6 @@ function set_count(count) {
     update_count_in_dom(count_span, value_span, count);
 }
 
-exports.get_conversation_li = function (conversation) {
-    // conversation is something like "foo@example.com,bar@example.com"
-    const user_ids_string = people.reply_to_to_user_ids_string(conversation);
-    if (!user_ids_string) {
-        return;
-    }
-    return exports.get_li_for_user_ids_string(user_ids_string);
-};
-
 exports.get_li_for_user_ids_string = function (user_ids_string) {
     const pm_li = get_filter_li();
     const convo_li = pm_li.find("li[data-user-ids-string='" + user_ids_string + "']");
@@ -64,10 +55,27 @@ exports.close = function () {
     remove_expanded_private_messages();
 };
 
+exports.get_active_user_ids_string = function () {
+    const filter = narrow_state.filter();
+
+    if (!filter) {
+        return;
+    }
+
+    const emails = filter.operands('pm-with')[0];
+
+    if (!emails) {
+        return;
+    }
+
+    return people.emails_strings_to_user_ids_string(emails);
+};
+
 exports._build_private_messages_list = function () {
 
     const private_messages = pm_conversations.recent.get();
     const display_messages = [];
+    const active_user_ids_string = exports.get_active_user_ids_string();
 
     _.each(private_messages, function (private_message_obj) {
         const user_ids_string = private_message_obj.user_ids_string;
@@ -78,6 +86,8 @@ exports._build_private_messages_list = function () {
 
         const is_group = user_ids_string.indexOf(',') >= 0;
 
+        const is_active = user_ids_string === active_user_ids_string;
+
         let user_circle_class;
         let fraction_present;
 
@@ -99,6 +109,7 @@ exports._build_private_messages_list = function () {
             user_ids_string: user_ids_string,
             unread: num_unread,
             is_zero: num_unread === 0,
+            is_active: is_active,
             url: hash_util.pm_with_uri(reply_to),
             user_circle_class: user_circle_class,
             fraction_present: fraction_present,
@@ -113,7 +124,7 @@ exports._build_private_messages_list = function () {
     return recipients_dom;
 };
 
-exports.rebuild_recent = function (active_conversation) {
+exports.rebuild_recent = function () {
     stream_popover.hide_topic_popover();
 
     if (private_messages_open) {
@@ -121,13 +132,6 @@ exports.rebuild_recent = function (active_conversation) {
         ui.get_content_element($("#private-container")).html(rendered_pm_list);
     }
 
-    if (active_conversation) {
-        const active_li = exports.get_conversation_li(active_conversation);
-        if (active_li) {
-            active_li.addClass('active-sub-filter');
-        }
-    }
-
     resize.resize_stream_filters_container();
 };
 
@@ -137,14 +141,10 @@ exports.update_private_messages = function () {
     }
 
     let is_pm_filter = false;
-    let pm_with = '';
     const filter = narrow_state.filter();
 
     if (filter) {
         const conversation = filter.operands('pm-with');
-        if (conversation.length === 1) {
-            pm_with = conversation[0];
-        }
         if (conversation.length === 0) {
             is_pm_filter = _.contains(filter.operands('is'), "private");
         }
@@ -153,23 +153,16 @@ exports.update_private_messages = function () {
         // containing a list).
     }
 
-    exports.rebuild_recent(pm_with);
+    exports.rebuild_recent();
 
     if (is_pm_filter) {
         $(".top_left_private_messages").addClass('active-filter');
     }
 };
 
-exports.expand = function (op_pm) {
+exports.expand = function () {
     private_messages_open = true;
-    if (op_pm.length === 1) {
+    exports.rebuild_recent();
-        exports.rebuild_recent(op_pm[0]);
-    } else if (op_pm.length !== 0) {
-        // TODO: Should pass the reply-to of the thread
-        exports.rebuild_recent("");
-    } else {
-        exports.rebuild_recent("");
-    }
 };
 
 exports.update_dom_with_unread_counts = function (counts) {

static/js/top_left_corner.js

@@ -71,8 +71,7 @@ exports.handle_narrow_activated = function (filter) {
     }
 
     if (exports.should_expand_pm_list(filter)) {
-        const op_pm = filter.operands('pm-with');
+        pm_list.expand();
-        pm_list.expand(op_pm);
     } else {
         pm_list.close();
     }

static/templates/sidebar_private_message_list.hbs

@@ -1,6 +1,6 @@
 <ul class='expanded_private_messages' data-name='private'>
     {{#each messages}}
-    <li class='{{#if is_zero}}zero-pm-unreads{{/if}} top_left_row expanded_private_message' data-user-ids-string='{{user_ids_string}}'>
+    <li class='{{#if is_active}}active-sub-filter{{/if}} {{#if is_zero}}zero-pm-unreads{{/if}} top_left_row expanded_private_message' data-user-ids-string='{{user_ids_string}}'>
         <span class='pm-box' id='pm_user_status' data-user-ids-string='{{user_ids_string}}' data-is-group='{{is_group}}'>
 
             <div class="pm_left_col">