SuggestionPopover.tsx 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. import { Popover } from "antd";
  2. import { useEffect, useState } from "react";
  3. import SentCell from "./SentCell";
  4. import type { ISentence } from "../SentEdit"
  5. import { useAppSelector } from "../../../hooks";
  6. import { prInfo, refresh } from "../../../reducers/pr-load";
  7. import store from "../../../store";
  8. interface IWidget {
  9. book: number;
  10. para: number;
  11. start: number;
  12. end: number;
  13. channelId: string;
  14. }
  15. const SuggestionPopoverWidget = ({
  16. book,
  17. para,
  18. start,
  19. end,
  20. channelId,
  21. }: IWidget) => {
  22. const [open, setOpen] = useState(false);
  23. const [sentData, setSentData] = useState<ISentence>();
  24. const pr = useAppSelector(prInfo);
  25. useEffect(() => {
  26. if (pr) {
  27. if (
  28. book === pr.book &&
  29. para === pr.paragraph &&
  30. start === pr.word_start &&
  31. end === pr.word_end &&
  32. channelId === pr.channel.id
  33. ) {
  34. setSentData({
  35. id: pr.id,
  36. content: pr.content,
  37. html: pr.html,
  38. book: pr.book,
  39. para: pr.paragraph,
  40. wordStart: pr.word_start,
  41. wordEnd: pr.word_end,
  42. editor: pr.editor,
  43. channel: { name: pr.channel.name, id: pr.channel.id },
  44. updateAt: pr.updated_at,
  45. });
  46. setOpen(true);
  47. }
  48. }
  49. }, [book, channelId, end, para, pr, start]);
  50. const handleOpenChange = (newOpen: boolean) => {
  51. setOpen(newOpen);
  52. if (newOpen === false) {
  53. store.dispatch(refresh(null));
  54. }
  55. };
  56. return (
  57. <Popover
  58. placement="bottomRight"
  59. arrowPointAtCenter
  60. content={
  61. <div>
  62. <SentCell value={sentData} key={1} isPr={true} showDiff={false} />
  63. </div>
  64. }
  65. title={`${sentData?.editor.nickName}提交的修改建议`}
  66. trigger="click"
  67. open={open}
  68. onOpenChange={handleOpenChange}
  69. >
  70. <span></span>
  71. </Popover>
  72. );
  73. };
  74. export default SuggestionPopoverWidget;