From c57e495d6810ee1c6f40960c677a0374442a526a Mon Sep 17 00:00:00 2001
From: Bagasbanuna02 <bagasbanuna02@gmail.com>
Date: Fri, 10 May 2024 16:38:09 +0800
Subject: [PATCH] Loading chat otomatis

---
 src/app/dev/colab/detail/grup/[id]/page.tsx   |  2 +-
 src/app_modules/colab/detail/group/index.tsx  | 54 +++++++++----------
 src/app_modules/colab/detail/grup/index.tsx   | 54 ++++++++++---------
 .../get/room_chat/get_message_by_room_id.ts   |  5 +-
 4 files changed, 60 insertions(+), 55 deletions(-)

diff --git a/src/app/dev/colab/detail/grup/[id]/page.tsx b/src/app/dev/colab/detail/grup/[id]/page.tsx
index ffc00e30..d03cec6e 100644
--- a/src/app/dev/colab/detail/grup/[id]/page.tsx
+++ b/src/app/dev/colab/detail/grup/[id]/page.tsx
@@ -6,7 +6,7 @@ import _ from "lodash";
 export default async function Page({ params }: { params: { id: string } }) {
   let roomId = params.id;
   const userLoginId = await user_getOneUserId();
-  let listMsg = await colab_getMessageByRoomId(roomId, 1);
+  let listMsg = await colab_getMessageByRoomId({ page: 1, roomId: roomId });
 
   return (
     <>
diff --git a/src/app_modules/colab/detail/group/index.tsx b/src/app_modules/colab/detail/group/index.tsx
index 579ecdea..bd9bb4f7 100644
--- a/src/app_modules/colab/detail/group/index.tsx
+++ b/src/app_modules/colab/detail/group/index.tsx
@@ -57,36 +57,36 @@ export default function Colab_GroupChatView({
 
   const viewport = useRef<HTMLDivElement>(null);
 
-  const next = async (direction: ScrollDirection) => {
-    try {
-      setIsLoading(true);
-      await new Promise((a) => setTimeout(a, 500));
+  // const next = async (direction: ScrollDirection) => {
+  //   try {
+  //     setIsLoading(true);
+  //     await new Promise((a) => setTimeout(a, 500));
 
-      const newData = await colab_getMessageByRoomId({
-        roomId: selectRoom?.id,
-        page: totalPage + 1,
-      });
-      setTotalPage(totalPage + 1);
+  //     const newData = await colab_getMessageByRoomId({
+  //       roomId: selectRoom?.id,
+  //       page: totalPage + 1,
+  //     });
+  //     setTotalPage(totalPage + 1);
 
-      // console.log(newData, "loading baru");
+  //     // console.log(newData, "loading baru");
 
-      if (_.isEmpty(newData)) {
-        setIsGet(false);
-      } else {
-        const d =
-          direction === "down" ? [...data, ...newData] : [...newData, ...data];
-        setData(d);
-      }
-    } finally {
-      setIsLoading(false);
-    }
-  };
+  //     if (_.isEmpty(newData)) {
+  //       setIsGet(false);
+  //     } else {
+  //       const d =
+  //         direction === "down" ? [...data, ...newData] : [...newData, ...data];
+  //       setData(d);
+  //     }
+  //   } finally {
+  //     setIsLoading(false);
+  //   }
+  // };
 
-  const ref = useInfiniteScroll({
-    next,
-    rowCount: data.length,
-    hasMore: { up: isGet },
-  });
+  // const ref = useInfiniteScroll({
+  //   next,
+  //   rowCount: data.length,
+  //   hasMore: { up: isGet },
+  // });
 
   useShallowEffect(() => {
     mqtt_client.subscribe(selectRoom.id);
@@ -186,7 +186,7 @@ export default function Colab_GroupChatView({
           <Box h={"80vh"}>
             <Stack justify="flex-end" h={"100%"}>
               <div
-                ref={ref as any}
+                // ref={ref as any}
                 style={{
                   overflowY: "auto",
                 }}
diff --git a/src/app_modules/colab/detail/grup/index.tsx b/src/app_modules/colab/detail/grup/index.tsx
index 728af392..cf72edca 100644
--- a/src/app_modules/colab/detail/grup/index.tsx
+++ b/src/app_modules/colab/detail/grup/index.tsx
@@ -53,36 +53,35 @@ export default function Colab_DetailGrupDiskusi({
   const [data, setData] = useState<any[]>(listMsg as any);
   const [page, setPage] = useState(1);
   const [isLoading, setIsLoading] = useState(false);
-  const [scroll, scrollTo] = useWindowScroll();
   const [isGet, setIsGet] = useState(true);
 
-  const next = async (direction: ScrollDirection) => {
-    try {
-      setIsLoading(true);
-      await new Promise((a) => setTimeout(a, 100));
+  // const next = async (direction: ScrollDirection) => {
+  //   try {
+  //     setIsLoading(true);
+  //     await new Promise((a) => setTimeout(a, 100));
 
-      setPage(page + 1);
-      const newData = await colab_getMessageByRoomId(roomId, page + 1);
+  //     setPage(page + 1);
+  //     const newData = await colab_getMessageByRoomId(roomId, page + 1);
 
-      console.log(newData);
+  //     console.log(newData);
 
-      if (_.isEmpty(newData)) {
-        setIsGet(false);
-      } else {
-        setData((prev) => (direction === "up" ? [...newData, ...prev] : []));
-      }
-    } finally {
-      setIsLoading(false);
-    }
-  };
+  //     if (_.isEmpty(newData)) {
+  //       setIsGet(false);
+  //     } else {
+  //       setData((prev) => (direction === "up" ? [...newData, ...prev] : []));
+  //     }
+  //   } finally {
+  //     setIsLoading(false);
+  //   }
+  // };
 
-  const ref = useInfiniteScroll({
-    next,
-    rowCount: data.length,
-    hasMore: { up: isGet },
-    scrollThreshold: 0.1,
-    initialScroll: { top: 100 },
-  });
+  // const ref = useInfiniteScroll({
+  //   next,
+  //   rowCount: data.length,
+  //   hasMore: { up: isGet },
+  //   scrollThreshold: 0.1,
+  //   initialScroll: { top: 100 },
+  // });
 
   useShallowEffect(() => {
     mqtt_client.subscribe(roomId);
@@ -93,7 +92,9 @@ export default function Colab_DetailGrupDiskusi({
   }, [setData]);
 
   async function onList(setData: any) {
-    await colab_getMessageByRoomId(roomId, page).then((val) => setData(val));
+    await colab_getMessageByRoomId({ page: page, roomId: roomId }).then((val) =>
+      setData(val)
+    );
   }
 
   async function onSend() {
@@ -107,12 +108,13 @@ export default function Colab_DetailGrupDiskusi({
     });
   }
 
+
+
   return (
     <>
       <Box h={"80vh"} bg={"blue.1"}>
         <Stack justify="flex-end" h={"100%"}>
           <div
-            ref={ref as any}
             style={{
               // overflow: "scroll",
               overflowY: "auto",
diff --git a/src/app_modules/colab/fun/get/room_chat/get_message_by_room_id.ts b/src/app_modules/colab/fun/get/room_chat/get_message_by_room_id.ts
index 2f0fdfce..28c00f0b 100644
--- a/src/app_modules/colab/fun/get/room_chat/get_message_by_room_id.ts
+++ b/src/app_modules/colab/fun/get/room_chat/get_message_by_room_id.ts
@@ -41,5 +41,8 @@ export default async function colab_getMessageByRoomId({
     },
   });
 
-  return getList;
+
+  const reverse = _.reverse(getList)
+
+  return reverse;
 }