feat: add actions in review

Author: spaenleh

src/components/codeReview/CodeReviewBody.tsx

@@ -7,10 +7,12 @@ import React, { FC, Fragment } from 'react';
 import { Add } from '@mui/icons-material';
 import { IconButton, styled } from '@mui/material';
 
+import { APP_ACTIONS_TYPES } from '../../config/appActionsTypes';
 import { APP_DATA_TYPES, APP_DATA_VISIBILITY } from '../../config/appDataTypes';
 import { GENERAL_SETTINGS_NAME } from '../../config/appSettingsTypes';
 import { REVIEW_MODE_INDIVIDUAL } from '../../config/constants';
 import { SMALL_BORDER_RADIUS } from '../../config/layout';
+import { MUTATION_KEYS, useMutation } from '../../config/queryClient';
 import {
   CODE_REVIEW_ADD_BUTTON_CYPRESS,
   CODE_REVIEW_LINE_CONTENT_CYPRESS,
@@ -94,6 +96,11 @@ const CodeReviewBody: FC<Props> = () => {
   const allowComments = settings[GeneralSettingsKeys.AllowComments];
   const reviewMode = settings[GeneralSettingsKeys.ReviewMode];
   const { postAppData, comments } = useAppDataContext();
+  const { mutate: postAction } = useMutation<
+    unknown,
+    unknown,
+    { data: unknown; type: string }
+  >(MUTATION_KEYS.POST_APP_ACTION);
 
   const versionComments = comments?.filter((c) => c.data.codeId === codeId);
 
@@ -174,25 +181,30 @@ const CodeReviewBody: FC<Props> = () => {
                 <CommentEditor
                   onCancel={closeComment}
                   onSend={(text) => {
+                    const data = {
+                      content: text,
+                      line: i,
+                      // codeId corresponding to current code version
+                      codeId,
+                      // comment on top level has no parent
+                      parent: null,
+                      ...(multilineRange?.start &&
+                        multilineRange?.end && {
+                          multiline: multilineRange,
+                        }),
+                    };
                     postAppData({
-                      data: {
-                        content: text,
-                        line: i,
-                        // codeId corresponding to current code version
-                        codeId,
-                        // comment on top level has no parent
-                        parent: null,
-                        ...(multilineRange?.start &&
-                          multilineRange?.end && {
-                            multiline: multilineRange,
-                          }),
-                      },
+                      data,
                       type: APP_DATA_TYPES.COMMENT,
                       visibility:
                         reviewMode === REVIEW_MODE_INDIVIDUAL
                           ? APP_DATA_VISIBILITY.MEMBER
                           : APP_DATA_VISIBILITY.ITEM,
                     });
+                    postAction({
+                      data,
+                      type: APP_ACTIONS_TYPES.CREATE_COMMENT,
+                    });
                     closeComment();
                   }}
                 />

src/components/common/CommentActions.tsx

@@ -4,6 +4,8 @@ import { useTranslation } from 'react-i18next';
 import { Delete, Edit, Flag } from '@mui/icons-material';
 import { ListItemIcon, ListItemText, Menu, MenuItem } from '@mui/material';
 
+import { APP_ACTIONS_TYPES } from '../../config/appActionsTypes';
+import { MUTATION_KEYS, useMutation } from '../../config/queryClient';
 import { useAppDataContext } from '../context/AppDataContext';
 import { useCommentContext } from '../context/CommentContext';
 import { useReviewContext } from '../context/ReviewContext';
@@ -31,6 +33,11 @@ const CommentActions: FC<Props> = ({
   const comment = useCommentContext();
   const { editComment } = useReviewContext();
   const { deleteAppData } = useAppDataContext();
+  const { mutate: postAction } = useMutation<
+    unknown,
+    unknown,
+    { data: unknown; type: string }
+  >(MUTATION_KEYS.POST_APP_ACTION);
 
   return (
     <Menu
@@ -52,6 +59,10 @@ const CommentActions: FC<Props> = ({
         <MenuItem
           onClick={() => {
             editComment(comment.id);
+            postAction({
+              data: { comment },
+              type: APP_ACTIONS_TYPES.EDIT_COMMENT,
+            });
             onClose();
           }}
         >
@@ -65,6 +76,10 @@ const CommentActions: FC<Props> = ({
         <MenuItem
           onClick={() => {
             deleteAppData({ id: comment.id });
+            postAction({
+              data: { comment },
+              type: APP_ACTIONS_TYPES.DELETE_COMMENT,
+            });
             onClose();
           }}
         >
@@ -78,6 +93,10 @@ const CommentActions: FC<Props> = ({
         <MenuItem
           onClick={() => {
             onClickFlag?.();
+            postAction({
+              data: { comment },
+              type: APP_ACTIONS_TYPES.REPORT_COMMENT,
+            });
             onClose();
           }}
         >

src/components/common/CommentThread.tsx

@@ -5,8 +5,10 @@ import { useTranslation } from 'react-i18next';
 
 import { TextField, styled } from '@mui/material';
 
+import { APP_ACTIONS_TYPES } from '../../config/appActionsTypes';
 import { APP_DATA_TYPES } from '../../config/appDataTypes';
 import { BIG_BORDER_RADIUS } from '../../config/layout';
+import { MUTATION_KEYS, useMutation } from '../../config/queryClient';
 import { COMMENT_THREAD_CONTAINER_CYPRESS } from '../../config/selectors';
 import { CommentType } from '../../interfaces/comment';
 import { buildThread } from '../../utils/comments';
@@ -51,6 +53,11 @@ const CommentThread: FC<Props> = ({ children, hiddenState }) => {
     closeEditingComment,
   } = useReviewContext();
   const { patchAppData, postAppData } = useAppDataContext();
+  const { mutate: postAction } = useMutation<
+    unknown,
+    unknown,
+    { data: unknown; type: string }
+  >(MUTATION_KEYS.POST_APP_ACTION);
 
   const isEdited = (id: string): boolean => id === currentEditedCommentId;
   const isReplied = (id: string): boolean => id === currentRepliedCommentId;
@@ -108,14 +115,19 @@ const CommentThread: FC<Props> = ({ children, hiddenState }) => {
                 <CommentEditor
                   onCancel={closeComment}
                   onSend={(content) => {
+                    const data = {
+                      ...c.data,
+                      parent: c.id,
+                      content,
+                    };
                     postAppData({
-                      data: {
-                        ...c.data,
-                        parent: c.id,
-                        content,
-                      },
+                      data,
                       type: APP_DATA_TYPES.COMMENT,
                     });
+                    postAction({
+                      data,
+                      type: APP_ACTIONS_TYPES.RESPOND_COMMENT,
+                    });
                     closeComment();
                   }}
                   comment={{ ...c, data: { ...c.data, content: '' } }}

src/config/appActionsTypes.ts

@@ -9,4 +9,11 @@ export enum APP_ACTIONS_TYPES {
   CANCEL_PROMPT = 'cancel_prompt',
   INITIALIZE_EXECUTION = 'initialize_execution',
   NEW_FIGURE = 'new_figure',
+
+  // Review actions
+  CREATE_COMMENT = 'create_comment',
+  EDIT_COMMENT = 'edit_comment',
+  REPORT_COMMENT = 'report_comment',
+  DELETE_COMMENT = 'delete_comment',
+  RESPOND_COMMENT = 'respond_comment',
 }