From 8aae0d00cdca609bead460e2503528ffbdf290d8 Mon Sep 17 00:00:00 2001
From: Steven <stevenlgtm@gmail.com>
Date: Thu, 5 Oct 2023 08:58:44 +0800
Subject: [PATCH] chore: fix fetch comments

---
 web/src/pages/MemoDetail.tsx      | 20 ++++++++------------
 web/src/store/reducer/memo.ts     |  2 +-
 web/src/store/reducer/resource.ts |  2 +-
 3 files changed, 10 insertions(+), 14 deletions(-)

diff --git a/web/src/pages/MemoDetail.tsx b/web/src/pages/MemoDetail.tsx
index e4d094cb..935c40eb 100644
--- a/web/src/pages/MemoDetail.tsx
+++ b/web/src/pages/MemoDetail.tsx
@@ -70,20 +70,12 @@ const MemoDetail = () => {
     }
 
     (async () => {
-      await fetchMemoComments();
+      const commentRelations = memo.relationList.filter((relation) => relation.relatedMemoId === memo.id && relation.type === "COMMENT");
+      const requests = commentRelations.map((relation) => memoStore.fetchMemoById(relation.memoId));
+      await Promise.all(requests);
     })();
   }, [memo?.relationList]);
 
-  const fetchMemoComments = async () => {
-    if (!memo) {
-      return;
-    }
-
-    const commentRelations = memo.relationList.filter((relation) => relation.relatedMemoId === memo.id && relation.type === "COMMENT");
-    const requests = commentRelations.map((relation) => memoStore.fetchMemoById(relation.memoId));
-    await Promise.all(requests);
-  };
-
   if (!memo) {
     return null;
   }
@@ -107,6 +99,10 @@ const MemoDetail = () => {
     toast.success(t("message.succeed-copy-link"));
   };
 
+  const handleCommentCreated = async () => {
+    await memoStore.fetchMemoById(memoId);
+  };
+
   return (
     <>
       <section className="relative top-0 w-full min-h-full overflow-x-hidden bg-zinc-100 dark:bg-zinc-900">
@@ -210,7 +206,7 @@ const MemoDetail = () => {
                 key={memo.id}
                 className="!border"
                 relationList={[{ memoId: UNKNOWN_ID, relatedMemoId: memo.id, type: "COMMENT" }]}
-                onConfirm={() => fetchMemoComments()}
+                onConfirm={handleCommentCreated}
               />
             )}
           </div>
diff --git a/web/src/store/reducer/memo.ts b/web/src/store/reducer/memo.ts
index c4aaa812..3f8718f0 100644
--- a/web/src/store/reducer/memo.ts
+++ b/web/src/store/reducer/memo.ts
@@ -14,7 +14,7 @@ const memoSlice = createSlice({
     upsertMemos: (state, action: PayloadAction<Memo[]>) => {
       return {
         ...state,
-        memos: uniqBy([...state.memos, ...action.payload], "id"),
+        memos: uniqBy([...action.payload, ...state.memos], "id"),
       };
     },
     createMemo: (state, action: PayloadAction<Memo>) => {
diff --git a/web/src/store/reducer/resource.ts b/web/src/store/reducer/resource.ts
index 5f87c413..b1709952 100644
--- a/web/src/store/reducer/resource.ts
+++ b/web/src/store/reducer/resource.ts
@@ -21,7 +21,7 @@ const resourceSlice = createSlice({
     upsertResources: (state, action: PayloadAction<Resource[]>) => {
       return {
         ...state,
-        resources: uniqBy([...state.resources, ...action.payload], "id"),
+        resources: uniqBy([...action.payload, ...state.resources], "id"),
       };
     },
     patchResource: (state, action: PayloadAction<Partial<Resource>>) => {