Mobile chat fixes (#3610)

* stuff * stuff
coral-xyz · Apr 5, 2023 · ce85ac7 · ce85ac7 · vercel · Apr 5, 2023
1 parent ee210b5
commit ce85ac7
Show file tree

Hide file tree

Showing 3 changed files with 72 additions and 58 deletions.
diff --git a/packages/app-mobile/src/screens/Unlocked/Chat/ChatDetailScreen.tsx b/packages/app-mobile/src/screens/Unlocked/Chat/ChatDetailScreen.tsx
@@ -8,7 +8,11 @@ import { Video, ResizeMode, AVPlaybackStatus } from "expo-av";
 import { CHAT_MESSAGES } from "@coral-xyz/common";
 import { createEmptyFriendship } from "@coral-xyz/db";
 import { useUser, useAvatarUrl } from "@coral-xyz/recoil";
-import { SignalingManager, useChatsWithMetadata } from "@coral-xyz/tamagui";
+import {
+  fetchMoreChatsFor,
+  SignalingManager,
+  useChatsWithMetadata,
+} from "@coral-xyz/tamagui";
 import { GiftedChat, MessageVideoProps } from "react-native-gifted-chat";
 import { v4 as uuidv4 } from "uuid";
 
@@ -58,48 +62,47 @@ export function ChatDetailScreen({
   const user = useUser();
   const avatarUrl = useAvatarUrl();
 
-  // TODO(kirat)
   const [isLoadingEarlier, setIsLoadingEarlier] = useState(false);
   const { chats } = useChatsWithMetadata({
     room: roomId.toString(),
     type: roomType,
   });
 
-  // TODO(kirat) load earlier chats
-  const onLoadEarlier = () => {
+  const onLoadEarlier = async () => {
     setIsLoadingEarlier(true);
-    GiftedChat.prepend([], [], Platform.OS !== "web");
-
-    setTimeout(() => {
-      setIsLoadingEarlier(false);
-    }, 250);
+    try {
+      await fetchMoreChatsFor(user.uuid, roomId.toString(), roomType);
+    } catch (e) {
+      console.error(e);
+    }
+    setIsLoadingEarlier(false);
   };
 
   const [messages, setMessages] = useState([]);
 
   useEffect(() => {
-    // TODO(kirat) messages are coming in in reverse order, despite `inverted={true}`
-    // assuming this might have something to do with the time stamps being incorrect?
-    const _messages = chats.map((x) => {
-      return {
-        _id: x.client_generated_uuid,
-        text: x.message,
-        createdAt: formatDate(x.created_at),
-        received: x.received,
-        sent: true,
-        pending: false,
-        // Videos / images follow this format
-        // video:
-        //   "https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ElephantsDream.mp4",
-        // image:
-        //   "https://d33wubrfki0l68.cloudfront.net/7e97b18b02060f1d4b65a5850b49e2488da391bb/d60ff/img/homepage/dissection/3.png",
-        user: {
-          _id: x.uuid,
-          name: x.username,
-          avatar: x.image,
-        },
-      };
-    });
+    const _messages = chats
+      .map((x) => {
+        return {
+          _id: x.client_generated_uuid,
+          text: x.message,
+          createdAt: formatDate(x.created_at),
+          received: x.received,
+          sent: true,
+          pending: false,
+          // Videos / images follow this format
+          // video:
+          //   "https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ElephantsDream.mp4",
+          // image:
+          //   "https://d33wubrfki0l68.cloudfront.net/7e97b18b02060f1d4b65a5850b49e2488da391bb/d60ff/img/homepage/dissection/3.png",
+          user: {
+            _id: x.uuid,
+            name: x.username,
+            avatar: x.image,
+          },
+        };
+      })
+      .reverse();
 
     setMessages(_messages);
   }, []);
@@ -125,7 +128,7 @@ export function ChatDetailScreen({
           last_message: messageText,
           last_message_client_uuid: client_generated_uuid,
           remoteUsername,
-          id: roomId,
+          id: roomId.toString(),
         });
 
         SignalingManager.getInstance().onUpdateRecoil({

diff --git a/packages/app-mobile/src/screens/Unlocked/Chat/ChatHelpers.ts b/packages/app-mobile/src/screens/Unlocked/Chat/ChatHelpers.ts
@@ -121,9 +121,15 @@ const getAllChatStuff = ({
       chatType: "individual" as SubscriptionType,
     })),
   ].sort((a, b) =>
-    // TODO(kirat) lastMessageTimestamp vs. last_message_timestamp
     // @ts-ignore
-    a.last_message_timestamp < b.last_message_timestamp ? -1 : 1
+    (a.chatType === "individual"
+      ? new Date(a.chatProps.last_message_timestamp).getTime()
+      : new Date(a.chatProps.lastMessageTimestamp)) <
+    (b.chatType === "individual"
+      ? new Date(b.chatProps.last_message_timestamp).getTime()
+      : new Date(b.chatProps.lastMessageTimestamp).getTime())
+      ? 1
+      : -1
   );
 
   return parseChats(allChats);

diff --git a/packages/tamagui-core/src/chat/fetchMoreChatsFor.tsx b/packages/tamagui-core/src/chat/fetchMoreChatsFor.tsx
@@ -45,34 +45,39 @@ export const fetchMoreChatsFor = async (
   ];
 
   const qs = params.join("&");
-  const json = await makeBackendApiRequest(`chats?${qs}`, {
-    method: "GET",
-    jwt,
-  });
-  const chats: MessageWithMetadata[] = json.chats;
+  try {
+    const json = await makeBackendApiRequest(`chat?${qs}`, {
+      method: "GET",
+      jwt,
+    });
+    const chats: MessageWithMetadata[] = json.chats;
 
-  SignalingManager.getInstance().onUpdateRecoil({
-    type: "chat",
-    payload: {
+    SignalingManager.getInstance().onUpdateRecoil({
+      type: "chat",
+      payload: {
+        uuid,
+        room,
+        type,
+        chats: chats.map((chat) => ({
+          ...chat,
+          direction: uuid === chat.uuid ? "send" : "recv",
+          received: true,
+          from_http_server: 1,
+        })),
+      },
+    });
+
+    await bulkAddChats(
       uuid,
-      room,
-      type,
-      chats: chats.map((chat) => ({
+      chats.map((chat) => ({
         ...chat,
         direction: uuid === chat.uuid ? "send" : "recv",
         received: true,
         from_http_server: 1,
-      })),
-    },
-  });
-
-  await bulkAddChats(
-    uuid,
-    chats.map((chat) => ({
-      ...chat,
-      direction: uuid === chat.uuid ? "send" : "recv",
-      received: true,
-      from_http_server: 1,
-    }))
-  );
+      }))
+    );
+  } catch (e) {
+    console.log("Error found :(");
+    console.log(JSON.stringify(e));
+  }
 };