From b6ff0b2bf6868881f40696dc10dc9b695dc8800d Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 22 Jul 2026 21:24:28 +0300
Subject: [PATCH 1/4] remove the replied status preview, it takes too much
 space and looks confusing

---
 src/components/conversation/conversation.js  | 2 --
 src/components/conversation/conversation.vue | 6 ------
 2 files changed, 8 deletions(-)

diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index 91ffc09a3..4804b3c7a 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -6,7 +6,6 @@ import ChatMessageList from 'src/components/chat_message_list/chat_message_list.
 import PostStatusForm from 'src/components/post_status_form/post_status_form.vue'
 import QuickFilterSettings from 'src/components/quick_filter_settings/quick_filter_settings.vue'
 import QuickViewSettings from 'src/components/quick_view_settings/quick_view_settings.vue'
-import StatusContent from 'src/components/status_content/status_content.vue'
 import ThreadTree from 'src/components/thread_tree/thread_tree.vue'
 
 import { useInterfaceStore } from 'src/stores/interface'
@@ -427,7 +426,6 @@ const conversation = {
     QuickViewSettings,
     ChatMessageList,
     PostStatusForm,
-    StatusContent,
   },
   watch: {
     statusId(newVal, oldVal) {
diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index 19d63fbbe..cb0941d10 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -224,12 +224,6 @@
             {{ $t('general.cancel') }}
           </button>
         </h4>
-        <StatusContent
-          :status="replyStatus"
-          class="reply-to-preview"
-          compact
-          collapse
-        />
       </div>
       <PostStatusForm
         class="reply-form"

From 52af3c44201fbbd05aa213d37ca8901e62bd0483 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 22 Jul 2026 21:26:06 +0300
Subject: [PATCH 2/4] change header to span

---
 src/components/conversation/conversation.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index cb0941d10..bdfd08e6b 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -213,7 +213,7 @@
       class="chat-view-reply-form panel-footer -flexible-height"
     >
       <div class="auto-reply-to-section">
-        <h4 class="reply-to-text">
+        <span class="reply-to-text">
           {{ explicitReplyStatus ? $t('status.reply_to_selected') : $t('status.reply_to_last') }}
           <button
             v-if="explicitReplyStatus"
@@ -223,7 +223,7 @@
             <FAIcon icon="times" />
             {{ $t('general.cancel') }}
           </button>
-        </h4>
+        </span>
       </div>
       <PostStatusForm
         class="reply-form"

From 298e0af99e41fd34b92f6a3d6823a21212f79115 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 22 Jul 2026 21:38:49 +0300
Subject: [PATCH 3/4] handling broken replies

---
 src/components/chat_message/chat_message.js  | 4 ++++
 src/components/chat_message/chat_message.vue | 7 ++++++-
 src/i18n/en.json                             | 1 +
 3 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/components/chat_message/chat_message.js b/src/components/chat_message/chat_message.js
index a71014078..ec1b53517 100644
--- a/src/components/chat_message/chat_message.js
+++ b/src/components/chat_message/chat_message.js
@@ -90,6 +90,10 @@ const ChatMessage = {
         this.previousItem.data.id !== this.chatItem.data.in_reply_to_status_id
       )
     },
+    isBrokenReply() {
+      if (!this.previousItem) return false
+      return !this.chatItem.data.in_reply_to_status_id
+    },
     customReplyTo() {
       return this.$store.state.statuses.allStatusesObject[
         this.chatItem.data.in_reply_to_status_id
diff --git a/src/components/chat_message/chat_message.vue b/src/components/chat_message/chat_message.vue
index 234d20cb2..b4f8bc30e 100644
--- a/src/components/chat_message/chat_message.vue
+++ b/src/components/chat_message/chat_message.vue
@@ -7,7 +7,7 @@
     @mouseleave="onHover(false)"
   >
     <i18n-t
-      v-if="isStatus && isCustomReply"
+      v-if="isStatus && (isCustomReply || isBrokenReply)"
       keypath="status.reply_to_with_arg"
       scope="global"
       tag="small"
@@ -16,8 +16,10 @@
       <template #replyToWithIcon>
         <div class="avatar-spacer" />
         <StatusPopover
+          v-if="!isBrokenReply"
           :status-id="customReplyTo?.id"
           class="reply-to-popover"
+          :class="{ '-strikethrough': !message.parent_visible }"
         >
           <i18n-t
             keypath="status.reply_to_with_icon"
@@ -37,6 +39,9 @@
             </template>
           </i18n-t>
         </StatusPopover>
+        <span v-else class="reply-label">
+          {{ $t('status.broken_reply') }}
+        </span>
       </template>
       <template #user>
         <!-- v-if is there because status might not be loaded yet -->
diff --git a/src/i18n/en.json b/src/i18n/en.json
index 1f76b7c2d..93e140b41 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -1662,6 +1662,7 @@
     "reply_to_selected": "Replying to selected message",
     "reply_to_last": "Replying to last message",
     "reply_to_with_icon": "{icon} {replyTo}",
+    "broken_reply": "Message belongs to the thread but is not a reply",
     "reply_to_with_arg": "{replyToWithIcon} {user}",
     "mentions": "Mentions",
     "replies_list": "Replies:",

From 9fc7991808ad8f8700a060848f1c46c9838614cd Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 22 Jul 2026 21:42:59 +0300
Subject: [PATCH 4/4] use Timeago for timestamps

---
 src/components/chat_message/chat_message.js  | 11 ++---------
 src/components/chat_message/chat_message.vue | 11 ++++++++++-
 2 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/src/components/chat_message/chat_message.js b/src/components/chat_message/chat_message.js
index ec1b53517..01bac858e 100644
--- a/src/components/chat_message/chat_message.js
+++ b/src/components/chat_message/chat_message.js
@@ -13,6 +13,7 @@ import StatusContent from 'src/components/status_content/status_content.vue'
 import StatusPopover from 'src/components/status_popover/status_popover.vue'
 import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
 import UserPopover from 'src/components/user_popover/user_popover.vue'
+import Timeago from 'src/components/timeago/timeago.vue'
 
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInterfaceStore } from 'src/stores/interface'
@@ -54,17 +55,9 @@ const ChatMessage = {
     UserPopover,
     StatusPopover,
     MentionLink,
+    Timeago,
   },
   computed: {
-    // Returns HH:MM (hours and minutes) in local time.
-    createdAt() {
-      const time = this.chatItem.data.created_at
-      return time.toLocaleTimeString('en', {
-        hour: '2-digit',
-        minute: '2-digit',
-        hour12: false,
-      })
-    },
     isStatus() {
       // ChatMessage only has account_id while Status has full user data
       return !!this.message.user
diff --git a/src/components/chat_message/chat_message.vue b/src/components/chat_message/chat_message.vue
index b4f8bc30e..bc50d56a6 100644
--- a/src/components/chat_message/chat_message.vue
+++ b/src/components/chat_message/chat_message.vue
@@ -167,7 +167,16 @@
                         spin
                       />
                     </span>
-                    {{ createdAt }}
+                    {{ ' ' }}
+                    <router-link
+                      class="timeago faint"
+                      :to="{ name: 'conversation', params: { id: message.id } }"
+                    >
+                      <Timeago
+                        :time="message.created_at"
+                        :auto-update="60"
+                      />
+                    </router-link>
                   </span>
                 </template>
               </StatusContent>