[FE] 약속 추천 페이지, 약속 결정 페이지 구현 #189
Conversation
Test Results5 tests 5 ✅ 3s ⏱️ Results for commit 9b2231a. ♻️ This comment has been updated with latest results. |
There was a problem hiding this comment.
항상 모킹 데이터를 먼저 만드는 모습 꼼꼼하네요 👍
| const formatTime = (time: string) => { | ||
| const hour = parseInt(time); | ||
| const hourPrefix = hour >= 12 ? '오후' : '오전'; | ||
|
|
||
| return `${hourPrefix} ${hour % 12 || 12}시`; | ||
| }; |
There was a problem hiding this comment.
[P3]
뭔가 제가 useTimeRangeDropdown.util.ts 파일에서 작성한 함수인 formatHours()와 결이 비슷한 함수같아요!
지금은 아니더라도 추후에 공통적으로 사용할 수 있도록 별도로 분리해도 좋겠습니다 :)
There was a problem hiding this comment.
공통된 부분은 나중에 따로 이슈를 파서 한 번에 반영하면 좋을 것 같아용
frontend/src/components/MeetingTimeCard/MeetingTimeOptionCard.tsx
Outdated
Show resolved
Hide resolved
frontend/src/pages/MeetingRecommendPage/components/MeetingTimeRecommends.tsx
Outdated
Show resolved
Hide resolved
frontend/src/hooks/useMeetingTimeRecommendFilter/useMeetingTimeRecommendFilter.ts
Outdated
Show resolved
Hide resolved
frontend/src/hooks/useMeetingTimeRecommendFilter/useMeetingTimeRecommendFilter.ts
Outdated
Show resolved
Hide resolved
| { value: 'earliest', label: '빠르게 만나고 싶어요' }, | ||
| { value: 'longTerm', label: '길게 만나고 싶어요' }, |
There was a problem hiding this comment.
[P3]
이거 뭔가뭔가 타입 narrow가 안되어있는데, 뭔가뭔가 나중에 수정해야할 듯 싶습니다.
| const { data: attendeeNames } = useQuery({ | ||
| queryKey: [QUERY_KEY.meetingMySchedule], | ||
| queryFn: () => getMeetingAttendees({ uuid }), | ||
| retry: 0, |
There was a problem hiding this comment.
[Q]
retry를 0으로 설정하신 이유가 있나요?
There was a problem hiding this comment.
디버깅용으로 잠시 설정해둔것이긴 한데, retry같은 경우는 공통 queryClient 객체를 설정할 때 저희만의 룰을 만들어가야할 것 같아요!! 지금은 0으로 임시 설정 해두는 것이 괜찮을 것 같아요!
| return ( | ||
| <div css={s_container}> | ||
| <section css={s_attendeesContainer}> | ||
| <button css={s_tabButton(isSelectedAllAttendee)} onClick={() => toggleAttendee('전체')}> |
There was a problem hiding this comment.
[P2]
낙타가 만들어준 공통 버튼 컴포넌트 사용해도 될 것 같네요!
There was a problem hiding this comment.
낙타가 만든 공통 컴포넌트에는 현재 active, inActive 스타일이 없어서 지금은 사용할 수 없을 것 같아욤 ㅎㅎ
|
|
||
| { | ||
| path: ':uuid/complete', | ||
| element: <MeetingLinkSharePage />, | ||
| }, |
There was a problem hiding this comment.
[P1]
로그인 PR에서 아래의 경로로 바꿨습니다! 적용 부탁드려요 :)
{
path: 'complete',
path: ':uuid/complete',
element: <MeetingLinkSharePage />,
},
- 모든 인원이 가장 빠르게, 가장 길게 만날 수 있는 시간 - 특정 인원이 가장 빠르게, 가장 길게 만날 수 있는 시간 - 약속 참여자들
- 고정된 width에서 컨텐츠의 너비를 보장할 수 있도록 변경
- 추천 컴포넌트는 div - 결정 컴포넌트는 click 이벤트 핸들링을 위해서 button
- 서버로부터 약속 참여자들 이름을 가져온 후, - useMeetingTimeRecommendFilter 커스텀 훅을 사용해서 UI를 구성
- 약속 추천 페이지 컴포넌트와, 사용하는 카드 컴포넌트만 다르고 나머지 구성 동일
- recommend, options 카드 컴폰넌트 공통 스타일을 묶은 스타일 객체 추가
hwinkr
force-pushed
the
feat/172-meeting-recommend-page
branch
from
cabda90
to
9b2231a
Compare
관련 이슈
작업 내용
약속 참여자들은 약속 추천 시간을 조회할 수 있습니다.
약속 주최자는 약속 시간 결정을 할 수 있습니다.
추천 페이지
결정 페이지
특이 사항
리뷰 요구사항 (선택)