-
Notifications
You must be signed in to change notification settings - Fork 1
feat: 모임 참여 현황 조회 api #24
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
Conversation
- 불필요한 globals.css 내용 삭제 - 무한 롤링 애니메이션 문제 수정
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Warning Rate limit exceeded
⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. Walkthrough회의 페이지를 정적 모의 데이터에서 API 기반 흐름으로 전환하고, 참가자 입장/출발 mutation 훅을 추가했으며 이미지 컴포넌트를 여러 모달 및 공유 페이지에 도입하고 전역 CSS 애니메이션 규칙을 조정했습니다. 메타데이터와 API fetch 옵션도 변경되었습니다. Changes
Sequence Diagram(s)sequenceDiagram
participant Browser as Browser (Client)
participant Storage as LocalStorage/Session
participant MeetingPage as Meeting Page Component
participant API as API Server
Browser->>Storage: myName 조회
Storage-->>Browser: myName 반환
MeetingPage->>API: GET /api/meeting/{id}/status (useCheckMeeting)
API-->>MeetingPage: meetingData (참가자, 상태)
Note over MeetingPage,API: 회의 상태 10초 간격 갱신
Browser->>MeetingPage: 역 선택 (클릭)
MeetingPage->>MeetingPage: myParticipant 구성 (useMemo)
MeetingPage->>API: POST /api/meeting/{id}/departure (useSetDeparture)
API-->>MeetingPage: SetDepartureResponse
MeetingPage->>Browser: /result/{id}로 라우팅
Estimated code review effort🎯 4 (Complex) | ⏱️ ~45 minutes Possibly related PRs
🚥 Pre-merge checks | ✅ 1 | ❌ 2❌ Failed checks (2 warnings)
✅ Passed checks (1 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches🧪 Generate unit tests (beta)
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. Comment |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 4
🤖 Fix all issues with AI agents
In `@app/meeting/`[id]/page.tsx:
- Around line 87-107: The useMemo for allParticipants references id inside
getRandomHexColor(id) but id is missing from the dependency array, causing stale
values; update the dependency array of the useMemo that defines allParticipants
(the memo that uses meetingData, myParticipant, myName) to also include id so
allParticipants is recomputed when id changes (ensure you reference the same id
variable used in getRandomHexColor).
- Around line 41-45: The effect reads persisted 'userId' from
localStorage/sessionStorage and calls setMyName inside useEffect, which ESLint
flags; instead initialize the state directly by passing an initializer function
to useState that reads localStorage.getItem('userId') ||
sessionStorage.getItem('userId') (remove the useEffect block), so update the
declaration that defines myName/setMyName to use a lazy initializer and delete
the useEffect that contains storedName and setMyName.
In `@app/page.tsx`:
- Around line 134-147: Remove the invalid Tailwind token "hover:paused]" from
the className on the scrolling container (the div using "animate-slide-smooth
..."), leaving "animate-slide-smooth" and the other utility classes intact;
because globals.css already implements ".animate-slide-smooth:hover {
animation-play-state: paused; }", no additional hover utility is needed—update
the className on the element that renders the PainPointTooltip sets (the div
containing the two PAIN_POINTS map blocks) to remove the erroneous token.
In `@lib/api.ts`:
- Around line 8-12: The fetch call currently forces credentials: 'include' and
overwrites any caller-provided value; update the call that creates response to
respect options.credentials by using the caller value if present and otherwise
applying a sensible default (e.g., options.credentials ?? 'same-origin' or
similar) so that passing credentials on the options object (or omitting it)
behaves correctly; locate the fetch invocation that spreads options and headers
(the line creating response) and change the credentials assignment to use
options.credentials when defined rather than always setting 'include'.
🧹 Nitpick comments (2)
hooks/api/query/useCheckMeeting.ts (1)
5-14:enabled옵션 추가를 권장합니다.
meetingId가 빈 문자열이거나 undefined일 때 불필요한 API 호출을 방지하기 위해enabled옵션을 추가하는 것이 좋습니다. 또한 queryKey를 더 구체적으로 지정하면 캐시 관리에 도움이 됩니다.♻️ 개선 제안
export const useCheckMeeting = (meetingId: string) => { return useQuery({ - queryKey: ['meeting', meetingId], + queryKey: ['meeting', meetingId, 'status'], queryFn: async () => { return apiGet<MeetingStatusResponse>(`/api/meeting/${meetingId}/status`); }, + enabled: !!meetingId, // 10초마다 갱신 (선택사항: 다른 사람이 들어오는걸 실시간으로 보고 싶다면) refetchInterval: 10000, }); };app/meeting/[id]/page.tsx (1)
98-98: 호선 정보 하드코딩 문제
line: '2호선'이 하드코딩되어 있습니다. 서버에서 호선 정보를 제공하지 않는다면, 로컬STATION_DATA에서 역 이름으로 조회하여 정확한 호선 정보를 표시하는 것이 좋습니다.♻️ 개선 제안
.map((p, index) => { + const stationInfo = STATION_DATA.find((s) => s.name === p.stationName); return { id: `other-${index}`, name: p.userName, station: p.stationName, - line: '2호선', // 서버에서 호선 정보가 없다면 임의값 혹은 추가 로직 필요 + line: stationInfo?.line || '알 수 없음', latitude: p.latitude, longitude: p.longitude, status: 'done', hexColor: getRandomHexColor(id), }; });
| <div className="w-full overflow-hidden opacity-80 md:mt-[62px] md:mb-[62px]"> | ||
| <div className="animate-slide-smooth hover:paused] flex w-max items-center will-change-transform"> | ||
| {/* 첫 번째 세트 */} | ||
| <div className="flex shrink-0 gap-7.5 pr-7.5"> | ||
| {PAIN_POINTS.map((text, index) => ( | ||
| <PainPointTooltip key={`original-${index}`} text={text} /> | ||
| ))} | ||
| </div> | ||
| {/* 두 번째 세트 */} | ||
| <div className="flex shrink-0 gap-7.5 pr-7.5"> | ||
| {PAIN_POINTS.map((text, index) => ( | ||
| <PainPointTooltip key={`copy-${index}`} text={text} /> | ||
| ))} | ||
| </div> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
hover:paused]는 잘못된 Tailwind 클래스입니다.
Line 135에서 hover:paused]는 유효하지 않은 클래스명입니다. 닫는 대괄호 ]가 포함되어 있고, Tailwind에는 paused라는 유틸리티가 없습니다.
globals.css에서 이미 .animate-slide-smooth:hover { animation-play-state: paused; }가 정의되어 있으므로 해당 클래스를 제거하면 됩니다.
🐛 수정 제안
- <div className="animate-slide-smooth hover:paused] flex w-max items-center will-change-transform">
+ <div className="animate-slide-smooth flex w-max items-center will-change-transform">🤖 Prompt for AI Agents
In `@app/page.tsx` around lines 134 - 147, Remove the invalid Tailwind token
"hover:paused]" from the className on the scrolling container (the div using
"animate-slide-smooth ..."), leaving "animate-slide-smooth" and the other
utility classes intact; because globals.css already implements
".animate-slide-smooth:hover { animation-play-state: paused; }", no additional
hover utility is needed—update the className on the element that renders the
PainPointTooltip sets (the div containing the two PAIN_POINTS map blocks) to
remove the erroneous token.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 1
🤖 Fix all issues with AI agents
In `@app/meeting/`[id]/page.tsx:
- Around line 82-103: The participants list sets line to a hardcoded '2호선' and
seeds hexColor with only meeting id, causing identical lines/colors; update the
allParticipants mapping so each participant derives line from their station (use
a helper like mapStationToLine(stationName) or consult meetingData.station
mapping) and seed colors per user (e.g., pass a unique seed such as
`${id}-${p.userId}` or p.userName into getRandomHexColor) instead of just id;
adjust references in the mapping where serverParticipants, p.stationName,
getRandomHexColor, and id are used and ensure myParticipant keeps its own
correct line/color generation using the same helpers.
🚀 PR 제목을 여기에 적어주세요
📝 변경사항
✅ 체크리스트
📸 스크린샷
💬 리뷰어 전달사항
Summary by CodeRabbit
릴리스 노트
New Features
UI/Style
Chores
Docs/Types