Handle read-only multireddit status on the frontend.

r2/r2/lib/jsontemplates.py

@@ -256,6 +256,7 @@ class LabeledMultiJsonTemplate(ThingJsonTemplate):
         name="name",
         subreddits="srs",
         visibility="visibility",
+        can_edit="can_edit",
     )
     del _data_attrs_["id"]
 
@@ -270,6 +271,8 @@ class LabeledMultiJsonTemplate(ThingJsonTemplate):
     def thing_attr(self, thing, attr):
         if attr == "srs":
             return self.sr_props(thing, thing.srs)
+        elif attr == "can_edit":
+            return c.user_is_loggedin and thing.can_edit(c.user)
         else:
             return ThingJsonTemplate.thing_attr(self, thing, attr)
 

r2/r2/public/static/css/reddit.less

@@ -5210,6 +5210,12 @@ table.calendar {
         }
     }
 
+    &.readonly {
+        button.remove-sr {
+            display: none;
+        }
+    }
+
     form.add-sr {
         .sr-name, button.add {
             vertical-align: middle;

r2/r2/public/static/js/multi.js

@@ -175,6 +175,7 @@ r.multi.MultiDetails = Backbone.View.extend({
     },
 
     initialize: function() {
+        this.listenTo(this.model, 'change', this.render)
         this.listenTo(this.model.subreddits, 'add', this.addOne)
         this.listenTo(this.model.subreddits, 'remove', this.removeOne)
         this.listenTo(this.model.subreddits, 'reset', this.addAll)
@@ -191,6 +192,11 @@ r.multi.MultiDetails = Backbone.View.extend({
         this.bubbleGroup = {}
     },
 
+    render: function() {
+        this.$el.toggleClass('readonly', !this.model.get('can_edit'))
+        return this
+    },
+
     addOne: function(sr) {
         var view = new r.multi.MultiSubredditItem({
             model: sr,

r2/r2/templates/multiinfobar.html

@@ -62,9 +62,7 @@
   %for sr in thing.srs:
     <li data-name="${sr.name}">
       <a href="/r/${sr.name}">/r/${sr.name}</a>
-      %if thing.can_edit:
-        <button class="remove-sr">${_('remove')}</button>
-      %endif
+      <button class="remove-sr">${_('remove')}</button>
     </li>
   %endfor
   </ul>