Skip to content

Commit

Permalink
feat: InterviewSetQuestionList 컴포넌트 구현 완료
Browse files Browse the repository at this point in the history
- 문제집에 질문을 추가하는 기능 구현
  • Loading branch information
milk717 committed Nov 29, 2023
1 parent 402b885 commit 141938c
Showing 1 changed file with 66 additions and 0 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
import { css } from '@emotion/react';
import { theme } from '@styles/theme';
import QuestionAccordion from '@common/QuestionAccordion/QuestionAccordion';
import AnswerSelectionModal from '@common/QuestionSelectionBox/AnswerSelectionModal/AnswerSelectionModal';
import { QuestionAnswerSelectionModal } from '@atoms/modal';
import { useRecoilState } from 'recoil';
import QuestionAddForm from '@common/QuestionSelectionBox/QuestionAddForm';
import useQuestionWorkbookQuery from '@hooks/apis/queries/useQuestionWorkbookQuery';

type InterviewSetQuestionListProps = {
workbookId: number;
};
const InterviewSetQuestionList: React.FC<InterviewSetQuestionListProps> = ({
workbookId,
}) => {
const { data: workbookQuestionList } = useQuestionWorkbookQuery({
workbookId,
enabled: true,
});
const [{ isOpen, question: selectedQuestion }, setModalState] =
useRecoilState(QuestionAnswerSelectionModal);

if (!workbookQuestionList) return null;

return (
<div
css={css`
display: flex;
flex-direction: column;
row-gap: 1rem;
padding: 1rem;
background-color: ${theme.colors.surface.inner};
`}
>
<QuestionAddForm workbookId={workbookId} />
<div
css={css`
display: flex;
flex-direction: column;
`}
>
<AnswerSelectionModal
isOpen={isOpen}
workbookId={workbookId}
question={selectedQuestion ?? workbookQuestionList[0]}
closeModal={() =>
setModalState((pre) => ({
...pre,
isOpen: false,
}))
}
/>
{workbookQuestionList?.map((question) => (
<QuestionAccordion
key={question?.questionId}
question={question}
workbookId={workbookId}
isSelected={true}
/>
))}
</div>
</div>
);
};

export default InterviewSetQuestionList;

0 comments on commit 141938c

Please sign in to comment.