build: lock 파일 삭제 및 재설치 #141
Merged
Conversation
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
* feat: 검색 부분 미비한 로직 추가 * fix: 이미지 수정 * Feat/#79 (#96) * fix: 히어로 이미지 수정 * feat: 프리미엄 후기 구현 * feat: 세부페이지 구현 * fix: 에러해결 --------- Co-authored-by: yura <[email protected]> * feat: 좋아요 API 명세 추가 --------- Co-authored-by: oaoong <[email protected]> Co-authored-by: yura <[email protected]>
* style: 디자인토큰, 타이포그래피 수정 * fix: onsuccess 콜백에 mutaiton 인자 추가 --------- Co-authored-by: yura <[email protected]>
* style: 디자인토큰, 타이포그래피 수정 * fix: onsuccess 콜백에 mutaiton 인자 추가 * fix: mutation파일에 onmutationresult 추가 --------- Co-authored-by: yura <[email protected]>
style: 배경 기본 색상 변경
Co-authored-by: yura <[email protected]>
* style: 탐색하기 사이드바, 히어로 이미지 수정 * style: 탐색하기 레이아웃 수정 --------- Co-authored-by: yura <[email protected]>
* feat: 리뷰 작성 연결 페이지 재정의 * feat: 리뷰 UI 개발사항 반영 * fix: formatting * feat: QnA 컴포넌트 추가
* refactor: card 컴포넌트 수정 * feat: 북마크 추가 * refactor: card 컴포넌트 수정 * feat: 모바일 카드 구현
* feat: drawer 구현 * feat: 탐색 반응형 구현
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Caution Review failedThe pull request is closed. WalkthroughThis PR transitions the review form submission system from type-based (normal/premium) to kind-based (paper/interview/activity) architecture, introduces responsive mobile components (MobileCard, CardOverlay, MobileFilterBar, MobileTab), restructures the Card component system with new subcomponents, updates core dependencies, and modernizes design tokens and typography across the application. Changes
Sequence DiagramsequenceDiagram
participant User
participant ReviewNewPage as /review/new<br/>[kind]
participant FormFactory
participant FormComponent as PaperForm/<br/>InterviewForm/<br/>ActivityForm
participant StepComponent as Step1/Step2<br/>Components
participant useFormHook as useXForm<br/>Hook
participant Mutation as postBasicReview<br/>Mutation
participant API
participant SuccessPage
User->>ReviewNewPage: Load page with kind param
ReviewNewPage->>ReviewNewPage: Validate kind, set formKind state
ReviewNewPage->>FormFactory: Pass validated kind
FormFactory->>FormComponent: Render PaperForm/InterviewForm/ActivityForm
rect rgb(200, 220, 255)
note over StepComponent,useFormHook: Multi-step form flow
FormComponent->>useFormHook: Initialize form (step 1)
useFormHook->>StepComponent: Render Step 1
User->>StepComponent: Fill step 1 fields
StepComponent->>useFormHook: Validate step 1 via trigger()
User->>StepComponent: Click next
StepComponent->>FormComponent: Call goToNextStep
FormComponent->>useFormHook: Execute trigger validation
useFormHook->>StepComponent: Render Step 2 on success
User->>StepComponent: Fill step 2 fields (QA items, etc.)
User->>StepComponent: Click submit
end
rect rgb(220, 255, 220)
note over StepComponent,API: Form submission flow
FormComponent->>useFormHook: Call onSubmit via form.handleSubmit()
useFormHook->>useFormHook: transformToApiRequest() - convert form to API payload
useFormHook->>Mutation: Call postBasicReviewMutation.mutate(payload)
Mutation->>API: POST /api/reviews/basic
API->>Mutation: Return { reviewId }
end
rect rgb(255, 240, 220)
note over Mutation,SuccessPage: Post-submission
Mutation->>useFormHook: onSuccess callback with reviewId
useFormHook->>SuccessPage: Navigate to AppPath.reviewSubmitted()
SuccessPage->>User: Show success message
end
Estimated code review effort🎯 4 (Complex) | ⏱️ ~60 minutes Areas requiring extra attention:
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
✨ Finishing touches
🧪 Generate unit tests (beta)
📜 Recent review detailsConfiguration used: CodeRabbit UI Review profile: CHILL Plan: Pro ⛔ Files ignored due to path filters (8)
📒 Files selected for processing (82)
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 |
Summary of ChangesHello @yura0302, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! 이 Pull Request는 리뷰 작성 프로세스를 간소화하고 동아리 탐색 페이지의 사용자 경험을 개선하는 데 중점을 둡니다. 리뷰 폼을 다단계 형식으로 통합하고, 모바일 필터링 및 북마크 기능을 추가하여 전반적인 UI/UX를 향상시켰습니다. 또한, 최신 의존성 업데이트와 새로운 개발 가이드 도입을 통해 프로젝트의 안정성과 개발 효율성을 높였습니다. Highlights
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
이 PR은 의존성 업데이트와 함께 후기 작성 플로우 및 UI/UX를 대대적으로 개선하는 내용을 담고 있습니다. 특히 후기 작성 폼을 단계별로 리팩터링하고, 재사용 가능한 컴포넌트(DynamicQASection, StepNavigation 등)를 도입하여 코드 구조를 크게 향상시킨 점이 인상적입니다. 또한 반응형 디자인을 고려한 MobileFilterBar, CardOverlay 등의 컴포넌트 추가도 좋은 변화입니다.
다만, 몇 가지 개선이 필요한 부분이 보입니다. Explore 페이지에서 로딩 및 에러, 빈 상태 처리가 누락되어 사용자 경험을 해칠 수 있습니다. 또한, 여러 mutations.ts 파일에서 useMutation의 콜백 시그니처가 잘못 사용된 것으로 보이며, 이는 타입 에러나 예기치 않은 동작을 유발할 수 있습니다. 마지막으로 Card 컴포넌트의 스타일링에 작은 구문 오류가 발견되었습니다.
자세한 내용은 각 파일에 남긴 리뷰 코멘트를 참고해주세요.
| className={cn( | ||
| base, | ||
| 'gap-[var(--card-gap)] p-[var(--card-pad)] rounded-[12px]', | ||
| 'gap-(--card-gap) p-(--card-pad) rounded-[12px]', |
There was a problem hiding this comment.
Tailwind CSS의 임의 값(arbitrary values) 구문이 잘못 사용되었습니다. gap-(--card-gap)와 p-(--card-pad)는 유효하지 않은 클래스명이며, gap-[var(--card-gap)]와 p-[var(--card-pad)]로 수정해야 합니다. 이 오류로 인해 카드 컴포넌트의 간격과 패딩이 제대로 적용되지 않을 수 있습니다.
'gap-[var(--card-gap)] p-[var(--card-pad)] rounded-[12px]',
| isLoading: loading, | ||
| error: queryError, | ||
| } = useExploreClubs(queryParams) | ||
| const { data: clubsData } = useExploreClubs(queryParams) |
There was a problem hiding this comment.
useExploreClubs 훅에서 isLoading과 error 상태를 더 이상 사용하지 않아 로딩 및 에러 상태에 대한 UI 처리가 누락되었습니다. 데이터 로딩 중이거나 에러가 발생했을 때 사용자에게 적절한 피드백을 제공하지 않으면 UX가 저하될 수 있습니다. 이전 코드처럼 로딩 스피너나 에러 메시지를 다시 추가하는 것을 고려해 보세요. 또한, 데이터가 비어있을 때의 처리(clubs.length === 0)도 함께 복구하는 것이 좋겠습니다.
Suggested change
| const { data: clubsData } = useExploreClubs(queryParams) | |
| const { data: clubsData, isLoading, error: queryError } = useExploreClubs(queryParams) |
Comment on lines
+29
to
34
| onSuccess: (data, variables, onMutateResult, context) => { | ||
| queryClient.invalidateQueries({ | ||
| queryKey: clubKeys.detail(variables.clubId), | ||
| }) | ||
| options?.onSuccess?.(data, variables, context as never) | ||
| options?.onSuccess?.(data, variables, onMutateResult, context) | ||
| }, |
There was a problem hiding this comment.
useMutation의 onSuccess 콜백 시그니처가 잘못되었습니다. @tanstack/react-query v5에서 onSuccess는 (data, variables, context) 3개의 인자를 받습니다. onMutateResult라는 파라미터는 표준 시그니처에 존재하지 않습니다.
Suggested change
| onSuccess: (data, variables, onMutateResult, context) => { | |
| queryClient.invalidateQueries({ | |
| queryKey: clubKeys.detail(variables.clubId), | |
| }) | |
| options?.onSuccess?.(data, variables, context as never) | |
| options?.onSuccess?.(data, variables, onMutateResult, context) | |
| }, | |
| onSuccess: (data, variables, context) => { | |
| queryClient.invalidateQueries({ | |
| queryKey: clubKeys.detail(variables.clubId), | |
| }) | |
| options?.onSuccess?.(data, variables, context) | |
| }, |
Comment on lines
+23
to
29
| onSuccess: (data, variables, onMutateResult, context) => { | ||
| // 베이직 후기 목록 쿼리 무효화 | ||
| queryClient.invalidateQueries({ | ||
| queryKey: reviewKeys.basicLists(), | ||
| }) | ||
| options?.onSuccess?.(data, variables, context as never) | ||
| options?.onSuccess?.(data, variables, onMutateResult, context) | ||
| }, |
There was a problem hiding this comment.
useMutation의 onSuccess 콜백 시그니처가 잘못되었습니다. @tanstack/react-query v5에서 onSuccess는 (data, variables, context) 3개의 인자를 받습니다. onMutateResult라는 파라미터는 표준 시그니처에 존재하지 않습니다.
Suggested change
| onSuccess: (data, variables, onMutateResult, context) => { | |
| // 베이직 후기 목록 쿼리 무효화 | |
| queryClient.invalidateQueries({ | |
| queryKey: reviewKeys.basicLists(), | |
| }) | |
| options?.onSuccess?.(data, variables, context as never) | |
| options?.onSuccess?.(data, variables, onMutateResult, context) | |
| }, | |
| onSuccess: (data, variables, context) => { | |
| // 베이직 후기 목록 쿼리 무효화 | |
| queryClient.invalidateQueries({ | |
| queryKey: reviewKeys.basicLists(), | |
| }) | |
| options?.onSuccess?.(data, variables, context) | |
| }, |
Comment on lines
+50
to
56
| onSuccess: (data, variables, onMutateResult, context) => { | ||
| // 프리미엄 후기 목록 쿼리 무효화 | ||
| queryClient.invalidateQueries({ | ||
| queryKey: reviewKeys.premiumLists(), | ||
| }) | ||
| options?.onSuccess?.(data, variables, context as never) | ||
| options?.onSuccess?.(data, variables, onMutateResult, context) | ||
| }, |
There was a problem hiding this comment.
useMutation의 onSuccess 콜백 시그니처가 잘못되었습니다. @tanstack/react-query v5에서 onSuccess는 (data, variables, context) 3개의 인자를 받습니다. onMutateResult라는 파라미터는 표준 시그니처에 존재하지 않습니다.
Suggested change
| onSuccess: (data, variables, onMutateResult, context) => { | |
| // 프리미엄 후기 목록 쿼리 무효화 | |
| queryClient.invalidateQueries({ | |
| queryKey: reviewKeys.premiumLists(), | |
| }) | |
| options?.onSuccess?.(data, variables, context as never) | |
| options?.onSuccess?.(data, variables, onMutateResult, context) | |
| }, | |
| onSuccess: (data, variables, context) => { | |
| // 프리미엄 후기 목록 쿼리 무효화 | |
| queryClient.invalidateQueries({ | |
| queryKey: reviewKeys.premiumLists(), | |
| }) | |
| options?.onSuccess?.(data, variables, context) | |
| }, |
Comment on lines
+18
to
23
| onSuccess: (data, clubId, onMutateResult, context) => { | ||
| queryClient.invalidateQueries({ | ||
| queryKey: subscribeKeys.userSubscribes(), | ||
| }) | ||
| options?.onSuccess?.(data, clubId, context as never) | ||
| options?.onSuccess?.(data, clubId, onMutateResult, context) | ||
| }, |
There was a problem hiding this comment.
useMutation의 onSuccess 콜백 시그니처가 잘못되었습니다. @tanstack/react-query v5에서 onSuccess는 (data, variables, context) 3개의 인자를 받습니다. onMutateResult라는 파라미터는 표준 시그니처에 존재하지 않습니다.
Suggested change
| onSuccess: (data, clubId, onMutateResult, context) => { | |
| queryClient.invalidateQueries({ | |
| queryKey: subscribeKeys.userSubscribes(), | |
| }) | |
| options?.onSuccess?.(data, clubId, context as never) | |
| options?.onSuccess?.(data, clubId, onMutateResult, context) | |
| }, | |
| onSuccess: (data, clubId, context) => { | |
| queryClient.invalidateQueries({ | |
| queryKey: subscribeKeys.userSubscribes(), | |
| }) | |
| options?.onSuccess?.(data, clubId, context) | |
| }, |
Comment on lines
+81
to
+84
| NEXT_PUBLIC_API_ADDRESS # Backend API URL | ||
| NEXT_PUBLIC_API_MOCKING # MSW toggle (enabled/disabled) | ||
| NEXT_PUBLIC_GA_ID # Google Analytics | ||
| ``` |
There was a problem hiding this comment.
CHROMATIC_PROJECT_TOKEN 환경 변수에 대한 설명이 누락되었습니다. package.json의 chromatic 스크립트에서 사용되고 있으므로, 이 문서에도 추가하여 다른 개발자들이 혼동하지 않도록 하는 것이 좋겠습니다.
Suggested change
| NEXT_PUBLIC_API_ADDRESS # Backend API URL | |
| NEXT_PUBLIC_API_MOCKING # MSW toggle (enabled/disabled) | |
| NEXT_PUBLIC_GA_ID # Google Analytics | |
| ``` | |
| NEXT_PUBLIC_API_ADDRESS # Backend API URL | |
| NEXT_PUBLIC_API_MOCKING # MSW toggle (enabled/disabled) | |
| NEXT_PUBLIC_GA_ID # Google Analytics | |
| CHROMATIC_PROJECT_TOKEN # Chromatic project token |
| 'block w-full py-3 px-5', | ||
| 'cursor-pointer select-none', | ||
| 'peer-data-[state=checked]:bg-white rounded-[8px]', | ||
| 'peer-data-[state=checked]:bg-light-color-2 ', |
There was a problem hiding this comment.
선택된 사이드바 아이템의 스타일에서 rounded-[8px]가 제거되었습니다. 이로 인해 선택된 항목의 배경이 둥근 모서리 없이 표시될 수 있습니다. 의도된 변경이 아니라면, bg-light-color-2와 함께 rounded-[8px]를 다시 추가하여 디자인 일관성을 유지하는 것이 좋겠습니다.
Suggested change
| 'peer-data-[state=checked]:bg-light-color-2 ', | |
| 'peer-data-[state=checked]:bg-light-color-2 rounded-[8px]', |
Merged
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.
🔗 관련 이슈
Closes #
✨ 변경사항
🎯 리뷰 포인트
📝 추가 정보
Summary by CodeRabbit
New Features
UI/UX Improvements
Dependencies
✏️ Tip: You can customize this high-level summary in your review settings.