Skip to content

develp branch 작업내용 머지 : develop -> main#90

Merged
heeeeyong merged 4 commits intomainfrom
develop
Aug 11, 2025
Merged

develp branch 작업내용 머지 : develop -> main#90
heeeeyong merged 4 commits intomainfrom
develop

Conversation

@heeeeyong
Copy link
Collaborator

@heeeeyong heeeeyong commented Aug 11, 2025

이하동일

Summary by CodeRabbit

  • New Features

    • 소셜 로그인: 카카오/구글 버튼 클릭 시 인증 페이지로 즉시 이동.
    • 회원가입: 닉네임 중복 검증 후 장르/별칭 선택과 가입 완료 처리.
    • 완료 화면에 닉네임·별칭을 동적으로 표시.
    • 닉네임 입력 제약(한글/영문 소문자/숫자) 및 오류 안내 추가.
  • Style

    • 회원가입 입력창 에러 상태(빨간 테두리)와 오류 메시지 스타일 추가.
  • Chores

    • 닉네임 검증, 가입, 별칭 조회 API 연동.

@vercel
Copy link

vercel bot commented Aug 11, 2025

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

Project Status Preview Comments Updated (UTC)
thip Ready Visit Preview 💬 Add feedback Aug 11, 2025 7:49pm

@coderabbitai
Copy link

coderabbitai bot commented Aug 11, 2025

Caution

Review failed

The pull request is closed.

Walkthrough

사용자 가입 흐름을 API 연동으로 전환하고, 닉네임 검증·장르(별칭) 선택·회원가입 완료 페이지 간 상태 전달을 추가했다. OAuth 로그인은 카카오/구글로 리다이렉트하도록 변경했다. 신규 API 클라이언트 모듈(getAlias, postNickname, postSignup)을 추가했고, 가입 입력/오류 스타일을 확장했다.

Changes

Cohort / File(s) Change Summary
Users API 추가
src/api/users/getAlias.ts, src/api/users/postNickname.ts, src/api/users/postSignup.ts
사용자 별칭 조회(getAlias), 닉네임 검증(postNickname), 회원가입(postSignup) API 래퍼 추가. 요청/응답 타입 정의 및 response.data 반환.
로그인 리다이렉트
src/pages/login/Login.tsx
카카오/구글 OAuth 엔드포인트로 전체 페이지 리다이렉트 구현(VITE_API_BASE_URL 기반). UI 구조는 유지하고 onClick 핸들러만 교체.
가입 닉네임 단계
src/pages/signup/SignupNickname.tsx
닉네임 입력 검증(한글/영문소문자/숫자), postNickname으로 중복 확인 후 성공 시 state로 닉네임 전달하며 /signup/genre 이동. 에러 상태 표시 및 스타일 연동.
가입 장르(별칭) 단계
src/pages/signup/SignupGenre.tsx
location.state에서 닉네임 수신, 쿠키에서 토큰 획득 후 apiClient 헤더 설정, postSignup 호출로 회원가입 진행. 선택 상태 구조 변경(selectedAlias) 및 다음 단계 네비게이션 시 aliasName·nickName 전달.
가입 완료 페이지
src/pages/signup/SignupDone.tsx
location.state에서 nickName·aliasName 수신, 없을 시 /signup/nickname으로 리다이렉트. UI 문구를 동적 값으로 대체. 뒤로가기 동작을 /signup/genre 이동으로 변경.
가입 스타일 확장
src/pages/signup/Signup.styled.ts
Container에 position: relative와 에러 메시지 스타일 추가. InputBox/StyledInput에 hasError prop 도입, 에러 시 테두리 색상 변경 및 트랜지션.

Sequence Diagram(s)

sequenceDiagram
  actor U as User
  participant L as Login Page
  participant B as Browser
  participant S as Auth Server

  U->>L: Click Kakao/Google
  L->>B: window.location.href = {BASE}/oauth2/authorization/{provider}
  B->>S: GET /oauth2/authorization/{provider}
  S-->>B: Redirect to provider login (standard OAuth flow)
Loading
sequenceDiagram
  actor U as User
  participant N as SignupNickname
  participant API as /users/nickname

  U->>N: 입력 및 다음 클릭
  N->>N: Regex로 클라이언트 검증
  N->>API: POST nickname
  API-->>N: { data.isVerified }
  alt isVerified = true
    N->>N: error = null
    N->>Router: navigate('/signup/genre', { state: { nickname }})
  else isVerified = false
    N->>N: error = "이미 사용중인 닉네임이에요."
  end
Loading
sequenceDiagram
  actor U as User
  participant G as SignupGenre
  participant CK as Cookie
  participant C as apiClient
  participant API as /users/signup
  participant R as Router

  U->>G: 별칭(장르) 선택 후 다음 클릭
  G->>G: nickname & selectedAlias 존재 확인
  G->>CK: getAuthTokenFromCookie()
  CK-->>G: token
  G->>C: setAuthTokenToHeader(token)
  G->>API: POST { aliasName, nickName }
  API-->>G: { data.userId }
  G->>R: navigate('/signupdone', { state: { aliasName, nickName }})
Loading
sequenceDiagram
  participant D as SignupDone
  participant R as Router

  D->>D: read location.state
  alt missing nickName or aliasName
    D->>R: navigate('/signup/nickname')
  else present
    D->>D: Render greeting with nickName/aliasName
  end
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

Suggested labels

✨ Feature, 🎨 Html&css

Suggested reviewers

  • ho0010

Poem

폴짝, 닉네임 한 번 점프 체크!
또 폴짝, 별칭 골라 달빛 택배 ☾
토큰 챙겨 가입문 톡톡 두드리면,
안녕하세요, 새 이름이 반짝- 인사해요.
OAuth 바람 타고 구름도 미소 짓네.
오늘도 개발밭에 당근 한 줌, 힙합! 🥕🐇


📜 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 7080697 and 3db894a.

📒 Files selected for processing (8)
  • src/api/users/getAlias.ts (1 hunks)
  • src/api/users/postNickname.ts (1 hunks)
  • src/api/users/postSignup.ts (1 hunks)
  • src/pages/login/Login.tsx (1 hunks)
  • src/pages/signup/Signup.styled.ts (4 hunks)
  • src/pages/signup/SignupDone.tsx (1 hunks)
  • src/pages/signup/SignupGenre.tsx (3 hunks)
  • src/pages/signup/SignupNickname.tsx (3 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 develop

🪧 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.
    • Explain this complex logic.
    • 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. Examples:
    • @coderabbitai explain this code block.
  • 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 src/utils.ts and explain its main purpose.
    • @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 comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai generate docstrings to generate docstrings for this PR.
  • @coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
  • @coderabbitai generate unit tests to generate unit tests for this PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

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

Documentation and Community

  • 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.

@heeeeyong heeeeyong merged commit 1d6df88 into main Aug 11, 2025
1 of 2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant