From 741985f9260da6292d3d83e3fcb5f641e9beefab Mon Sep 17 00:00:00 2001
From: Chris Rodrigues <crod951@gmail.com>
Date: Wed, 19 Feb 2025 07:39:40 -0800
Subject: [PATCH 1/3] feat(anonymous-user): Added handling for anonymous post
 user so it doesnt break the post display

---
 src/views/Posts.vue | 45 +++++++++++++++++++++++++--------------------
 1 file changed, 25 insertions(+), 20 deletions(-)

diff --git a/src/views/Posts.vue b/src/views/Posts.vue
index 91204028..08580561 100644
--- a/src/views/Posts.vue
+++ b/src/views/Posts.vue
@@ -123,7 +123,7 @@
       <div v-if="!post._deleted && !post.user.ignored" class="post-block-grid">
         <!-- Post Profile Section -->
         <div class="post-user">
-          <router-link :to="{ path: '/profile/' + post.user.username.toLowerCase(), query: { id: post.user.id }}">
+          <router-link v-if="post.user.username" :to="{ path: '/profile/' + post.user.username.toLowerCase(), query: { id: post.user.id }}">
             <div class="user-avatar" :class="defaultAvatarShape">
               <span v-if="post.user.online" class="online green" :data-balloon="post.user.username + ' is online'">
                 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
@@ -138,10 +138,15 @@
             <router-link class="hide-mobile" :to="{ path: '/profile/' + post.user.username.toLowerCase(), query: { id: post.user.id } }">
               <div class="original-poster" v-if="post.user.original_poster">OP</div>
               <div v-if="post.user.title" :title="('Title: ' + post.user.title)" class="user-activity"><span class="user-activity-value">{{post.user.title}}</span></div>
-              <div v-if="post.user.activity > -1" :title="('Activity: ' + post.user.activity)" class="user-activity">Activity: <span class="user-activity-value">{{post.user.activity}}</span></div>
-              <div v-if="post.user.merit > -1" :title="('Merit: ' + post.user.merit)" class="user-activity">Merit: <span class="user-activity-value">{{post.user.merit}}</span></div>
+              <div v-if="post.user.activity > -1" :title="('Activity: ' + post.user.activity)" class="user-activity">Activity: <span class="user-activity-value">{{post.user.activity || 0}}</span></div>
+              <div v-if="post.user.merit > -1" :title="('Merit: ' + post.user.merit)" class="user-activity">Merit: <span class="user-activity-value">{{post.user.merit || 0}}</span></div>
             </router-link>
           </router-link>
+          <div v-if="!post.user.username">
+            <div class="user-avatar" :class="defaultAvatarShape">
+              <img :src="post.avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" />
+            </div>
+          </div>
 
           <div class="user-trust" v-if="loggedIn && postData.data.thread.trust_visible">
             <trust-display :user="post.user" />
@@ -157,20 +162,23 @@
           <div class="show-mobile">
             <div class="post-title-mobile">
               <div class="post-title-user">
-                <span class="username" :data-balloon="post.user.role_name || 'User'"><router-link :to="{ path: '/profile/' + post.user.username.toLowerCase() }">
-                  <span v-html="post.user.username"></span>
-                </router-link></span>
+                <span class="username" :data-balloon="post.user.role_name || 'User'">
+                  <router-link v-if="post.user.username" :to="{ path: '/profile/' + post.user.username.toLowerCase() }">
+                    <span v-html="post.user.username"></span>
+                  </router-link>
+                  <span v-if="!post.user.username">Anonymous</span>
+                </span>
                 <div :title="post.user.name" v-if="post.user.name" class="display-name">
                   <span>{{truncate(post.user.name, 33)}}</span>
                   <span class="hide-mobile">&nbsp;&mdash;&nbsp;</span>
                 </div>
-                <div :title="post.user.role_name || 'user'" class="user-role" :style="userRoleHighlight(post.user.highlight_color)">{{post.user.role_name || 'user'}}</div>
+                <div v-if="post.user.id != 0" :title="post.user.role_name || 'user'" class="user-role" :style="userRoleHighlight(post.user.highlight_color)">{{post.user.role_name || 'user'}}</div>
               </div>
-              <router-link :to="{ path: '/profile/' + post.user.username.toLowerCase() }" class="user-activity-mobile">
+              <router-link v-if="post.user.username" :to="{ path: '/profile/' + post.user.username.toLowerCase() }" class="user-activity-mobile">
                 <div class="original-poster" v-if="post.user.original_poster">OP</div>
                 <div v-if="post.user.title" :title="('Title: ' + post.user.title)" class="user-activity"><span class="user-activity-value">{{post.user.title}}</span></div>
