Show communities on others profiles, both on mobile and desktop

app/lib/express.js

@@ -310,14 +310,27 @@ router.get(
       return res.redirect("/");
     }
 
-    const [profile, posts, friends, friendshipStatus] = await Promise.all([
+    const [
+      profile,
+      posts,
+      friends,
+      friendshipStatus,
+      communities,
+    ] = await Promise.all([
       queries.getProfile(id),
       queries.getPosts({ id }),
       queries.getFriends({ id }),
       queries.getFriendshipStatus(req.context.profile.id, id),
+      queries.getProfileCommunities(id),
     ]);
 
-    res.render("profile", { profile, posts, friends, friendshipStatus });
+    res.render("profile", {
+      profile,
+      posts,
+      friends,
+      friendshipStatus,
+      communities,
+    });
   }
 );
 

app/lib/mobile-routes.js

@@ -54,11 +54,18 @@ module.exports.setupRoutes = (router) => {
         return res.redirect("/mobile");
       }
 
-      const [profile, posts, friends, friendshipStatus] = await Promise.all([
+      const [
+        profile,
+        posts,
+        friends,
+        friendshipStatus,
+        communities,
+      ] = await Promise.all([
         queries.getProfile(id),
         queries.getPosts({ id }),
         queries.getFriends({ id }),
         queries.getFriendshipStatus(req.context.profile.id, id),
+        queries.getProfileCommunities(id),
       ]);
 
       res.render("mobile/profile", {
@@ -66,6 +73,7 @@ module.exports.setupRoutes = (router) => {
         posts,
         friends,
         friendshipStatus,
+        communities,
         layout: "mobile/_layout",
       });
     }

app/views/mobile/profile.ejs

@@ -29,6 +29,9 @@
   <button class="tab-title js-tab-button">
     Friends
   </button>
+  <button class="tab-title js-tab-button">
+    Communities
+  </button>
 </div>
 <div class="tab-content">
   <div class="tab-item js-tab-item">
@@ -50,5 +53,18 @@
   </div>
   <div class="tab-item js-tab-item" style="display: none; padding: 10px">
     <%- include('_friends', { friends: friends.friends }) %>
+    <% if (friends.friends.length == 0) { %>
+      <p>No friends</p>
+    <% } %>
+  </div>
+  <div class="tab-item js-tab-item" style="display: none; padding: 10px">
+    <% communities.map(community => { %>
+      <a href="/communities/<%= community %>" class="link-block">
+        #<%= community %>
+      </a>
+    <% }) %>
+    <% if (communities.length == 0) { %>
+      <p>No communities</p>
+    <% } %>
   </div>
 </div>

app/views/profile.ejs

@@ -54,6 +54,19 @@
   <div class="friends-communities">
     <h2>Friends</h2>
     <%- include('_friends', { friends: friends.friends }) %>
+    <% if (friends.friends.length == 0) { %>
+      <p>No friends</p>
+    <% } %>
+
+    <h2 style="margin-top: 30px">Communities</h2>
+    <% communities.map(community => { %>
+      <a href="/communities/<%= community %>" class="link-block">
+        #<%= community %>
+      </a>
+    <% }) %>
+    <% if (communities.length == 0) { %>
+      <p>No communities</p>
+    <% } %>
   </div>
 </div>