diff --git a/src/pages/ProjectDetailPage/components/Comments/Comments.tsx b/src/pages/ProjectDetailPage/components/Comments/Comments.tsx index 9fd3149e..547f0277 100644 --- a/src/pages/ProjectDetailPage/components/Comments/Comments.tsx +++ b/src/pages/ProjectDetailPage/components/Comments/Comments.tsx @@ -1,7 +1,7 @@ import { Comment } from "api-models" -import CommentsForm from "./CommentsForm" -import CommentsList from "./CommentsList" +import CommentsForm from "./CommentsForm/CommentsForm" +import CommentsList from "./CommentsList/CommentsList" import CommentsLayout from "./Layout/CommentsLayout" export interface CommentsProps { diff --git a/src/pages/ProjectDetailPage/components/Comments/CommentsForm.tsx b/src/pages/ProjectDetailPage/components/Comments/CommentsForm/CommentsForm.tsx similarity index 84% rename from src/pages/ProjectDetailPage/components/Comments/CommentsForm.tsx rename to src/pages/ProjectDetailPage/components/Comments/CommentsForm/CommentsForm.tsx index d43bf99c..c70d76f0 100644 --- a/src/pages/ProjectDetailPage/components/Comments/CommentsForm.tsx +++ b/src/pages/ProjectDetailPage/components/Comments/CommentsForm/CommentsForm.tsx @@ -1,8 +1,4 @@ -// TODO: 1. 빈 값일때 처리(Toast로 구현) -// 2. 일정 높이 이상일때 높이가 늘어나지 않고 스크롤바 -// 3. ownerId는 userInfo에서 -// 3. 대댓글일때 parentId를 동적으로 받아야 하는 문제 해결 -// 4. isAnonymous 처리 +// TODO: 익명 처리 import { SubmitHandler, useForm } from "react-hook-form" import ResizeTextarea from "react-textarea-autosize" @@ -11,8 +7,8 @@ import { useUserInfoData } from "@services/caches/useUserInfoData" import { usePostCommentMutation } from "@pages/ProjectDetailPage/hooks/mutations/usePostCommentMutation" -import { CommentFormValues } from "../../types/commentFormValues" -import { ProjectIdProps, withProjectId } from "./Hoc/withProjectId" +import { CommentFormValues } from "../../../types/commentFormValues" +import { ProjectIdProps, withProjectId } from "../Hoc/withProjectId" interface CommentsFormProps extends ProjectIdProps { parentId?: number | null diff --git a/src/pages/ProjectDetailPage/components/Comments/CommentTitle.tsx b/src/pages/ProjectDetailPage/components/Comments/CommentsItem/CommentTitle.tsx similarity index 100% rename from src/pages/ProjectDetailPage/components/Comments/CommentTitle.tsx rename to src/pages/ProjectDetailPage/components/Comments/CommentsItem/CommentTitle.tsx diff --git a/src/pages/ProjectDetailPage/components/Comments/CommentsAvatar.tsx b/src/pages/ProjectDetailPage/components/Comments/CommentsItem/CommentsAvatar.tsx similarity index 94% rename from src/pages/ProjectDetailPage/components/Comments/CommentsAvatar.tsx rename to src/pages/ProjectDetailPage/components/Comments/CommentsItem/CommentsAvatar.tsx index 5e64075a..9d5ea277 100644 --- a/src/pages/ProjectDetailPage/components/Comments/CommentsAvatar.tsx +++ b/src/pages/ProjectDetailPage/components/Comments/CommentsItem/CommentsAvatar.tsx @@ -1,4 +1,3 @@ -// TODO: 전역으로 빼기 import { Avatar, AvatarProps } from "@chakra-ui/react" import { CommentUser } from "api-models" diff --git a/src/pages/ProjectDetailPage/components/Comments/CommentsButton.tsx b/src/pages/ProjectDetailPage/components/Comments/CommentsItem/CommentsButton.tsx similarity index 100% rename from src/pages/ProjectDetailPage/components/Comments/CommentsButton.tsx rename to src/pages/ProjectDetailPage/components/Comments/CommentsItem/CommentsButton.tsx diff --git a/src/pages/ProjectDetailPage/components/Comments/CommentsItem/CommentsEditFormText.tsx b/src/pages/ProjectDetailPage/components/Comments/CommentsItem/CommentsEditFormText.tsx new file mode 100644 index 00000000..7383354f --- /dev/null +++ b/src/pages/ProjectDetailPage/components/Comments/CommentsItem/CommentsEditFormText.tsx @@ -0,0 +1,72 @@ +import ResizeTextarea from "react-textarea-autosize" + +import { Box, HStack, Text, Textarea } from "@chakra-ui/react" + +import { CommentsItemProps } from "@pages/ProjectDetailPage/types/commentItem" + +import CommentsButton from "./CommentsButton" + +interface CommentsEditFormTextProps + extends Omit< + CommentsItemProps, + | "handleOnReply" + | "handleOffReply" + | "replyTargetCommentId" + | "handleNavigateProfile" + | "isReply" + > {} + +const CommentsEditFormText = ({ + comment, + handleOnEdit, + handleOffEdit, + handleDelete, + handleSubmit, + onSubmitEdit, + editTargetCommentId, + isEditing, + register, +}: CommentsEditFormTextProps) => { + return ( + +
+ + {editTargetCommentId === comment.id && isEditing ? ( +