Feat(client): 직무 선택 API 연결 (기존/신규 사용자)#276
Merged
constantly-dev merged 6 commits intodevelopfrom Feb 26, 2026
Merged
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Walkthrough온보딩 플로우에 사용자의 직무(selectedJob)를 상태로 추가하고, 이를 최종 제출 시 API로 패치(patchUserJob) 및 signup payload에 포함하도록 클라이언트와 확장 프로그램의 인증 엔드포인트를 v2에서 v3로 업데이트했습니다. Changes
Sequence Diagram(s)sequenceDiagram
participant User as User
participant UI as JobSelectionFunnel (Client)
participant Hook as useOnboardingFunnel
participant API as Client API Layer (/api/v3)
participant Server as Backend
User->>UI: 직무 선택 및 다음/완료 클릭
UI->>Hook: selectedJob 업데이트 / 완료 트리거
Hook->>API: (if final step) PATCH /api/v3/users/job { job: selectedJob }
API->>Server: HTTP PATCH 요청
Server-->>API: 200 OK
API-->>Hook: 성공 응답
Hook->>API: PATCH /api/v3/auth/signup (postSignUp 포함 job 필드)
API->>Server: signup 요청
Server-->>API: 201 Created
API-->>Hook: signup 응답
Hook-->>UI: onComplete / 이동 완료
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Suggested labels
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 3 | ❌ 2❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (3 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 |
|
✅ Storybook chromatic 배포 확인: |
![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 (2)
apps/client/src/shared/components/jobSelectionFunnel/JobSelectionFunnel.tsx (1)
31-40:⚠️ Potential issue | 🟠 Major
mutateAsync호출에try/catch누락 — 에러 시 UI 미복구
mutateAsync는 Promise를 반환하며, 실패 시 에러를 직접 처리해야 합니다. 현재 구현에서는patchUserJobAPI 호출이 실패할 경우 unhandled rejection이 발생하고, 사용자에게 오류 메시지도 표시되지 않습니다. 또한isPatchUserJobPending은false로 돌아가지만onComplete가 호출되지 않아 사용자가 다음 단계로 진행할 수 없게 됩니다.🛡️ 에러 처리 추가 제안
- const handleNext = async () => { + const handleNext = async () => { if (isLastStep) { if (selectedJob) { - await patchUserJob({ job: selectedJob }); + try { + await patchUserJob({ job: selectedJob }); + } catch (error) { + // TODO: 사용자에게 오류 피드백 제공 (e.g. toast 알림) + console.error('직무 선택 저장 실패:', error); + return; + } } onComplete?.(); return; } goNext(); };🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/client/src/shared/components/jobSelectionFunnel/JobSelectionFunnel.tsx` around lines 31 - 40, The handleNext function calls patchUserJob (mutateAsync) without try/catch, causing unhandled rejections and leaving the UI stuck; wrap the await patchUserJob({ job: selectedJob }) call in a try/catch inside handleNext, handle errors by setting appropriate error state or calling an error notification (so users see the failure), ensure you still clear any pending flags and avoid calling onComplete when the mutation fails, and keep use of isPatchUserJobPending (or the mutation's reset) consistent so the UI can recover and allow retries.apps/client/src/pages/onBoarding/hooks/useOnboardingFunnel.ts (1)
116-133:⚠️ Potential issue | 🟡 Minor
job: selectedJob ?? ''— 코드 레벨 검증 없이 UI 검증에만 의존JOB 스텝의 버튼 비활성화 로직으로
jobShareAgree=true와selectedJob이 설정될 때까지 진행을 막고 있습니다. 그러나nextStep함수(116-133줄)에서는selectedJob이 null인지 확인하는 프로그래밍 수준의 검증이 없으므로, 만약 UI 검증이 우회되거나 실패하면 빈 문자열이 API에 전송될 수 있습니다.postSignUpRequest인터페이스에서job: string으로 필수 필드이기 때문에, 백엔드가 빈 문자열을 거부할 경우 400 오류가 발생합니다.selectedJob이 null인 상황에 대한 명시적인 검증이나 처리 로직을 추가하는 것이 좋습니다.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/client/src/pages/onBoarding/hooks/useOnboardingFunnel.ts` around lines 116 - 133, The final-step submit in nextStep calls postSignData with job: selectedJob ?? '' which can send an empty string if selectedJob is null; add a programming-level guard in nextStep (the block that runs when isFinalStep is true) to explicitly validate selectedJob is non-null/non-empty before calling postSignData—if selectedJob is falsy, abort submission and surface an error (e.g., set an error state or show a toast) or redirect back to the JOB step; ensure the check references selectedJob and postSignData so the API never receives an empty job string.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@apps/extension/src/apis/axios.ts`:
- Around line 14-18: The exported interface postSignupRequest is unused after
postSignup was removed; delete the postSignupRequest interface declaration to
avoid dead code and unused exports. Locate the interface named postSignupRequest
in apps/extension/src/apis/axios.ts and remove the entire interface block (the
exported declaration and its properties) so no orphaned type remains; ensure no
other modules import or reference postSignupRequest before committing.
---
Outside diff comments:
In `@apps/client/src/pages/onBoarding/hooks/useOnboardingFunnel.ts`:
- Around line 116-133: The final-step submit in nextStep calls postSignData with
job: selectedJob ?? '' which can send an empty string if selectedJob is null;
add a programming-level guard in nextStep (the block that runs when isFinalStep
is true) to explicitly validate selectedJob is non-null/non-empty before calling
postSignData—if selectedJob is falsy, abort submission and surface an error
(e.g., set an error state or show a toast) or redirect back to the JOB step;
ensure the check references selectedJob and postSignData so the API never
receives an empty job string.
In `@apps/client/src/shared/components/jobSelectionFunnel/JobSelectionFunnel.tsx`:
- Around line 31-40: The handleNext function calls patchUserJob (mutateAsync)
without try/catch, causing unhandled rejections and leaving the UI stuck; wrap
the await patchUserJob({ job: selectedJob }) call in a try/catch inside
handleNext, handle errors by setting appropriate error state or calling an error
notification (so users see the failure), ensure you still clear any pending
flags and avoid calling onComplete when the mutation fails, and keep use of
isPatchUserJobPending (or the mutation's reset) consistent so the UI can recover
and allow retries.
ℹ️ Review info
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (8)
apps/client/src/pages/onBoarding/hooks/useOnboardingFunnel.tsapps/client/src/shared/apis/axios.tsapps/client/src/shared/apis/queries.tsapps/client/src/shared/apis/setting/axiosInstance.tsapps/client/src/shared/components/jobSelectionFunnel/JobSelectionFunnel.tsxapps/extension/src/apis/axios.tsapps/extension/src/apis/axiosInstance.tsapps/extension/src/apis/query/queries.ts
There was a problem hiding this comment.
🧹 Nitpick comments (1)
apps/extension/src/apis/axios.ts (1)
19-23: 인터페이스 네이밍을 PascalCase로 통일하세요.
postCategoriesRequest를PostCategoriesRequest로 변경해야 합니다. 파일 내 다른 인터페이스들(PostArticleRequest,PutArticleRequest)은 모두 PascalCase를 따르고 있어 현재 명명은 일관성을 깨뜨립니다. 변경 시apps/extension/src/apis/axios.ts(19, 23줄)와apps/extension/src/apis/query/queries.ts(8, 22줄)에서 모두 수정되어야 합니다.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/extension/src/apis/axios.ts` around lines 19 - 23, Rename the interface postCategoriesRequest to PostCategoriesRequest and update all references: change the declaration export interface postCategoriesRequest { ... } to export interface PostCategoriesRequest { ... } and update the postCategories function signature to accept (data: PostCategoriesRequest). Also update any usages/imports in the related queries module where postCategoriesRequest is referenced (e.g., types used at the top of queries.ts) to use PostCategoriesRequest so naming is consistent with PostArticleRequest and PutArticleRequest.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In `@apps/extension/src/apis/axios.ts`:
- Around line 19-23: Rename the interface postCategoriesRequest to
PostCategoriesRequest and update all references: change the declaration export
interface postCategoriesRequest { ... } to export interface
PostCategoriesRequest { ... } and update the postCategories function signature
to accept (data: PostCategoriesRequest). Also update any usages/imports in the
related queries module where postCategoriesRequest is referenced (e.g., types
used at the top of queries.ts) to use PostCategoriesRequest so naming is
consistent with PostArticleRequest and PutArticleRequest.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
📌 Related Issues
📄 Tasks
⭐ PR Point (To Reviewer)
신규
신규 사용자는 온보딩에서 직무를 선택해요. 이를 위해 기존 온보딩에서 이전에 직무 선택 UI를 추가했었고, 이번에는 /api/v3/auth/signup end point를 가진 api에 job field를 추가만 해줬어요.
기존
기존 사용자는 대시보드에서 새로운 funnel로 직무를 선택해요. 이에 따라 직무를 선택하고 마지막 완료 버튼에서 해당 선택된 직무를 제출하도록 했습니다.
Summary by CodeRabbit
새로운 기능
리팩토링