feat: Now loading bubble appears only after 300ms if not sent

seed-ecosystem · Jan 12, 2025 · 35266e3 · 35266e3
1 parent 3c0e657
commit 35266e3
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 4 deletions.
diff --git a/src/modules/main/chat-list/logic/chat-list-logic.ts b/src/modules/main/chat-list/logic/chat-list-logic.ts
@@ -6,7 +6,6 @@ import {WorkerStateHandle} from "@/modules/umbrella/logic/worker-state-handle.ts
 import {updateLastMessage} from "@/modules/main/chat-list/logic/update-last-message.ts";
 import {Cancellation} from "@/coroutines/cancellation.ts";
 import {ChatListStateHandle} from "@/modules/main/chat-list/logic/chat-list-state-handle.ts";
-import {ChatStateHandle} from "@/modules/main/logic/chat-state-handle.ts";
 
 export type ChatListEvent = {
   type: "chats";

diff --git a/src/modules/main/chat/components/messages-list.tsx b/src/modules/main/chat/components/messages-list.tsx
@@ -25,8 +25,7 @@ export const MessagesList = memo((
 
         <ChatMessageList
           dataLength={messages.length}
-          next={() => {
-          }}
+          next={() => {}}
           hasMore={false}
           style={{display: 'flex', flexDirection: 'column-reverse'}}>
           {messages.map((message) => {

diff --git a/src/modules/main/chat/logic/send-message.ts b/src/modules/main/chat/logic/send-message.ts
@@ -46,7 +46,7 @@ export function sendMessage(
   const message: Message = {
     content,
     failure: false,
-    loading: true,
+    loading: !worker.isConnected(), // Loading after 200ms
     localNonce: localNonce,
     serverNonce: null
   };
@@ -55,7 +55,15 @@ export function sendMessage(
 
   chatListStateHandle.popUp(chatId, content, 0);
 
+  let messageSent: boolean;
+
+  setTimeout(() => {
+    if (messageSent) return;
+    editMessage({ ...message, loading: true });
+  }, 300);
+
   worker.sendMessage({ chatId, content }).then(serverNonce => {
+    messageSent = true;
     if (serverNonce != null) {
       editMessage({
         ...message,