-                <div v-if="post.user.activity > -1" :title="('Activity: ' + post.user.activity)" class="user-activity">Activity: <span class="user-activity-value">{{post.user.activity}}</span></div>
-                <div v-if="post.user.merit > -1" :title="('Merit: ' + post.user.merit)" class="user-activity">Merit: <span class="user-activity-value">{{post.user.merit}}</span></div>
+                <div v-if="post.user.activity > -1" :title="('Activity: ' + post.user.activity)" class="user-activity">Activity: <span class="user-activity-value">{{post.user.activity || 0}}</span></div>
+                <div v-if="post.user.merit > -1" :title="('Merit: ' + post.user.merit)" class="user-activity">Merit: <span class="user-activity-value">{{post.user.merit || 0}}</span></div>
               </router-link>
               <div class="timestamp">
                 <span>{{humanDate(post.created_at)}}</span>
@@ -188,14 +196,17 @@
           <!-- Post Title -->
           <div class="hide-mobile post-title">
             <div class="post-title-user">
-              <span class="username" :data-balloon="post.user.role_name || 'User'"><router-link :to="{ path: '/profile/' + post.user.username.toLowerCase(), query: { id: post.user.id } }">
-                <span v-html="post.user.username"></span>
-              </router-link></span>
+              <span class="username" :data-balloon="post.user.role_name || 'User'">
+                <router-link v-if="post.user.username" :to="{ path: '/profile/' + post.user.username.toLowerCase(), query: { id: post.user.id } }">
+                  <span v-html="post.user.username"></span>
+                </router-link>
+                <span v-if="!post.user.username">Anonymous</span>
+              </span>
               <div :title="post.user.name" v-if="post.user.name" class="display-name">
                 <span>{{truncate(post.user.name, 33)}}</span>
                 <span class="hide-mobile">&nbsp;&mdash;&nbsp;</span>
               </div>
-              <div :title="post.user.role_name || 'user'" class="user-role" :style="userRoleHighlight(post.user.highlight_color)">{{post.user.role_name || 'user'}}</div>
+              <div v-if="post.user.id != 0" :title="post.user.role_name || 'user'" class="user-role" :style="userRoleHighlight(post.user.highlight_color)">{{post.user.role_name || 'user'}}</div>
               <div class="timestamp">
                 <span>{{humanDate(post.created_at)}}</span>
                 <span v-if="showEditDate(post) && post.metadata?.edited_by_username">{{'&nbsp;&mdash;&nbsp;Edited ' + humanDate(post.updated_at) + ' by '}}</span><a v-if="showEditDate(post) && post.metadata?.edited_by_username" href="#">{{post.metadata.edited_by_username}}</a>
@@ -1539,9 +1550,6 @@ ad-viewer {
         color: $base-font-color;
         font-size: $font-size-sm;
         font-weight: 600;
-        &:hover {
-          color: $color-primary;
-        }
       }
 
       .user-role {
@@ -1606,9 +1614,6 @@ ad-viewer {
         margin-right: 0.25rem;
         color: $base-font-color;
         font-weight: 600;
-        &:hover {
-          color: $color-primary;
-        }
       }
 
       .user-role {

From 74d2f886a3b7da7878d2d54a399dd39ca3dd12b6 Mon Sep 17 00:00:00 2001
From: Chris Rodrigues <crod951@gmail.com>
Date: Wed, 19 Feb 2025 10:42:28 -0800
Subject: [PATCH 2/3] refactor(thread-anonymous): Handle anonymous poster in
 thread view

---
 src/views/Threads.vue | 31 ++++++++++++++++++++++++-------
 1 file changed, 24 insertions(+), 7 deletions(-)

diff --git a/src/views/Threads.vue b/src/views/Threads.vue
index fc530acc..dab6a9e4 100644
--- a/src/views/Threads.vue
+++ b/src/views/Threads.vue
@@ -132,9 +132,10 @@
             <div class="started-by">
               Started by
               <span v-if="thread.user.deleted">deleted</span>
-              <router-link v-if="!thread.user.deleted" :to="{ path: '/profile/' + thread?.user?.username.toLowerCase(), query: { id: thread?.user?.id } }">
+              <router-link v-if="!thread.user.deleted && thread.user.username" :to="{ path: '/profile/' + thread?.user?.username.toLowerCase(), query: { id: thread?.user?.id } }">
                 <span v-html="thread.user.username"></span>
               </router-link>
+              <span v-if="!thread.user.username">Anonymous</span>
               <span> on {{humanDate(thread.created_at)}}</span>
             </div>
           </td>
@@ -146,10 +147,15 @@
 
           <td class="last-post">
             <span v-if="thread.last_deleted">deleted</span>
-            <router-link v-if="!thread.last_deleted" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }"><img class="avatar-small" :class="defaultAvatarShape" :src="thread.last_post_avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" /></router-link>
-            <router-link v-if="!thread.last_deleted" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }">
+            <router-link v-if="!thread.last_deleted && thread.last_post_username" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }">
+              <img class="avatar-small" :class="defaultAvatarShape" :src="thread.last_post_avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" />
+            </router-link>
+            <router-link v-if="!thread.last_deleted && thread.last_post_username" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }">
               <span v-html="thread.last_post_username"></span>
