From 71496c4e30cc59097c416a1be45e3f85a40ac5bb Mon Sep 17 00:00:00 2001 From: Hentry Martin Date: Sun, 23 Nov 2025 00:44:54 +0100 Subject: [PATCH] feat: implemented edit comment --- .../src/lib/assets/icons/icon-edit-reply.svg | 3 ++ src/apps/review/src/lib/assets/icons/index.ts | 2 ++ .../AiFeedbackActions/AiFeedbackActions.tsx | 19 ++++++++-- .../AiFeedbackComments/AiFeedbackComment.tsx | 35 +++++++++++++++++-- .../AiFeedbackReply/AiFeedbackReply.tsx | 18 +++++++--- .../src/lib/services/scorecards.service.ts | 7 ++-- 6 files changed, 73 insertions(+), 11 deletions(-) create mode 100644 src/apps/review/src/lib/assets/icons/icon-edit-reply.svg diff --git a/src/apps/review/src/lib/assets/icons/icon-edit-reply.svg b/src/apps/review/src/lib/assets/icons/icon-edit-reply.svg new file mode 100644 index 000000000..b9cf53e09 --- /dev/null +++ b/src/apps/review/src/lib/assets/icons/icon-edit-reply.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/apps/review/src/lib/assets/icons/index.ts b/src/apps/review/src/lib/assets/icons/index.ts index d1c6b61fd..03920d463 100644 --- a/src/apps/review/src/lib/assets/icons/index.ts +++ b/src/apps/review/src/lib/assets/icons/index.ts @@ -20,6 +20,7 @@ import { ReactComponent as IconThumbsUp } from './icon-thumb-up.svg' import { ReactComponent as IconThumbsDown } from './icon-thumbs-down.svg' import { ReactComponent as IconThumbsUpFilled } from './icon-thumb-up-filled.svg' import { ReactComponent as IconThumbsDownFilled } from './icon-thumbs-down-filled.svg' +import { ReactComponent as IconEditReply } from './icon-edit-reply.svg' export * from './editor/bold' export * from './editor/code' @@ -59,6 +60,7 @@ export { IconThumbsDown, IconThumbsUpFilled, IconThumbsDownFilled, + IconEditReply, } export const phasesIcons = { diff --git a/src/apps/review/src/lib/components/Scorecard/ScorecardViewer/ScorecardQuestion/AiFeedbackActions/AiFeedbackActions.tsx b/src/apps/review/src/lib/components/Scorecard/ScorecardViewer/ScorecardQuestion/AiFeedbackActions/AiFeedbackActions.tsx index a69c84c91..6974ffaa1 100644 --- a/src/apps/review/src/lib/components/Scorecard/ScorecardViewer/ScorecardQuestion/AiFeedbackActions/AiFeedbackActions.tsx +++ b/src/apps/review/src/lib/components/Scorecard/ScorecardViewer/ScorecardQuestion/AiFeedbackActions/AiFeedbackActions.tsx @@ -3,6 +3,7 @@ import { FC, useCallback, useContext, useEffect, useState } from 'react' import { mutate } from 'swr' import { + IconEditReply, IconReply, IconThumbsDown, IconThumbsDownFilled, @@ -11,7 +12,7 @@ import { } from '~/apps/review/src/lib/assets/icons' import { ReviewAppContext } from '~/apps/review/src/lib/contexts' import { useReviewsContext } from '~/apps/review/src/pages/reviews/ReviewsContext' -import { updateLikesOrDislikesOnRunItem, updateLikesOrDislikesOnRunItemComment } from '~/apps/review/src/lib/services' +import { updateLikesOrDislikesOnRunItem, updateRunItemComment } from '~/apps/review/src/lib/services' import { EnvironmentConfig } from '~/config' import { ReviewAppContextModel, ReviewsContextModel } from '~/apps/review/src/lib/models' @@ -29,6 +30,7 @@ interface AiFeedbackActionsProps { comment?: AiFeedbackComment feedback?: any onPressReply: () => void + onPressEdit?: () => void } export const AiFeedbackActions: FC = props => { @@ -185,7 +187,7 @@ export const AiFeedbackActions: FC = props => { } try { - await updateLikesOrDislikesOnRunItemComment(workflowId, workflowRun.id, props.feedback.id, c.id, { + await updateRunItemComment(workflowId, workflowRun.id, props.feedback.id, c.id, { downVote: down, upVote: up, }) @@ -233,6 +235,19 @@ export const AiFeedbackActions: FC = props => { Reply + + { + props.onPressEdit && ( + + ) + } ) } diff --git a/src/apps/review/src/lib/components/Scorecard/ScorecardViewer/ScorecardQuestion/AiFeedbackComments/AiFeedbackComment.tsx b/src/apps/review/src/lib/components/Scorecard/ScorecardViewer/ScorecardQuestion/AiFeedbackComments/AiFeedbackComment.tsx index ad03040d7..cc73e23d8 100644 --- a/src/apps/review/src/lib/components/Scorecard/ScorecardViewer/ScorecardQuestion/AiFeedbackComments/AiFeedbackComment.tsx +++ b/src/apps/review/src/lib/components/Scorecard/ScorecardViewer/ScorecardQuestion/AiFeedbackComments/AiFeedbackComment.tsx @@ -4,7 +4,7 @@ import classNames from 'classnames' import moment from 'moment' import { useReviewsContext } from '~/apps/review/src/pages/reviews/ReviewsContext' -import { createFeedbackComment } from '~/apps/review/src/lib/services' +import { createFeedbackComment, updateRunItemComment } from '~/apps/review/src/lib/services' import { AiFeedbackItem, ReviewsContextModel } from '~/apps/review/src/lib/models' import { EnvironmentConfig } from '~/config' @@ -23,12 +23,17 @@ interface AiFeedbackCommentProps { export const AiFeedbackComment: FC = props => { const { workflowId, workflowRun }: ReviewsContextModel = useReviewsContext() + const [editMode, setEditMode] = useState(false) const [showReply, setShowReply] = useState(false) const onShowReply = useCallback(() => { setShowReply(!showReply) }, []) + const onPressEdit = useCallback(() => { + setEditMode(true) + }, []) + const onSubmitReply = useCallback(async (content: string, comment: AiFeedbackCommentType) => { await createFeedbackComment(workflowId as string, workflowRun?.id as string, props.feedback?.id, { content, @@ -37,6 +42,15 @@ export const AiFeedbackComment: FC = props => { await mutate(`${EnvironmentConfig.API.V6}/workflows/${workflowId}/runs/${workflowRun?.id}/items`) setShowReply(false) }, [workflowId, workflowRun?.id, props.feedback?.id]) + + const onEditReply = useCallback(async (content: string, comment: AiFeedbackCommentType) => { + await updateRunItemComment(workflowId as string, workflowRun?.id as string, props.feedback?.id, comment.id, { + content, + }) + await mutate(`${EnvironmentConfig.API.V6}/workflows/${workflowId}/runs/${workflowRun?.id}/items`) + setEditMode(false) + }, [workflowId, workflowRun?.id, props.feedback?.id]) + return (
= props => { .format('MMM DD, hh:mm A')}
- + { + !editMode && + } + { + editMode && ( + + ) + } { showReply && ( diff --git a/src/apps/review/src/lib/components/Scorecard/ScorecardViewer/ScorecardQuestion/AiFeedbackReply/AiFeedbackReply.tsx b/src/apps/review/src/lib/components/Scorecard/ScorecardViewer/ScorecardQuestion/AiFeedbackReply/AiFeedbackReply.tsx index 0fa8a4485..6cdeccffa 100644 --- a/src/apps/review/src/lib/components/Scorecard/ScorecardViewer/ScorecardQuestion/AiFeedbackReply/AiFeedbackReply.tsx +++ b/src/apps/review/src/lib/components/Scorecard/ScorecardViewer/ScorecardQuestion/AiFeedbackReply/AiFeedbackReply.tsx @@ -5,7 +5,7 @@ import { UseFormReturn, } from 'react-hook-form' import { get } from 'lodash' -import { FC, useCallback, useState } from 'react' +import { FC, useCallback, useEffect, useState } from 'react' import classNames from 'classnames' import { yupResolver } from '@hookform/resolvers/yup' @@ -17,8 +17,10 @@ import { FieldMarkdownEditor } from '../../../../FieldMarkdownEditor' import styles from './AiFeedbackReply.module.scss' interface AiFeedbackReplyProps { + id?: string + initialValue?: string onCloseReply: () => void - onSubmitReply: (content: string) => Promise + onSubmitReply: (content: string, id?: string) => Promise } export const AiFeedbackReply: FC = props => { @@ -36,9 +38,15 @@ export const AiFeedbackReply: FC = props => { resolver: yupResolver(formFeedbackReplySchema), }) + useEffect(() => { + if (props.initialValue) { + setReply(props.initialValue) + } + }, [props.initialValue]) + const onSubmit = useCallback(async (data: FormFeedbackReply) => { setSavingReply(true) - await props.onSubmitReply(data.reply) + await props.onSubmitReply(data.reply, props.id) setReply('') setSavingReply(false) }, [props.onSubmitReply, setReply]) @@ -80,7 +88,9 @@ export const AiFeedbackReply: FC = props => { className='filledButton' type='submit' > - Submit Reply + { + props.id ? 'Edit Reply' : 'Submit Reply' + }