feat: Add lazy loading for images in TalkListContent

takoserver · Jul 15, 2024 · 23b9931 · 23b9931
1 parent 2e38a7d
commit 23b9931
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 82 deletions.
diff --git a/islands/ChatTalkContent.tsx b/islands/ChatTalkContent.tsx
@@ -2,6 +2,12 @@ import ChatDate from "../components/ChatDate.tsx";
 import ChatSendMessage from "../components/SendMessage.tsx";
 import ChatOtherMessage from "../components/OtherMessage.tsx";
 import { AppStateType } from "../util/types.ts";
+interface Messages {
+  messageid: string;
+  userName: string;
+  messages: string;
+  time: string;
+}
 function ChatTalkMain({ state }: { state: AppStateType }) {
   let SendPrimary = true;
   let OtherPrimary = true;
@@ -10,7 +16,6 @@ function ChatTalkMain({ state }: { state: AppStateType }) {
     <>
       {state.talkData.value.map((data: any, index: number) => {
         const date = new Date(data.time);
-
         const isEncodeDate = new Date(DateState).toLocaleDateString() !==
           date.toLocaleDateString();
         DateState = data.time;

diff --git a/islands/setDefaultState.tsx b/islands/setDefaultState.tsx
@@ -34,12 +34,15 @@ export default function setDefaultState({ state }: { state: AppStateType }) {
               state.friendid.value = data.friendid;
               state.roomName.value = roomInfo.nickName;
               setIschoiseUser(true, state.isChoiceUser);
-              const path = window.location.pathname;
               window.history.pushState(
                 "",
                 "",
                 "/talk/" + state.friendid.value,
               );
+              const talkData = fetch("/api/v2/client/talks/friend/data?friendid=" + state.friendid.value + "&limit=50");
+              talkData.then((res) => res.json()).then((res) => {
+                state.talkData.value = res.data;
+              });
             }
           }
           break;

diff --git a/routes/api/v2/client/talks/friend/data.ts b/routes/api/v2/client/talks/friend/data.ts
@@ -67,99 +67,60 @@ export const handler = {
         return new Response(JSON.stringify({ status: false, message: "Not friend" }), { status: 403, headers: { "Content-Type": "application/json" } });
       }
     }
+    let messagesData: Array<any> = [];
     //データベースからメッセージを取得
     if (!before && !after) {
-      const messagesData = await messages.find({ roomid: roomid }).sort({ _id: -1 }).limit(parseInt(limit));
-      const result = await Promise.all(messagesData.map(async (message) => {
-        const CacheUser = usersCache.get(message.userid);
-        if (CacheUser) {
-          return {
-            messageid: message.messageid,
-            userName: CacheUser.userName,
-            message: message.message,
-            timestamp: message.timestamp,
-          };
-        }
-        const userInfo = await users.findOne({ uuid: message.userid });
-        if (!userInfo) {
-          return {
-            messageid: message.messageid,
-            userName: "Unknown",
-            message: message.message,
-            timestamp: message.timestamp,
-          };
-        }
-        usersCache.set(message.userid, userInfo);
-        return {
-          messageid: message.messageid,
-          userName: userInfo.userName,
-          message: message.message,
-          timestamp: message.timestamp,
-        };
-      }));
-      return new Response(JSON.stringify({ status: true, message: "Success", data: result }), { status: 200, headers: { "Content-Type": "application/json" } });
+      messagesData = await messages.find({ roomid: roomid }).sort({ _id: -1 }).limit(parseInt(limit));
     } else if (before) {
       //そのメッセージの前のメッセージを取得
-        const messagesData = await messages.find({ roomid: roomid, messageid: { $lt: before } }).sort({ _id: -1 }).limit(parseInt(limit));
-      const result = await Promise.all(messagesData.map(async (message) => {
-        const CacheUser = usersCache.get(message.userid);
-        if (CacheUser) {
-          return {
-            messageid: message.messageid,
-            userName: CacheUser.userName,
-            message: message.message,
-            timestamp: message.timestamp,
-          };
-        }
-        const userInfo = await users.findOne({ uuid: message.userid });
-        if (!userInfo) {
-          return {
-            messageid: message.messageid,
-            userName: "Unknown",
-            message: message.message,
-            timestamp: message.timestamp,
-          };
-        }
-        usersCache.set(message.userid, userInfo);
-        return {
-          messageid: message.messageid,
-          userName: userInfo.userName,
-          message: message.message,
-          timestamp: message.timestamp,
-        };
-      }));
-      return new Response(JSON.stringify({ status: true, message: "Success", data: result }), { status: 200, headers: { "Content-Type": "application/json" } });
+        messagesData = await messages.find({ roomid: roomid, messageid: { $lt: before } }).sort({ _id: -1 }).limit(parseInt(limit));
     } else if (after) {
       //そのメッセージの後のメッセージを取得
-        const messagesData = await messages.find({ roomid: roomid, messageid: { $gt: after } }).sort({ _id: -1 }).limit(parseInt(limit));
-      const result = await Promise.all(messagesData.map(async (message) => {
+        messagesData = await messages.find({ roomid: roomid, messageid: { $gt: after } }).sort({ _id: -1 }).limit(parseInt(limit));
+    }
+    const result = await Promise.all(messagesData.map(async (message) => {
         const CacheUser = usersCache.get(message.userid);
         if (CacheUser) {
-          return {
-            messageid: message.messageid,
-            userName: CacheUser.userName,
-            message: message.message,
-            timestamp: message.timestamp,
-          };
+          if(message.messageType === "text") {
+            return {
+                messageid: message.messageid,
+                userName: CacheUser.userName,
+                message: message.message,
+                timestamp: message.timestamp,
+                type: message.type,
+              };
+          }
+        }
+        let userInfo
+        //= await users.findOne({ uuid: message.userid });
+        if(takos.splitUserName(message.userid).domain !== env["DOMAIN"]) {
+            const remoteFriend = await remoteFriends.findOne({ uuid: message.userid });
+            userInfo = remoteFriend;
+        } else {
+            userInfo = await users.findOne({ uuid: message.userid });
         }
-        const userInfo = await users.findOne({ uuid: message.userid });
         if (!userInfo) {
-          return {
-            messageid: message.messageid,
-            userName: "Unknown",
-            message: message.message,
-            timestamp: message.timestamp,
-          };
+          if(message.messageType === "text") {
+            return {
+                messageid: message.messageid,
+                userName: "Unknown",
+                message: message.message,
+                timestamp: message.timestamp,
+                type: message.type,
+              };
+          }
         }
         usersCache.set(message.userid, userInfo);
-        return {
-          messageid: message.messageid,
-          userName: userInfo.userName,
-          message: message.message,
-          timestamp: message.timestamp,
-        };
+        if(message.messageType === "text") {
+            return {
+                messageid: message.messageid,
+                userName: userInfo?.userName,
+                message: message.message,
+                timestamp: message.timestamp,
+                type: message.type,
+              };
+        }
       }));
       return new Response(JSON.stringify({ status: true, message: "Success", data: result }), { status: 200, headers: { "Content-Type": "application/json" } });
-    }
   },
 };