-            </router-link> posted on
+            </router-link> 
+            <img v-if="!thread.last_deleted && !thread.last_post_username" class="avatar-small" :class="defaultAvatarShape" :src="thread.last_post_avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" />
+            <span v-if="!thread.last_deleted && !thread.last_post_username">Anonymous</span>
+            posted on 
             <router-link :to="{ name: 'Posts', params: { threadSlug: thread.slug }, query: { start: thread.last_post_position }, hash: '#' + thread.last_post_id }"><span>{{humanDate(thread.last_post_created_at)}}</span>.</router-link>
             <router-link v-if="thread.has_new_post" :to="{ name: 'Posts', params: { threadSlug: thread.slug, start: thread.latest_unread_position}, hash: '#' + thread.latest_unread_post_id }">(Last unread post)</router-link>
           </td>
@@ -185,9 +191,10 @@
             <div class="started-by">
               Started by
               <span v-if="thread.user.deleted">deleted</span>
-              <router-link v-if="!thread.user.deleted" :to="{ path: '/profile/' + thread.user.username.toLowerCase(), query: { id: thread.user.id } }">
+              <router-link v-if="!thread.user.deleted && thread.user.username" :to="{ path: '/profile/' + thread.user.username.toLowerCase(), query: { id: thread.user.id } }">
                 <span v-html="thread.user.username"></span>
               </router-link>
+              <span v-if="!thread.user.username">Anonymous</span>
               <span> on {{ humanDate(thread.created_at)}}</span>
             </div>
 
@@ -203,8 +210,18 @@
 
           <td class="last-post" v-if="thread.user.username">
             <span v-if="thread.last_deleted">deleted</span>
-            <router-link v-if="!thread.last_deleted" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }"><img class="avatar-small" :class="defaultAvatar" :src="thread.last_post_avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" /></router-link>
-            <router-link v-if="!thread.last_deleted" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }"><span v-html="thread.last_post_username"></span></router-link> posted on <router-link :to="{ name: 'Posts', params: { threadSlug: thread.slug }, query: { start: thread.last_post_position }, hash: '#' + thread.last_post_id }"><span>{{humanDate(thread.last_post_created_at)}}</span>.</router-link>
+            <router-link v-if="!thread.last_deleted && thread.last_post_username" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }">
+              <img class="avatar-small" :class="defaultAvatar" :src="thread.last_post_avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" />
+            </router-link>
+            <router-link v-if="!thread.last_deleted && thread.last_post_username" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }">
+              <span v-html="thread.last_post_username"></span>
+            </router-link> 
+            <img v-if="!thread.last_deleted && !thread.last_post_username" class="avatar-small" :class="defaultAvatar" :src="thread.last_post_avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" />
+            <span v-if="!thread.last_deleted && !thread.last_post_username">Anonymous</span>
+            posted on 
+              <router-link :to="{ name: 'Posts', params: { threadSlug: thread.slug }, query: { start: thread.last_post_position }, hash: '#' + thread.last_post_id }">
+                <span>{{humanDate(thread.last_post_created_at)}}</span>.
+              </router-link>
             <router-link v-if="thread.has_new_post" :to="{ name: 'Posts', params: { threadSlug: thread.slug }, query: { start: thread.latest_unread_position }, hash: '#' + thread.latest_unread_post_id }">(Last unread post)</router-link>
           </td>
           <td class="show-mobile">

From a318ac45efeeb049155b194214fb6ebeca57d841 Mon Sep 17 00:00:00 2001
From: Chris Rodrigues <crod951@gmail.com>
Date: Fri, 21 Feb 2025 14:23:42 -0800
Subject: [PATCH 3/3] refactor(thread-username): Remove checks for thread
 username before displaying data; this resolves the bug where anonymous
 threads were not apprearing in the threads list

---
 src/views/Threads.vue | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/src/views/Threads.vue b/src/views/Threads.vue
index decb905d..5e1b944d 100644
--- a/src/views/Threads.vue
+++ b/src/views/Threads.vue
@@ -162,7 +162,7 @@
         </tr>
 
         <tr class="threads-data" v-for="thread in threadData.data.normal" :key="thread.id">
-          <td class="subject" v-if="thread.user.username">
+          <td class="subject">
             <div class="title">
               <div class="thread-state">
                 <svg class="is-unread" v-if="thread.has_new_post" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" data-balloon="Unread">
@@ -203,13 +203,12 @@
             </div>
           </td>
 
-          <td class="views-replies" v-if="thread.user.username">
+          <td class="views-replies">
             <span class="replies">{{ thread.is_proxy ? thread.post_count.toLocaleString() : (thread.post_count - 1).toLocaleString() || 0 }}</span>
             <span class="views">{{ thread.view_count.toLocaleString() || 0 }}</span>
-
           </td>
 
-          <td class="last-post" v-if="thread.user.username">
+          <td class="last-post">
             <span v-if="thread.last_deleted">deleted</span>
             <router-link v-if="!thread.last_deleted && thread.last_post_username" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }">
               <img class="avatar-small" :class="defaultAvatar" :src="thread.last_post_avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" />