W3.8: show filter name, remove filter.

image_share.html

@@ -44,6 +44,11 @@
   {{#if currentUser }}
     <button class="btn btn-success js-show-image-form">add image</button>
   {{/if}}
+
+  {{#if filtering_images }}
+    <h2>Showing images by user {{ getFilterUser }}. <a href="#" class="js-unset-image-filter">Show all images</a></h2>
+  {{/if}}
+
   <div class="row">
     {{#each images}}
       <div class="col-xs-12 col-md-3" id="{{_id}}">

image_share.js

@@ -6,18 +6,27 @@ if (Meteor.isClient) {
     passwordSignupFields: "USERNAME_AND_EMAIL"
   });
 
-  Template.images.helpers({
+  const getUser = (userId) => {
+    let user = Meteor.users.findOne({ _id: userId });
+    return user ? user.username : "anonymous";
+  };
+
+  Template.images.helpers({ getUser,
     images: function () {
       const createdBy = Session.get("userFilter");
       const selector = createdBy ? { createdBy } : {};
       return Images.find(selector, { sort: { createdOn: -1, rating: -1 }});
     },
+    filtering_images: function () {
+      const userFilter = Session.get("userFilter");
+      return !!userFilter;
+    },
     image_id: function () {
       return "rating-" + this._id;
     },
-    getUser: function (userId) {
-      let user = Meteor.users.findOne({ _id: userId });
-      return user ? user.username : "anonymous";
+    getFilterUser: function () {
+      const userFilter = Session.get("userFilter");
+      return getUser(userFilter);
     }
   });
 
@@ -56,6 +65,9 @@ if (Meteor.isClient) {
     },
     "click .js-set-image-filter": function () {
       Session.set("userFilter", this.createdBy);
+    },
+    "click .js-unset-image-filter": () => {
+      Session.delete("userFilter");
     }
   });