test: 회원가입 엑세스 토큰

[heeeeyong]

React-cookie 라이브러리를 이용해 쿠키읽어오는 방식을 테스트 중입니다.

Summary by CodeRabbit

• Refactor
  • 쿠키 기반 인증 토큰 처리 로직을 정리해 브라우저 쿠키에서 토큰을 일관되게 읽고 요청 헤더 설정을 안정화했습니다. UI 변화는 없습니다.
• Bug Fixes
  • 간헐적인 토큰 인식 실패를 줄여 회원가입 진행 중 인증 관련 오류 발생 가능성을 낮췄습니다.
• Chores
  • 쿠키 관리 강화를 위해 react-cookie 의존성을 추가했습니다.

[coderabbitai]

Caution

Review failed

The pull request is closed.

Walkthrough

루트 package.json에 react-cookie(^8.0.1) 의존성이 추가되었고, SignupGenre 페이지에서 쿠키 기반 토큰 조회를 useCookies로 우선 처리하도록 토큰 추출 로직이 동기화되어 변경되었습니다. 서버측 /users/me 검증 호출은 제거되고, document.cookie 파싱은 폴백으로 남아있습니다.

Changes

Cohort / File(s)	Summary of changes
Dependency Update package.json	react-cookie를 dependencies에 추가(^8.0.1). 다른 스크립트/의존성 변경 없음.
Signup Token Retrieval Refactor src/pages/signup/SignupGenre.tsx	useCookies 도입으로 Authorization 토큰을 쿠키에서 우선 조회. 동기 함수로 변경(비동기 제거) 및 호출부에서 await 제거. /users/me 서버 검증 호출 제거. document.cookie 파싱을 폴백으로 유지. 로깅 문구 업데이트. 토큰을 localStorage와 apiClient Authorization 헤더에 설정하는 흐름 유지.

Sequence Diagram(s)

sequenceDiagram
  participant U as User
  participant S as SignupGenre
  participant RC as react-cookie
  participant B as Browser(cookie)
  participant LS as localStorage
  participant API as apiClient

  U->>S: 페이지 진입
  S->>RC: useCookies로 Authorization 조회
  alt 토큰 존재
    S->>LS: token 저장
    S->>API: Authorization: Bearer {token} 설정
  else 토큰 없음
    S->>B: document.cookie 파싱(fallback)
    alt fallback 토큰 존재
      S->>LS: token 저장
      S->>API: Authorization 헤더 설정
    else 여전히 없음
      S-->>U: 토큰 없음 로그/처리
    end
  end

Loading

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Possibly related PRs

• feat: 소셜 로그인&회원가입 API 구현 #89: 동일 파일(src/pages/signup/SignupGenre.tsx)의 토큰/가입 흐름 및 Authorization 처리 변경과 직접적인 관련.

Suggested reviewers

• ho0010

Poem

쿠키를 훔친 토큰 한 알,
달래듯 꺼내어 헤더에 넣네 🐇
문서 쿠키는 예비 보따리,
로컬에 살포시 숨겨둔 뒤,
가입의 길로 깡충—출발! ✨

---

📜 Recent review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 36681eb and 642e633.

⛔ Files ignored due to path filters (1)

• pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (2)

• package.json (1 hunks)
• src/pages/signup/SignupGenre.tsx (4 hunks)

✨ Finishing Touches

• 📝 Generate Docstrings

🧪 Generate unit tests

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch feat/api-auth

---

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

• Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  • I pushed a fix in commit <commit_id>, please review it.
  • Open a follow-up GitHub issue for this discussion.
• Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query.
• PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
  • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

CodeRabbit Commands (Invoked using PR/Issue comments)

Type @coderabbitai help to get the list of available commands.

Other keywords and placeholders

• Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
• Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
• Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

• You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
• Please see the configuration documentation for more information.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Status, Documentation and Community

• Visit our Status Page to check the current availability of CodeRabbit.
• Visit our Documentation for detailed information on how to use CodeRabbit.
• Join our Discord Community to get help, request features, and share feedback.
• Follow us on X/Twitter for updates and announcements.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Project	Deployment	Preview	Comments	Updated (UTC)
thip	✅ Ready	Preview	Comment	Aug 12, 2025 0:43am