Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: 커피챗 오픈/수정 로직 구현 #1604

Merged
merged 14 commits into from
Oct 30, 2024
Merged

Conversation

seojisoosoo
Copy link
Member

@seojisoosoo seojisoosoo commented Oct 25, 2024

한 브랜치에 넘 많은 작업을 했습니다... 반성합니다.,,

🤫 쉿, 나한테만 말해줘요. 이슈넘버

  • close #

🧐 어떤 것을 변경했어요~?

  • 커피챗 오픈/수정 로직을 구현했어요.

🤔 그렇다면, 어떻게 구현했어요~?

react-hook-form 사용

  • yup으로 작성한 스키마의 에러 메시지가 자동으로 잡힐 수 있도록 methods의 handleSubmit을 사용하기 위해, 각 필드에 다 Controller를 붙여주었어요.

에러 발생 시, 인풋 필드 자동 포커싱

  • 에러가 발생한 필드 중에서 가장 첫번째 필드로 포커싱되도록 스크롤 이벤트를 넣어주었습니다. (onError)

커피챗 업로드 여부를 묻는 모달 구현

  • 모든 필드에 에러가 없다면 모달이 띄워지는 onOpen함수를 실행하도록 했어요, 원래는 mds의 open(option) useDialog 훅을 사용하려고 했는데, open(option) 함수가 submit 타입과 맞지 않는다는 에러가 나서 mds 다이얼로그 컴포넌트를 조합해 다이얼로그를 직접 구현해주었습니다.

❤️‍🔥 당신이 생각하는 PR포인트, 내겐 매력포인트.

  • [수정완료됨] 필드에 넣을 수 있는 값이 백엔드와 싱크가 맞지 않아서 지금 400에러가 납니다...! 이 부분은 예준이에게 요청해두었어요.
    • ex. 프론트에서 주는 값 : 주니어 (0~3년) / 서버에서 받을 수 있는 값 : 주니어
  • 업로드 후 리패치 및 라우터 이동, 커피챗 수정 시의 데이터 패칭 작업이 TODO 로 남아있습니다! 이 부분은 커피챗 홈이랑 상세 페이지 연결하면서 채워둘게요!
  • select v2가 다른 필드보다 위계가 뒤로 잡혀서 가려지는 현상이 있어 mds 측에 문의했어요!
  • 로직 구현하면서도 스토리북에 이슈없도록 신경썼어요!

📸 스크린샷, 없으면 이것 참,, 섭섭한데요?

스크린샷 2024-10-26 오전 12 37 17 스크린샷 2024-10-26 오전 12 37 36

Copy link

height bot commented Oct 25, 2024

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.

Copy link

github-actions bot commented Oct 25, 2024

✨✨ 스토리북으로 확인하기 ✨✨

Copy link

github-actions bot commented Oct 25, 2024

🚀 프리뷰 배포 확인하기 🚀

https://7df2d1b1.sopt-internal-dev.pages.dev

@seojisoosoo seojisoosoo self-assigned this Oct 25, 2024
@seojisoosoo seojisoosoo marked this pull request as ready for review October 25, 2024 15:38
@github-actions github-actions bot requested a review from hayounSong October 25, 2024 15:38
Copy link
Contributor

@hayounSong hayounSong left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

고생했어!!!

<ChipsWrapper {...field}>
{chipList.map((chip) => (
<div
key={chip}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

꼼꼼한 key 설정 너무 좋아요

value={field.value ?? ''}
placeholder='ex. 디자인 관련 고민이 있다면, 함께 나눠봐요!'
maxLength={40}
isError={!!errors.coffeeChatInfo?.bio}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

여길 느낌표 2개로 구현해준 이유가 있을까요?!

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

아하 이거 errors.coffeeChatInfo?.bio가 있으면 true, 없으면 false라는 의미로 쓰고 싶어서 boolean 타입이 되어지도록 !!을 붙여주었습니다!

onSuccess: async () => {
// TODO: 쿼리 무효화 및 페이지 이동 처리
// queryClient.invalidateQueries({ queryKey: 'coffeechat' });
// await router.push(playgroundLink.coffeechat());
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

여기 향후를 위한 코드 너무 좋은 것 같아유 배워갑니다

@seojisoosoo seojisoosoo merged commit c79355e into feat/#1593 Oct 30, 2024
5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants