fix: comment data not reload, #5008

Author: hyifeng

packages/next-common/components/actions/commentActions.js

@@ -10,7 +10,7 @@ import { useUser } from "next-common/context/user";
 import useMentionList from "next-common/utils/hooks/useMentionList";
 import { getFocusEditor, getOnReply } from "next-common/utils/post";
 import { useChain } from "next-common/context/chain";
-import { usePageProps } from "next-common/context/page";
+import { useComments } from "next-common/context/post/comments";
 import { noop } from "lodash-es";
 import { useDispatch } from "react-redux";
 import { newErrorToast } from "next-common/store/reducers/toastSlice";
@@ -48,7 +48,7 @@ export default function CommentActions({
     user?.preference?.editor || "markdown",
   );
   const [isReply, setIsReply] = useState(false);
-  const { comments } = usePageProps();
+  const comments = useComments();
 
   const users = useMentionList(post, comments);
 

packages/next-common/hooks/usePostCommentsFilteredData.js

@@ -1,4 +1,4 @@
-import { useMemo, useState } from "react";
+import { useEffect, useMemo, useState } from "react";
 import { usePostCommentsData } from "./usePostComments";
 import { useContextApi } from "next-common/context/api";
 import { cloneDeep, every, has, map, orderBy, filter } from "lodash-es";
@@ -7,9 +7,9 @@ import { useGetAddressVotesDataFn } from "./useAddressVotesData";
 import { getAddressVotingBalance } from "next-common/utils/referendumUtil";
 import { useCommittedCommentFilterParams } from "next-common/components/comment/filter/utils";
 import { useIsDVAddressFn } from "./useIsDVAddress";
-import { useShallowCompareEffect } from "react-use";
 import { defaultSortBy } from "next-common/components/comment/filter/sorter";
 import { usePostCommentsMerging } from "./usePostCommentsMerging";
+import { normalizeAddress } from "next-common/utils/address";
 
 function isDeletedComment(comment) {
   return comment?.content?.trim?.() !== "[Deleted]";
@@ -30,13 +30,13 @@ export function usePostCommentsFilteredData() {
   const [, setCommentsMerging] = usePostCommentsMerging();
   const [mergedComments, setMergedComments] = useState(commentsData);
 
-  useShallowCompareEffect(() => {
+  useEffect(() => {
     setCommentsMerging(
       !every(mergedComments.items, (item) => has(item, "balance")),
     );
-  }, [mergedComments.items]);
+  }, [mergedComments.items, setCommentsMerging]);
 
-  useShallowCompareEffect(() => {
+  useEffect(() => {
     const data = cloneDeep(commentsData);
 
     merge();
@@ -55,12 +55,20 @@ export function usePostCommentsFilteredData() {
           ).toNumber();
 
           // merge balance
-          if (api) {
-            if (address) {
-              item.balance = await getAddressVotingBalance(api, address);
-            } else {
-              item.balance = 0;
+          try {
+            if (api) {
+              if (address) {
+                const normalizedAddress = normalizeAddress(address);
+                item.balance = await getAddressVotingBalance(
+                  api,
+                  normalizedAddress,
+                );
+              } else {
+                item.balance = 0;
+              }
             }
+          } catch (e) {
+            console.error(e);
           }
 
           return item;

packages/next-common/utils/referendumUtil.js

@@ -44,7 +44,7 @@ export function getThresholdOfSuperMajorityApprove(turnout, totalIssuance) {
 }
 
 export async function getAddressVotingBalance(api, address) {
-  const account = await api.query.system.account(address);
+  const account = await api?.query.system?.account(address);
   const jsonAccount = account?.toJSON();
   return jsonAccount?.data?.free;
 }