UX: Always show avatar on mobile topic lists (#15323)

app/assets/javascripts/discourse/app/components/basic-topic-list.js

@@ -6,8 +6,6 @@ export default Component.extend({
   loadingMore: alias("topicList.loadingMore"),
   loading: not("loaded"),
 
-  hideMobileAvatar: true,
-
   @discourseComputed("topicList.loaded")
   loaded() {
     let topicList = this.topicList;

app/assets/javascripts/discourse/app/components/topic-list-item.js

@@ -195,11 +195,6 @@ export default Component.extend({
     return false;
   },
 
-  @discourseComputed("expandPinned", "hideMobileAvatar")
-  showMobileAvatar(expandPinned, hideMobileAvatar) {
-    return !(hideMobileAvatar || expandPinned);
-  },
-
   showEntrance,
 
   click(e) {

app/assets/javascripts/discourse/app/templates/components/basic-topic-list.hbs

@@ -2,7 +2,6 @@
   {{#if topics}}
     {{topic-list
       showPosters=showPosters
-      hideMobileAvatar=hideMobileAvatar
       hideCategory=hideCategory
       topics=topics
       expandExcerpts=expandExcerpts

app/assets/javascripts/discourse/app/templates/components/topic-list.hbs

@@ -36,7 +36,6 @@
                       showTopicPostBadges=showTopicPostBadges
                       hideCategory=hideCategory
                       showPosters=showPosters
-                      hideMobileAvatar=hideMobileAvatar
                       showLikes=showLikes
                       showOpLikes=showOpLikes
                       expandGloballyPinned=expandGloballyPinned

app/assets/javascripts/discourse/app/templates/mobile/list/topic-list-item.hbr

@@ -1,55 +1,51 @@
 <td class="topic-list-data">
   {{~raw-plugin-outlet name="topic-list-before-columns"}}
-  {{~#if showMobileAvatar}}
   <div class='pull-left'>
     <a href="{{topic.lastPostUrl}}" data-user-card="{{topic.last_poster_username}}">{{avatar topic.lastPosterUser imageSize="large"}}</a>
   </div>
   <div class='right'>
-    {{else}}
+    {{!--
-      <div>
+      The `~` syntax strip spaces between the elements, making it produce
-        {{/if~}}
+      `<a class=topic-post-badges>Some text</a><span class=topic-post-badges>`,
-        {{!--
+      with no space between them.
-          The `~` syntax strip spaces between the elements, making it produce
+      This causes the topic-post-badge to be considered the same word as "text"
-          `<a class=topic-post-badges>Some text</a><span class=topic-post-badges>`,
+      at the end of the link, preventing it from line wrapping onto its own line.
-          with no space between them.
+    --}}
-          This causes the topic-post-badge to be considered the same word as "text"
+    {{~raw-plugin-outlet name="topic-list-before-link"}}
-          at the end of the link, preventing it from line wrapping onto its own line.
+    <div class='main-link'>
-        --}}
+      {{~raw-plugin-outlet name="topic-list-before-status"}}
-        {{~raw-plugin-outlet name="topic-list-before-link"}}
+      {{~raw "topic-status" topic=topic~}}
-        <div class='main-link'>
+      {{~topic-link topic class="raw-link raw-topic-link"}}
-          {{~raw-plugin-outlet name="topic-list-before-status"}}
+      {{~#if topic.featured_link~}}
-          {{~raw "topic-status" topic=topic~}}
+      {{~topic-featured-link topic~}}
-          {{~topic-link topic class="raw-link raw-topic-link"}}
+      {{~/if~}}
-          {{~#if topic.featured_link~}}
+      {{~raw-plugin-outlet name="topic-list-after-title"}}
-          {{~topic-featured-link topic~}}
+      {{~#if topic.unseen~}}
-          {{~/if~}}
+        <span class="topic-post-badges">&nbsp;<span class="badge-notification new-topic"></span></span>
-          {{~raw-plugin-outlet name="topic-list-after-title"}}
+      {{~/if~}}
-          {{~#if topic.unseen~}}
+      {{~#if expandPinned~}}
-            <span class="topic-post-badges">&nbsp;<span class="badge-notification new-topic"></span></span>
+      {{~raw "list/topic-excerpt" topic=topic~}}
-          {{~/if~}}
+      {{~/if~}}
-          {{~#if expandPinned~}}
+    </div>
-          {{~raw "list/topic-excerpt" topic=topic~}}
+    <div class='pull-right'>
-          {{~/if~}}
+      {{raw "list/post-count-or-badges" topic=topic postBadgesEnabled=showTopicPostBadges}}
+    </div>
+    <div class="topic-item-stats clearfix">
+      {{#unless hideCategory}}
+        {{~raw-plugin-outlet name="topic-list-before-category"}}
+        <div class='category'>
+          {{category-link topic.category}}
         </div>
-        <div class='pull-right'>
+      {{/unless}}
-          {{raw "list/post-count-or-badges" topic=topic postBadgesEnabled=showTopicPostBadges}}
+      {{discourse-tags topic mode="list"}}
-        </div>
+      <div class="pull-right">
-        <div class="topic-item-stats clearfix">
+        <div class='num activity last'>
-          {{#unless hideCategory}}
+          <span class="age activity" title="{{topic.bumpedAtTitle}}"><a
-            {{~raw-plugin-outlet name="topic-list-before-category"}}
+              href="{{topic.lastPostUrl}}">{{format-date topic.bumpedAt format="tiny" noTitle="true"}}</a>
-            <div class='category'>
+          </span>
-              {{category-link topic.category}}
-            </div>
-          {{/unless}}
-          {{discourse-tags topic mode="list"}}
-          <div class="pull-right">
-            <div class='num activity last'>
-              <span class="age activity" title="{{topic.bumpedAtTitle}}"><a
-                 href="{{topic.lastPostUrl}}">{{format-date topic.bumpedAt format="tiny" noTitle="true"}}</a>
-              </span>
-            </div>
-          </div>
-          <div class="clearfix"></div>
         </div>
       </div>
+      <div class="clearfix"></div>
+    </div>
+  </div>
 </td>