Fix: 리드미 업데이트 및 탭키 수정 #557
Conversation
Walkthrough문서(README) 내용 업데이트 및 링크 추가/정정, Kakao 콜백 라우트에 주석 추가, 글로벌 CSS 경미한 정리, InputTrigger 비밀번호 토글 버튼의 레이아웃 클래스에서 세로 인셋 제거. Changes
Sequence Diagram(s)Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Possibly related PRs
Suggested reviewers
Poem
Tip 🔌 Remote MCP (Model Context Protocol) integration is now available!Pro plan users can now connect to remote MCP servers from the Integrations page. Connect with popular remote MCPs such as Notion and Linear to add more context to your reviews and chats. ✨ Finishing Touches
🧪 Generate unit tests
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. CodeRabbit Commands (Invoked using PR/Issue comments)Type Other keywords and placeholders
CodeRabbit Configuration File (
|
✅ Preview Deployment Ready!🔗 Preview URL: https://roam-ready-km650u6ae-yongmins-projects-bf5f7733.vercel.app This preview will be automatically updated on new commits. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (5)
src/app/api/auth/kakao/callback/route.ts (4)
107-116: 프로덕션 가드 추가 제안(404 반환).프로덕션에서 접근 불가하도록 초기 가드를 두세요.
export async function GET(request: NextRequest) { try { + // feature flag: 미사용 라우트 차단 + if (process.env.ENABLE_KAKAO_CALLBACK !== 'true') { + return NextResponse.json({ message: 'Not Found' }, { status: 404 }); + } + const code = request.nextUrl.searchParams.get('code'); const state = request.nextUrl.searchParams.get('state');
21-31: 환경 변수 누락 및 fetch 타임아웃 없음.런타임에서
NEXT_PUBLIC_KAKAO_REDIRECT_URI가 비어있어도 컴파일러가 숨깁니다. 또한 네트워크 행(hang)을 방지할 타임아웃이 없습니다.async function handleOauthSignUp( kakaoAuthCode: string, nickname: string, ): Promise<OAuthResponse> { + const redirectUri = process.env.NEXT_PUBLIC_KAKAO_REDIRECT_URI; + if (!redirectUri) { + throw Object.assign(new Error('서버 설정 오류: NEXT_PUBLIC_KAKAO_REDIRECT_URI 누락'), { status: 500 }); + } + + const controller = new AbortController(); + const timeout = setTimeout(() => controller.abort(), 10_000); const signUpResponse = await fetch( `${process.env.API_BASE_URL}${API_ENDPOINTS.OAUTH.SIGNUP_PROVIDER('kakao')}`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ token: kakaoAuthCode, nickname: nickname, - redirectUri: process.env.NEXT_PUBLIC_KAKAO_REDIRECT_URI!, + redirectUri, }), + signal: controller.signal, }, ); + clearTimeout(timeout);같은 패턴을
handleOauthSignIn(라인 57-67)에도 적용해 주세요. 실패 응답이 JSON이 아닐 가능성도 있어text()→ JSON 파싱 시도/폴백 처리 권장.
159-166: 문자열 매칭 의존 제거.백엔드 메시지(로캘/문구 변경)에 의존하면 취약합니다. 상태 코드만으로 분기하세요.
- if ( - (errorStatus === 409 || errorStatus === 400) && - errorMessage.includes('이미 등록된 사용자') - ) { + if (errorStatus === 409) {
124-139: OAuth state CSRF 검증 추가 필요.
state를intent:csrf형태로 전달하고,request.cookies.get('oauth_state')에 저장된 CSRF 토큰과 비교해야 합니다.- const [intent] = state.split(':'); + const [intent, csrf] = state.split(':'); + const cookieCsrf = request.cookies.get('oauth_state')?.value; + if (!csrf || !cookieCsrf || csrf !== cookieCsrf) { + throw Object.assign(new Error('잘못된 OAuth state 토큰입니다.'), { status: 400 }); + }src/shared/components/ui/input/InputTrigger.tsx (1)
58-66: 수직 정렬·클릭 타깃 보장 및 접근성 강화.
inset-y-0제거로 버튼 높이가 축소되어 클릭/탭 타깃이 작아졌을 수 있습니다. 수직 중앙 정렬과 포커스 링, 토글 의미 전달을 추가하세요.<button type='button' aria-label={isPasswordVisible ? '비밀번호 숨기기' : '비밀번호 보기'} aria-controls={id} + aria-pressed={isPasswordVisible} onClick={togglePasswordVisibility} disabled={disabled} className={cn( - 'absolute right-0 flex cursor-pointer items-center', + 'absolute right-0 top-1/2 -translate-y-1/2 flex cursor-pointer items-center p-8 min-w-[32px] min-h-[32px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary', className, )}
🧹 Nitpick comments (3)
src/app/api/auth/kakao/callback/route.ts (1)
10-17: JSDoc 타입명 불일치.주석은
OAuthSignupResponse/OAuthSigninResponse를 가리키지만 실제 반환은OAuthResponse입니다. 문서와 코드의 계약을 일치시켜 주세요.- * @returns {Promise<OAuthSignupResponse>} 성공 시, Zod 스키마로 유효성이 검증된 사용자 정보와 토큰을 포함한 응답 객체를 반환합니다. + * @returns {Promise<OAuthResponse>} 성공 시, Zod 스키마로 유효성이 검증된 사용자 정보와 토큰을 포함한 응답 객체를 반환합니다.- * @returns {Promise<OAuthSigninResponse>} 성공 시, Zod 스키마로 유효성이 검증된 사용자 정보와 토큰을 포함한 응답 객체를 반환합니다. + * @returns {Promise<OAuthResponse>} 성공 시, Zod 스키마로 유효성이 검증된 사용자 정보와 토큰을 포함한 응답 객체를 반환합니다.Also applies to: 47-53
src/shared/components/ui/input/InputTrigger.tsx (1)
35-36: JSDoc 파라미터 이름 불일치(triggerType vs type).실제 props는
triggerType인데 JSDoc은type으로 표기되어 있습니다. 문서 혼선을 줄이기 위해 맞춰 주세요.- * @param {'password-toggle' | 'file-upload' | 'base'} [props.type] - 트리거의 목적을 정의하는 타입. 기본값은 'base'. + * @param {'password-toggle' | 'file-upload' | 'base'} [props.triggerType] - 트리거의 목적을 정의하는 타입. 기본값은 'base'.README.md (1)
199-205: 트러블슈팅 항목 2건 추가 훌륭 — 메타정보 보강 제안.표에 게시일(예: YYYY-MM-DD) 또는 키워드(카카오/OAuth/BFF 등) 컬럼을 추가하면 탐색성이 더 좋아집니다.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
💡 Knowledge Base configuration:
- MCP integration is disabled by default for public repositories
- Jira integration is disabled by default for public repositories
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (4)
README.md(2 hunks)src/app/api/auth/kakao/callback/route.ts(1 hunks)src/app/global.css(0 hunks)src/shared/components/ui/input/InputTrigger.tsx(1 hunks)
💤 Files with no reviewable changes (1)
- src/app/global.css
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: vercel-preview
🔇 Additional comments (3)
src/shared/components/ui/input/InputTrigger.tsx (1)
58-76: 탭 이동 품질 검증 요청.이번 변경의 의도가 Tab 포커스 간섭 해소라면, 다음 시나리오를 실제 키보드로 재점검해 주세요.
- 패스워드 필드 포커스 → Tab → 토글 버튼 → Tab → 다음 필드로 이동
- Shift+Tab 역방향 이동
- 포커스 링 시인성(다크/라이트 테마)
README.md (2)
195-197: 링크 라벨 공백 제거 LGTM.불필요한 공백 제거로 렌더링 일관성이 좋아집니다.
348-349: Tailwind v4 참조 텍스트 갱신 LGTM.최신 용어(
@layer utilities) 반영 확인했습니다.
| @@ -1,3 +1,4 @@ | |||
| // 이 라우트는 최종 통합된 버전에서는 사용하지 않습니다. | |||
There was a problem hiding this comment.
주석만으로는 배포 차단 불가 — 라우트를 실제로 비활성화/제거하세요.
"최종 통합 버전에서는 사용하지 않음" 주석만으로는 프로덕션에서 URL이 노출될 수 있습니다. 최소한 기능 플래그나 NODE_ENV 가드로 실행 경로를 막아 주세요.
👻 관련 이슈 번호
👻 요약
👻 주요 변경 사항
👻 체크리스트
📷 UI 변경 사항
👻 문제 사항
👻 논의 사항
👻 기타 참고 사항
Summary by CodeRabbit