diff --git a/src/components/AnswerContent/index.jsx b/src/components/AnswerContent/index.jsx index bbe50e9..d490723 100644 --- a/src/components/AnswerContent/index.jsx +++ b/src/components/AnswerContent/index.jsx @@ -22,6 +22,10 @@ const AnswerContent = ({ answer, name, imageSource, id, onAnswerSubmit }) => { imageSource: 'https://fastly.picsum.photos/id/772/200/200.jpg?hmac=9euSj4JHTPr7uT5QWVmeNJ8JaqAXY8XmJnYfr_DfBJc', }; + // if (answer) { + // console.log(answer); + // } + const location = useLocation(); const [textareaValue, setTextareaValue] = useState(''); const [updatedAnswer, setUpdatedAnswer] = useState(answer); diff --git a/src/components/AnswerRejection/index.jsx b/src/components/AnswerRejection/index.jsx new file mode 100644 index 0000000..2b568fe --- /dev/null +++ b/src/components/AnswerRejection/index.jsx @@ -0,0 +1,58 @@ +import PropTypes from 'prop-types'; +import { useState } from 'react'; +import { postAnswer } from 'api/answers'; +import { ReactComponent as Rejection } from 'assets/images/icons/ic_Rejection.svg'; + +const AnswerRejection = ({ id, setQuestionList }) => { + AnswerRejection.propTypes = { + id: PropTypes.number.isRequired, + setQuestionList: PropTypes.func.isRequired, + }; + + const [isLoading, setIsLoading] = useState(false); + const [error, setError] = useState(null); + + const handleRejection = async () => { + const defaultContent = 'reject'; + try { + setIsLoading(true); + setError(null); + + const result = await postAnswer(id, { + content: defaultContent, + isRejected: true, + }); + + setQuestionList((prevQuestions) => + prevQuestions.map((question) => { + if (question.id === id) { + return { ...question, answer: result }; + } + return question; + }), + ); + } catch (err) { + setError('답변 거절 중 오류가 발생했습니다.'); + } finally { + setIsLoading(false); + } + }; + + if (error) { + return
에러: {error}
; + } + + return ( + + ); +}; + +export default AnswerRejection; diff --git a/src/components/Kebab/index.jsx b/src/components/Kebab/index.jsx index 9ee37d6..c88c963 100644 --- a/src/components/Kebab/index.jsx +++ b/src/components/Kebab/index.jsx @@ -1,12 +1,12 @@ import PropTypes from 'prop-types'; import { useEffect, useRef } from 'react'; import QuestionDelete from 'components/QuestionDelete'; +import AnswerRejection from 'components/AnswerRejection'; import kebab from 'assets/images/icons/ic_Kebab.svg'; -import { ReactComponent as Rejection } from 'assets/images/icons/ic_Rejection.svg'; import { ReactComponent as Edit } from 'assets/images/icons/ic_Edit.svg'; import AnswerDelete from 'components/AnswerDelete'; -const Kebab = ({ id, isAnswer, isKebabOpen, onKebabClick, onDeleteQuestion, onAnswerDeleted }) => { +const Kebab = ({ id, isAnswer, isKebabOpen, onKebabClick, onDeleteQuestion, onAnswerDeleted, setQuestionList }) => { Kebab.propTypes = { id: PropTypes.number.isRequired, isAnswer: PropTypes.shape({ @@ -20,6 +20,7 @@ const Kebab = ({ id, isAnswer, isKebabOpen, onKebabClick, onDeleteQuestion, onAn onKebabClick: PropTypes.func.isRequired, onDeleteQuestion: PropTypes.func.isRequired, onAnswerDeleted: PropTypes.func.isRequired, + setQuestionList: PropTypes.func.isRequired, }; const menuRef = useRef(null); @@ -59,10 +60,7 @@ const Kebab = ({ id, isAnswer, isKebabOpen, onKebabClick, onDeleteQuestion, onAn {!isAnswer ? ( <>
- +
diff --git a/src/components/QnAList/index.jsx b/src/components/QnAList/index.jsx index 2a87c98..a5875e9 100644 --- a/src/components/QnAList/index.jsx +++ b/src/components/QnAList/index.jsx @@ -78,6 +78,7 @@ const QnAList = ({ name, imageSource, questionList, setQuestionList, onDeleteQue onClick={handleDeleteQuestion} onDeleteQuestion={handleDeleteQuestion} onAnswerDeleted={handleAnswerDeleted} + setQuestionList={setQuestionList} /> )}