bookend: Move conditional bookend content inside the template.

We move the stream subscribed/unsubscribed bookend info from
js files to bookend handlebar.

Tweaked by tabbott to override the check-templates indentation logic.

frontend_tests/node_tests/message_list.js

@@ -302,7 +302,6 @@ run_test("local_echo", () => {
 run_test("bookend", ({override}) => {
     const list = new MessageList({});
 
-    let expected = "translated: You subscribed to stream IceCream";
     list.view.clear_trailing_bookend = noop;
     list.narrowed = true;
 
@@ -319,15 +318,21 @@ run_test("bookend", ({override}) => {
         list.view.render_trailing_bookend = stub.f;
         list.update_trailing_bookend();
         assert.equal(stub.num_calls, 1);
-        const bookend = stub.get_args("content", "subscribed", "show_button");
+        const bookend = stub.get_args(
-        assert.equal(bookend.content, expected);
+            "stream_name",
+            "subscribed",
+            "deactivated",
+            "just_unsubscribed",
+            "show_button",
+        );
+        assert.equal(bookend.stream_name, "IceCream");
         assert.equal(bookend.subscribed, true);
+        assert.equal(bookend.deactivated, false);
+        assert.equal(bookend.just_unsubscribed, false);
         assert.equal(bookend.show_button, true);
     }
 
-    expected = "translated: You unsubscribed from stream IceCream";
     list.last_message_historical = false;
-
     is_subscribed = false;
 
     {
@@ -335,15 +340,21 @@ run_test("bookend", ({override}) => {
         list.view.render_trailing_bookend = stub.f;
         list.update_trailing_bookend();
         assert.equal(stub.num_calls, 1);
-        const bookend = stub.get_args("content", "subscribed", "show_button");
+        const bookend = stub.get_args(
-        assert.equal(bookend.content, expected);
+            "stream_name",
+            "subscribed",
+            "deactivated",
+            "just_unsubscribed",
+            "show_button",
+        );
+        assert.equal(bookend.stream_name, "IceCream");
         assert.equal(bookend.subscribed, false);
+        assert.equal(bookend.deactivated, false);
+        assert.equal(bookend.just_unsubscribed, true);
         assert.equal(bookend.show_button, true);
     }
 
     // Test when the stream is privates (invite only)
-    expected = "translated: You unsubscribed from stream IceCream";
-
     invite_only = true;
 
     {
@@ -351,13 +362,20 @@ run_test("bookend", ({override}) => {
         list.view.render_trailing_bookend = stub.f;
         list.update_trailing_bookend();
         assert.equal(stub.num_calls, 1);
-        const bookend = stub.get_args("content", "subscribed", "show_button");
+        const bookend = stub.get_args(
-        assert.equal(bookend.content, expected);
+            "stream_name",
+            "subscribed",
+            "deactivated",
+            "just_unsubscribed",
+            "show_button",
+        );
+        assert.equal(bookend.stream_name, "IceCream");
         assert.equal(bookend.subscribed, false);
+        assert.equal(bookend.deactivated, false);
+        assert.equal(bookend.just_unsubscribed, true);
         assert.equal(bookend.show_button, false);
     }
 
-    expected = "translated: You are not subscribed to stream IceCream";
     list.last_message_historical = true;
 
     {
@@ -365,9 +383,17 @@ run_test("bookend", ({override}) => {
         list.view.render_trailing_bookend = stub.f;
         list.update_trailing_bookend();
         assert.equal(stub.num_calls, 1);
-        const bookend = stub.get_args("content", "subscribed", "show_button");
+        const bookend = stub.get_args(
-        assert.equal(bookend.content, expected);
+            "stream_name",
+            "subscribed",
+            "deactivated",
+            "just_unsubscribed",
+            "show_button",
+        );
+        assert.equal(bookend.stream_name, "IceCream");
         assert.equal(bookend.subscribed, false);
+        assert.equal(bookend.deactivated, false);
+        assert.equal(bookend.just_unsubscribed, false);
         assert.equal(bookend.show_button, true);
     }
 });

static/js/message_list.js

@@ -2,7 +2,6 @@ import autosize from "autosize";
 import $ from "jquery";
 
 import * as blueslip from "./blueslip";
-import {$t} from "./i18n";
 import {MessageListData} from "./message_list_data";
 import {MessageListView} from "./message_list_view";
 import * as narrow_banner from "./narrow_banner";
@@ -230,25 +229,6 @@ export class MessageList {
         return this.data.selected_idx();
     }
 
-    subscribed_bookend_content(stream_name) {
-        return $t({defaultMessage: "You subscribed to stream {stream}"}, {stream: stream_name});
-    }
-
-    unsubscribed_bookend_content(stream_name) {
-        return $t({defaultMessage: "You unsubscribed from stream {stream}"}, {stream: stream_name});
-    }
-
-    not_subscribed_bookend_content(stream_name) {
-        return $t(
-            {defaultMessage: "You are not subscribed to stream {stream}"},
-            {stream: stream_name},
-        );
-    }
-
-    deactivated_bookend_content() {
-        return $t({defaultMessage: "This stream has been deactivated"});
-    }
-
     // Maintains a trailing bookend element explaining any changes in
     // your subscribed/unsubscribed status at the bottom of the
     // message list.
@@ -261,30 +241,29 @@ export class MessageList {
         if (stream_name === undefined) {
             return;
         }
-        let trailing_bookend_content;
+        let deactivated = false;
+        let just_unsubscribed = false;
         let show_button = true;
         const subscribed = stream_data.is_subscribed_by_name(stream_name);
         const sub = stream_data.get_sub(stream_name);
         if (sub === undefined) {
-            trailing_bookend_content = this.deactivated_bookend_content();
+            deactivated = true;
             // Hide the resubscribe button for streams that no longer exist.
             show_button = false;
-        } else if (subscribed) {
+        } else if (!subscribed && !this.last_message_historical) {
-            trailing_bookend_content = this.subscribed_bookend_content(stream_name);
+            just_unsubscribed = true;
-        } else {
-            if (!this.last_message_historical) {
-                trailing_bookend_content = this.unsubscribed_bookend_content(stream_name);
 
-                // For invite only streams hide the resubscribe button
+            // For invite only streams hide the resubscribe button
-                // Hide button for guest users
+            // Hide button for guest users
-                show_button = !page_params.is_guest && !sub.invite_only;
+            show_button = !page_params.is_guest && !sub.invite_only;
-            } else {
-                trailing_bookend_content = this.not_subscribed_bookend_content(stream_name);
-            }
-        }
-        if (trailing_bookend_content !== undefined) {
-            this.view.render_trailing_bookend(trailing_bookend_content, subscribed, show_button);
         }
+        this.view.render_trailing_bookend(
+            stream_name,
+            subscribed,
+            deactivated,
+            just_unsubscribed,
+            show_button,
+        );
     }
 
     unmuted_messages(messages) {

static/js/message_list_view.js

@@ -308,15 +308,15 @@ export class MessageListView {
 
         if (!last_subscribed && first_subscribed) {
             group.bookend_top = true;
-            group.subscribed = stream;
+            group.subscribed = true;
-            group.bookend_content = this.list.subscribed_bookend_content(stream);
+            group.stream_name = stream;
             return;
         }
 
         if (last_subscribed && !first_subscribed) {
             group.bookend_top = true;
-            group.unsubscribed = stream;
+            group.just_unsubscribed = true;
-            group.bookend_content = this.list.unsubscribed_bookend_content(stream);
+            group.stream_name = stream;
             return;
         }
     }
@@ -1295,12 +1295,14 @@ export class MessageListView {
         trailing_bookend.remove();
     }
 
-    render_trailing_bookend(trailing_bookend_content, subscribed, show_button) {
+    render_trailing_bookend(stream_name, subscribed, deactivated, just_unsubscribed, show_button) {
         const rendered_trailing_bookend = $(
             render_bookend({
-                bookend_content: trailing_bookend_content,
+                stream_name,
                 trailing: show_button,
                 subscribed,
+                deactivated,
+                just_unsubscribed,
             }),
         );
         rows.get_table(this.table_name).append(rendered_trailing_bookend);

static/templates/bookend.hbs

@@ -1,8 +1,16 @@
 {{! Client-side Mustache template for rendering the trailing bookend.}}
-
-{{#if bookend_content}}
 <div class="{{#if trailing}}trailing_bookend{{/if}} bookend sub-unsub-message">
-    <span>{{bookend_content}}</span>
+    <span>
+        {{#if deactivated}}
+            {{t "This stream has been deactivated" }}
+        {{else if subscribed }}
+            {{#tr}}You subscribed to stream {stream_name}{{/tr}}
+        {{else if just_unsubscribed }}
+            {{#tr}}You unsubscribed from stream {stream_name}{{/tr}}
+        {{else}}
+            {{#tr}}You are not subscribed to stream {stream_name}{{/tr}}
+        {{/if}}
+    </span>
     {{#if trailing}}
     <div class="sub_button_row new-style">
         <button class="button white rounded stream_sub_unsub_button {{#unless subscribed}}sea-green{{/unless}}" type="button" name="subscription">
@@ -15,4 +23,3 @@
     </div>
     {{/if}}
 </div>
-{{/if}}

tools/check-templates

@@ -26,6 +26,8 @@ EXCLUDED_FILES = [
     "templates/zerver/emails/missed_message.source.html",
     # Previously unchecked and our parser doesn't like its indentation
     "static/assets/icons/template.hbs",
+    # Template checker recommends very hard to read indentation.
+    "static/templates/bookend.hbs",
     # The parser does not like the indentation of custom ReadTheDocs templates
     "docs/_templates/layout.html",
 ]