Feat/#164 MonthPicker, DatePicker에 날짜 선택 안함 버튼 추가

[leeleeleeleejun]

#️⃣연관된 이슈

• [Feature] MonthPicker, DatePicker에 날짜 선택 안함 버튼 추가 #164

📝작업 내용

현재 날짜 선택 후 다시 취소할 수 있는 방법이 없어
MonthPicker, DatePicker에 날짜 선택 안함 버튼 추가

스크린샷 (선택)

💬리뷰 요구사항(선택)

리뷰어가 특별히 봐주었으면 하는 부분이 있다면 작성해주세요

Summary by CodeRabbit

• 새로운 기능

  • 날짜 및 월 선택기에서 선택을 해제할 수 있는 버튼을 추가했습니다.
  • 선택 해제 시 값이 null로 전달되고 선택기가 자동으로 닫힙니다.
  • 날짜 변경 시 API 형식으로 변환하는 공통 기능을 제공합니다.

• 개선 사항

  • 프로필, 온보딩, 이력서 입력 화면의 날짜 처리 방식을 통일했습니다.
  • 날짜 선택 콜백이 선택 해제 상태도 지원하도록 개선했습니다.
  • 관련 컴포넌트 안내 문구를 업데이트했습니다.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
28th-web-team-1-fe	Ready	Preview	Aug 12, 2026 5:46am

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: fee978d0-fa2e-41d0-ae3a-b64ded9c1128

📥 Commits

Reviewing files that changed from the base of the PR and between 9098db0 and 20038bf.

📒 Files selected for processing (11)

• src/shared/lib/date.ts
• src/shared/lib/index.ts
• src/shared/ui/date_picker/DatePicker.stories.tsx
• src/shared/ui/date_picker/DatePicker.tsx
• src/shared/ui/month_picker/MonthPicker.stories.tsx
• src/shared/ui/month_picker/MonthPicker.tsx
• src/views/mypage/ui/profile/AwardSection.tsx
• src/views/mypage/ui/profile/CertificateSection.tsx
• src/views/mypage/ui/profile/LanguageSection.tsx
• src/views/onboarding/ui/ResumeFieldInput.tsx
• src/views/resume_edit/ui/form/FormDatePicker.tsx

---

Walkthrough

DatePicker와 MonthPicker에 선택 해제 버튼을 추가했습니다. 날짜 변환 로직을 dateToApiDate로 통합했습니다. 관련 화면은 nullable 날짜 값을 처리합니다.

Changes

날짜 선택 및 변환

Layer / File(s)	Summary
날짜 API 변환 유틸리티 src/shared/lib/date.ts, src/shared/lib/index.ts	monthToApiDate가 null을 반환할 수 있도록 변경되었습니다. dateToApiDate가 추가되고 재-export되었습니다.
선택 해제 동작 src/shared/ui/date_picker/DatePicker.tsx, src/shared/ui/date_picker/DatePicker.stories.tsx, src/shared/ui/month_picker/MonthPicker.tsx, src/shared/ui/month_picker/MonthPicker.stories.tsx	두 선택 컴포넌트에 선택 해제 버튼을 추가했습니다. 버튼은 onChange(null)을 호출하고 팝오버를 닫습니다.
날짜 입력 화면 통합 src/views/mypage/ui/profile/*Section.tsx, src/views/onboarding/ui/ResumeFieldInput.tsx, src/views/resume_edit/ui/form/FormDatePicker.tsx	각 화면이 직접 문자열 치환 또는 dayjs 변환 대신 dateToApiDate를 사용합니다.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Possibly related issues

• YAPP-Github/28th-Web-Team-1-FE issue 164: DatePicker와 MonthPicker의 “날짜 선택 안함” 동작을 구현하는 변경과 직접 연결됩니다.

Possibly related PRs

• YAPP-Github/28th-Web-Team-1-FE#115: 동일한 프로필 날짜 선택 화면과 nullable 날짜 변환 흐름을 수정합니다.
• YAPP-Github/28th-Web-Team-1-FE#92: 같은 날짜 유틸리티 모듈의 monthToApiDate 도입과 연결됩니다.
• YAPP-Github/28th-Web-Team-1-FE#71: src/shared/lib/date.ts의 날짜 변환 유틸리티 변경과 직접 연결됩니다.

Suggested labels: ✨ Feature

Suggested reviewers: optshj

Poem

토끼가 달력 아래 깡충,
“날짜 선택 안함” 버튼을 톡.
null을 전하고 팝오버는 닫혀,
날짜 변환은 한곳에 모여,
폼은 새 API 길을 달려요. 🐇

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	PR 제목은 MonthPicker와 DatePicker에 날짜 선택 해제 버튼을 추가하는 주요 변경 사항을 명확하게 설명합니다.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/#164

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[github-actions]

🚀storybook: https://6a263d3313574544fa940c79-lafuqvkqwb.chromatic.com/

[optshj]

좋습니다~

혹시 선택 안 함 버튼이 디자인에서 만들어준건가요?
아니라면 보여드리구, 디자인 고칠지 물어보면 좋아보입니다!

[leeleeleeleejun]

좋습니다~

혹시 선택 안 함 버튼이 디자인에서 만들어준건가요? 아니라면 보여드리구, 디자인 고칠지 물어보면 좋아보입니다!

넵 디자인팀에서 작업해주셨습니당