fix: load messages on scroll up, scroll down when sending messages and hide sending status for expired messages

src/app/chat/event_handling.nim

@@ -41,6 +41,7 @@ proc handleChatEvents(self: ChatController) =
   self.status.events.on("sendingMessage") do(e:Args):
     var msg = MessageArgs(e)
     self.status.messages.trackMessage(msg.id, msg.channel)
+    self.view.sendingMessage()
 
   self.status.events.on("messageSent") do(e:Args):
     var msg = MessageSentArgs(e)

src/app/chat/view.nim

@@ -117,6 +117,8 @@ QtObject:
 
   proc activeChannelChanged*(self: ChatsView) {.signal.}
 
+  proc sendingMessage*(self: ChatsView) {.signal.}
+
   proc userNameOrAlias*(self: ChatsView, pubKey: string): string {.slot.} =
     if self.status.chat.contacts.hasKey(pubKey):
       return status_ens.userNameOrAlias(self.status.chat.contacts[pubKey])

ui/app/AppLayouts/Chat/ChatColumn/ChatMessages.qml

@@ -23,6 +23,11 @@ ScrollView {
     ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
 
     function scrollToBottom(force, caller) {
+        if(force){
+            Qt.callLater( chatLogView.positionViewAtEnd )
+            return;
+        }
+
         if (!chatLogView.atYEnd) {
             // User has scrolled up, we don't want to scroll back
             return
@@ -53,6 +58,10 @@ ScrollView {
                 scrollToBottom(true)
             }
 
+            onSendingMessage: {
+                scrollToBottom(true)
+            }
+
             onMessagePushed: {
                 scrollToBottom()
             }
@@ -62,10 +71,15 @@ ScrollView {
             }
         }
 
-        onContentYChanged: {
+        property var loadMsgs : Backpressure.oneInTime(chatLogView, 500, function() { 
-            if(atYBeginning && !loadingMessages){
+            if(loadingMessages) return;
             loadingMessages = true;
             chatsModel.loadMoreMessages();
+        });
+
+        onContentYChanged: {
+            if(scrollY < 500){
+                loadMsgs();
             }
         }
 

ui/app/AppLayouts/Chat/ChatColumn/MessageComponents/ChatImage.qml

@@ -30,7 +30,7 @@ Rectangle {
                 imageChatBox.height = 0
                 imageChatBox.visible = false
             } else if (imageMessage.status == Image.Ready) {
-                messageItem.scrollToBottom(true, messageItem)
+                messageItem.scrollToBottom(false, messageItem)
             }
         }
     }

ui/app/AppLayouts/Chat/ChatColumn/MessageComponents/ImageMessage.qml

@@ -44,7 +44,7 @@ Rectangle {
                     imageChatBox.height = 0
                     imageChatBox.visible = false
                 } else if (imageMessage.status == Image.Ready) {
-                    messageItem.scrollToBottom(true, messageItem)
+                    messageItem.scrollToBottom(false, messageItem)
                 }
             }
         }

ui/app/AppLayouts/Chat/ChatColumn/MessageComponents/SentMessage.qml

@@ -4,7 +4,7 @@ import "../../../../../imports"
 
 StyledText {
     id: sentMessage
-    visible: isCurrentUser && !timeout && isMessage
+    visible: isCurrentUser && !timeout && !isExpired && isMessage
     color: Style.current.darkGrey
     text: outgoingStatus == "sent" ?
     //% "Sent"