Qnrr 392 면접 준비가 되면 면접 완료하기 작성할 수 있도록 수정

[aken-you]

🌱 연관된 이슈

Qnrr 392

☘️ 작업 내용

1. 작성 완료 버튼 disabled 수정

면접 준비하기와 완료하기 모달에서 "작성 완료" 버튼을 클릭하면 api 요청을 보냅니다.
응답이 오기 전까지 클릭하지 못하도록, 버튼의 disabled에 useMutation의 반환값인 isPending을 추가하였습니다.

2. Modal.Trigger

면접 완료하기 모달에서는 모달 렌더링 여부를 나타내는 isOpen 상태가 있습니다.
Modal.Trigger는 isOpen 없이도 모달 렌더링을 할 수 있다는 장점이 있으나, isOpen 상태가 이미 있어 사용하지 않아도 되긴 합니다. (이전에 이야기를 나눴던 내용입니다.)

그래서 면접 완료하기 모달에서는 Trigger를 사용하지 않았습니다.

면접 준비하기 모달에서는 isOpen 상태가 없어서 Modal.Trigger를 썼습니다. trigger는 기존의 Button 컴포넌트로 디자인되어 있어, Modal.Trigger에 asChild prop을 설정해뒀습니다.

<Modal.Trigger asChild>
        <Button size="medium">준비하기</Button>
</Modal.Trigger>

asChild를 사용하면 button이 중첩으로 있지 않게 됩니다.