DiscussionBox ->DiscussionDrawer

dashboard/src/components/template/SentEdit/SuggestionToolbar.tsx

@@ -1,11 +1,15 @@
 import { Divider, Space, Tooltip, Typography } from "antd";
 import { CommentOutlined, LikeOutlined } from "@ant-design/icons";
 import { ISentence } from "../SentEdit";
-import { useState } from "react";
-import CommentBox from "../../discussion/DiscussionBox";
+import { useEffect, useState } from "react";
+import CommentBox from "../../discussion/DiscussionDrawer";
 import SuggestionBox from "./SuggestionBox";
 import PrAcceptButton from "./PrAcceptButton";
 import { HandOutlinedIcon } from "../../../assets/icon";
+import store from "../../../store";
+import { count, show } from "../../../reducers/discussion";
+import { useAppSelector } from "../../../hooks";
+import { openPanel } from "../../../reducers/right-panel";
 
 const { Text, Paragraph } = Typography;
 
@@ -30,6 +34,16 @@ const SuggestionToolbarWidget = ({
   const [CommentCount, setCommentCount] = useState<number | undefined>(
     data.suggestionCount?.discussion
   );
+  const discussionCount = useAppSelector(count);
+
+  useEffect(() => {
+    if (
+      discussionCount?.resType === "sentence" &&
+      discussionCount.resId === data.id
+    ) {
+      setCommentCount(discussionCount.count);
+    }
+  }, [data.id, discussionCount]);
 
   return (
     <Paragraph type="secondary" style={style}>
@@ -63,27 +77,32 @@ const SuggestionToolbarWidget = ({
             }
           />
           {compact ? undefined : <Divider type="vertical" />}
+          <Tooltip title="讨论">
+            <Space
+              size={"small"}
+              style={{
+                cursor: "pointer",
+                color: CommentCount && CommentCount > 0 ? "#1890ff" : "unset",
+              }}
+              onClick={(event) => {
+                store.dispatch(
+                  show({
+                    type: "discussion",
+                    resId: data.id,
+                    resType: "sentence",
+                  })
+                );
+                store.dispatch(openPanel("discussion"));
+              }}
+            >
+              <CommentOutlined />
+              {CommentCount}
+            </Space>
+          </Tooltip>
           <CommentBox
             resId={data.id}
             resType="sentence"
-            trigger={
-              <Tooltip title="讨论">
-                <Space
-                  size={"small"}
-                  style={{
-                    cursor: "pointer",
-                    color:
-                      data.suggestionCount?.discussion &&
-                      data.suggestionCount?.discussion > 0
-                        ? "#1890ff"
-                        : "unset",
-                  }}
-                >
-                  <CommentOutlined />
-                  {CommentCount}
-                </Space>
-              </Tooltip>
-            }
+            trigger={<></>}
             onCommentCountChange={(count: number) => {
               setCommentCount(count);
             }}

dashboard/src/components/template/Wbw/WbwDetail.tsx

@@ -12,7 +12,7 @@ import { LockIcon, UnLockIcon } from "../../../assets/icon";
 import { UploadFile } from "antd/es/upload/interface";
 import { IAttachmentResponse } from "../../api/Attachments";
 import WbwDetailAttachment from "./WbwDetailAttachment";
-import CommentBox from "../../discussion/DiscussionBox";
+import CommentBox from "../../discussion/DiscussionDrawer";
 
 interface IWidget {
   data: IWbw;

dashboard/src/components/template/Wbw/WbwPali.tsx

@@ -13,7 +13,7 @@ import WbwDetail from "./WbwDetail";
 import { IWbw, TWbwDisplayMode } from "./WbwWord";
 import { bookMarkColor } from "./WbwDetailBookMark";
 import WbwVideoButton from "./WbwVideoButton";
-import CommentBox from "../../discussion/DiscussionBox";
+import CommentBox from "../../discussion/DiscussionDrawer";
 import PaliText from "./PaliText";
 import store from "../../../store";
 import { lookup } from "../../../reducers/command";