[Feat] 서류 합불 여부에 따른 my page 지원상태 조건부 렌더링

[eonseok-jeon]

Related Issue : Closes #265

---

🧑‍🎤 Summary

• 서류 합격 여부에 따른 문구 조건부 렌더링
• 서류 불합격이면 최종 결과 확인 못하게 하기
• custom hook 사용되는 곳으로 폴더 이동

🧑‍🎤 Screenshot

🧑‍🎤 Comment

조금 로직이 복잡했었어요

	서류 제출 완료	~	서류 확인 시작	~	서류 확인 마감	~	면접 기간 끝	~	최종 확인 시작	~	최종 확인 끝
지원 상태		제출 완료		결과 확인		서류 합격		서류 합격		결과 확인
						서류 불합격		서류 불합격		서류 불합격
지원서		지원서 확인		지원서 확인		지원서 확인		제출 완료		제출 완료

이렇게 되어야 해요

1.

{NoMoreScreeningResult && NoMoreFinalResult && (
  <MyInfoItem
    label="지원상태"
    value={applicationPass == null ? '제출 완료' : applicationPass ? '서류 합격' : '서류 불합격'}
  />
)}

결과 확인이 불가능 할 때의 지원상태를 렌더링합니다
서류 확인 전에는 applicationPass가 null이라 제출 완료를 표시하고 이후에는 true / false 이므로 서류 합격 혹은 서류 불합격을 표시해요

2.

{!NoMoreScreeningResult && <StatusButton label="지원상태" to="/result" trackingEvent="click-my-result" />}

서류 합격 확인 기간에는 결과 확인 버튼을 표시해요
참고로 StatusButton은 반복되는 부분을 컴포넌트로 분리한 겁니다!

공통된 부분 코드

<li className={buttonValue}>
  <span className={infoLabel}>{label}</span>
  <Button isLink to={to} className={buttonWidth} onClick={() => track(trackingEvent)} padding="15x25">
    {label === '지원서' ? '지원서 확인' : '결과 확인'}
  </Button>
</li>

3.

{!NoMoreFinalResult &&
  (applicationPass ? (
    <StatusButton label="지원상태" to="/result" trackingEvent="click-my-result" />
  ) : (
    <MyInfoItem label="지원상태" value="서류 불합격" />
  ))}

최종 합격 확인 기간에는 applicationPass 여부에 따라 결과 확인 또는 서류 불합격을 표시해요
위의 서류 합격 확인 기간과 합칠 수 없었던 이유는
서류 합격 결과를 가지고 조건부 렌더링 하기 때문에
만약 !NoMoreFinalResult 이 아닌 !NoMoreScreeningResult || !NoMoreFinalResult 로 할 경우,
서류 확인 기간에 지원자가 서류 탈락일 때 결과 확인 버튼이 아닌 서류 불합격 텍스트가 나타나게 되어 따로 분리해줬습니다

4.

{NoMoreReview ? (
  <MyInfoItem label="지원서" value="제출 완료" />
) : (
  <StatusButton label="지원서" to="/review" trackingEvent="click-my-review" />
)}

위의 3개는 지원 상태에 대한 처리였고 이 마지막 하나는 지원서에 대한 로직 처리예요
면접 기간이 끝나면 지원서 다시보기가 불가능하게 해놨어요

[height]

Link Height tasks by mentioning a task ID in the pull request title or commit messages, or description and comments with the keyword link (e.g. "Link T-123").

💡Tip: You can also use "Close T-X" to automatically close a task when the pull request is merged.

[cloudflare-workers-and-pages]

Deploying sopt-recruiting-frontend with    Cloudflare Pages

Latest commit:	706f1ae
Status:	✅  Deploy successful!
Preview URL:	https://2a3ab1bf.sopt-recruiting-frontend.pages.dev
Branch Preview URL:	https://feat--265-pass-or-nonpass.sopt-recruiting-frontend.pages.dev

View logs

[lydiacho]

와 꼼꼼히 케이스 다 따지시느라 고생 너무 많으셨습니다 깔끔하네요 ㅠㅠㅠ
조건들도 같은 버튼을 렌더링하는 친구들끼리는 조건을 유기적으로 잘 엮어보는게 좋지 않을까 하여 고민해보았는데, 코드가독성도 너무 떨어지게 되고 문제될 케이스 없을 것 같아서 이대로가 충분히 좋은 것 같습니다
💯