fix: incorrectly post a sub comment when posting a main comment

Author: guansss

src/components/viewer/comment/CommentArea.tsx

@@ -61,10 +61,7 @@ export const CommentArea = withSuspensable(function ViewerComments({
 
   // clear replyTo if it's not in comments
   useEffect(() => {
-    if (
-      replyTo &&
-      !traverseComments(comments, (c) => c.commentId === replyTo.commentId)
-    ) {
+    if (replyTo && !traverseComments(comments, (c) => c === replyTo)) {
       setReplyTo(undefined)
     }
   }, [replyTo, comments])
@@ -82,7 +79,7 @@ export const CommentArea = withSuspensable(function ViewerComments({
   return (
     <CommentAreaContext.Provider value={contextValue}>
       <div>
-        <CommentForm className="mb-6" />
+        <CommentForm primary className="mb-6" />
         {comments.map((comment) => (
           <MainComment
             key={comment.commentId}
@@ -291,7 +288,6 @@ const CommentActions = ({
       </div>
       {replyTo === comment && (
         <CommentForm
-          embedded
           inputAutoFocus
           className="mt-4"
           placeholder={`回复 @${comment.uploader}:`}

src/components/viewer/comment/CommentForm.tsx

@@ -12,14 +12,14 @@ import { CommentAreaContext } from './CommentArea'
 
 export interface CommentFormProps {
   className?: string
-  embedded?: boolean
+  primary?: boolean
   placeholder?: string
   inputAutoFocus?: boolean
 }
 
 export const CommentForm = ({
   className,
-  embedded,
+  primary,
   placeholder = '发表一条评论吧',
   inputAutoFocus,
 }: CommentFormProps) => {
@@ -46,7 +46,17 @@ export const CommentForm = ({
     try {
       await wrapErrorMessage(
         (e) => '发表评论失败：' + formatError(e),
-        requestAddComment(message, operationId, replyTo?.commentId),
+        (async () => {
+          if (primary) {
+            // this comment is a main comment and does not reply to others
+            await requestAddComment(message, operationId)
+          } else {
+            if (!replyTo) {
+              throw new Error('要回复的评论不存在')
+            }
+            await requestAddComment(message, operationId, replyTo?.commentId)
+          }
+        })(),
       )
 
       setMessage('')
@@ -78,7 +88,7 @@ export const CommentForm = ({
           loading={isSubmitting}
           onClick={handleSubmit}
         >
-          {embedded ? '回复' : '发表评论'}
+          {primary ? '发表评论' : '回复'}
         </Button>
 
         <div className="ml-auto text-slate-500 text-sm">