Conversation
| const handleCardClick = async (card: MatchableCardProps) => { | ||
| const query = CLICKABLE_STATUS_MAP[card.status ?? '']; | ||
| if (query) { | ||
| if (!query) return; | ||
|
|
||
| try { | ||
| if (card.status === '승인 완료') { | ||
| await patchStageMutation.mutateAsync(card.id); | ||
| } | ||
| navigate(`${ROUTES.RESULT}?type=${query}`); | ||
| } catch (error) { | ||
| console.error('매칭 상태 전환 실패', error); | ||
| } |
There was a problem hiding this comment.
여기 안의 흐름 설명해주실수있을까요 ??
유저가 카드 클릭 -> 매번 클릭할떄마다 patch가 일어나는건 아니라서 query가 없을때 return 되는건 이해했는데, async & try & await& mutateAsync 과정이 잘 이해가 안가서요 ㅠㅠ
There was a problem hiding this comment.
mutateAsync는 비동기 함수라 await을 붙여야 서버 요청이 끝난 후 navigate가 실행돼요.
await 없이 쓰면 페이지가 먼저 이동돼서 요청 반영이 안 된 것처럼 보일 수 있어요.
또한 요청이 실패할 경우를 대비해 try/catch로 감싸서, 앱이 중단되지 않고 정상적으로 navigate될 수 있도록 처리했습니다!
There was a problem hiding this comment.
설명감사합니다. ㅎㅎ 근데 여기 에러 일어났을때 콘솔 찍히고 에러 페이지로 이동하나요?
|
Warning Rate limit exceeded@bongtta has exceeded the limit for the number of commits or files that can be reviewed per hour. Please wait 17 minutes and 17 seconds before requesting another review. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. 📒 Files selected for processing (1)
Walkthrough문서 사이트의 자동 배포를 위한 GitHub Actions 워크플로우와 VitePress 기반의 문서 시스템이 추가되었습니다. 동시에 매칭 관련 주요 컴포넌트와 데이터 흐름이 리팩토링되어, 실시간 API 연동 및 React Query 기반의 데이터 패칭으로 전환되었습니다. 승인 상태 변경 API 연동 등 실제 서버와의 통신이 강화되었습니다. Changes
Changes (표)
Sequence Diagram(s)sequenceDiagram
participant User
participant MatchTabPanel
participant ReactQuery
participant API
User->>MatchTabPanel: 카드 클릭 (status: '승인 완료')
MatchTabPanel->>ReactQuery: patchStageMutation.mutate(cardId)
ReactQuery->>API: PATCH /match/stage (cardId)
API-->>ReactQuery: 응답 (성공/실패)
ReactQuery-->>MatchTabPanel: onSuccess/onError 콜백
MatchTabPanel->>User: 결과 페이지로 이동 or 에러 처리
Assessment against linked issues
Assessment against linked issues: Out-of-scope changes해당 변경사항 중 명확하게 범위를 벗어난 기능적 코드 변경은 발견되지 않았습니다. Possibly related PRs
Suggested labels
Suggested reviewers
Poem
✨ Finishing Touches
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. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
Deploying mateball-client with
|
| Latest commit: |
82e9aa0
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://64b80fa6.mateball-client.pages.dev |
| Branch Preview URL: | https://feat--211-complete-to-wait.mateball-client.pages.dev |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 4
🔭 Outside diff range comments (2)
package.json (1)
30-38:tailwindcss가dependencies와devDependencies양쪽에 중복 선언돼 있습니다의도치 않은 버전 충돌이나 설치 시간 증가를 초래할 수 있습니다. dev 전용이라면
devDependencies하나로 통일하거나, 런타임에 필요하다면dependencies한 곳으로 이동해 주세요.- "tailwindcss": "^4.1.11", ... - "tailwindcss": "^4.1.11",Also applies to: 68-72
src/pages/match/components/mate-header.tsx (1)
3-6: 사용되지 않는 nickname 프로퍼티를 제거해야 합니다.인터페이스에서
nickname프로퍼티가 정의되어 있지만 컴포넌트에서 실제로 사용되지 않습니다. 일관성을 위해 제거해야 합니다.interface MateHeaderProps { - nickname: string; isGroupMatching?: boolean; }
♻️ Duplicate comments (1)
src/pages/match/components/match-tab-pannel.tsx (1)
28-40: 승인 완료 상태 변경 API 연동이 PR 목표에 맞게 구현되었습니다.이전 리뷰에서 논의된 대로
mutateAsync와await를 사용하여 서버 요청 완료 후 페이지 이동이 보장되며, try/catch로 에러를 안전하게 처리하고 있습니다.
🧹 Nitpick comments (16)
src/shared/components/header/header.tsx (1)
9-15: 글로벌location객체와useLocation()을 혼용하고 있습니다.
pathname은useLocation()훅에서 가져오지만,urlParams와isMatch계산은 브라우저 전역location객체를 그대로 사용하고 있습니다.
SSR 또는 스토리북·테스트 환경에서는 전역location이 없을 수 있어 런타임 오류가 발생할 여지가 있습니다. 또한 동일 렌더 사이클에서 두 개의 서로 다른location소스를 읽으면 일관성이 깨질 수 있습니다.-const urlParams = new URLSearchParams(location.search); +const { pathname, search } = useLocation(); +const urlParams = new URLSearchParams(search); ... -const isMatch = location.pathname === ROUTES.MATCH; +const isMatch = pathname === ROUTES.MATCH;src/shared/components/bottom-sheet/game-match/game-match-bottom-sheet.tsx (2)
42-44: 매직 리터럴 분산 → 한곳에서 매핑하도록 리팩터링 권장
matchType과queryType을 두 번 삼항 연산으로 지정하면 값이 어긋날 위험이 있습니다. 객체 맵으로 한 번만 선언하면 실수를 줄일 수 있습니다.-const matchType = activeType === TAB_TYPES.SINGLE ? 'direct' : 'group'; -const queryType = activeType === TAB_TYPES.SINGLE ? 'single' : 'group'; +const TYPE_MAP = { + [TAB_TYPES.SINGLE]: { matchType: 'direct', queryType: 'single' }, + [TAB_TYPES.GROUP]: { matchType: 'group', queryType: 'group' }, +} as const; +const { matchType, queryType } = TYPE_MAP[activeType];
61-68: 콘솔 출력 대신 공통 토스트 유틸 사용으로 사용자 피드백 강화새로 추가된
showErrorToast유틸이 존재하므로 에러 시 사용자에게 즉각적인 피드백을 주도록 교체하면 UX 가 향상됩니다.- onError: (error) => { - console.error('매치 생성 실패:', error); - }, + onError: (error) => { + showErrorToast('매치 생성에 실패했어요. 잠시 후 다시 시도해 주세요.'); + console.error('매치 생성 실패:', error); + },(위
showErrorToast임포트 필요)src/shared/utils/show-error-toast.tsx (1)
8-15: 함수 호출마다bottomClassMap재생성 – 외부 상수로 이동하면 미미하나마 최적화 가능렌더 주기가 잦은 곳에서 빈번히 호출될 경우 객체가 매번 새로 만들어집니다. 파일 레벨 상수로 빼 두면 메모리를 절약하고 의도도 더 명확합니다.
(성능 영향은 미미하므로 선택 사항입니다.)pnpm-workspace.yaml (1)
1-2: EOF 개행 문자 누락으로 YAMLLint 오류 발생
pnpm-workspace.yaml끝에 개행 문자가 없어 YAMLLintnew-line-at-end-of-file오류가 발생합니다. CI 경고를 줄이기 위해 마지막 줄 뒤에 개행을 추가해 주세요.packages: - 'docs' +docs/trouble.md (1)
1-5: 문서 내용이 TODO 상태로 남아 있습니다트러블슈팅 항목이 실제 내용 없이 “추후 추가 예정입니다.”로 끝납니다. 릴리스 전에 최소한의 원인·해결 예시를 넣거나, 명시적으로 이슈 번호를 링크해 작업 예정임을 표시해 주세요.
필요하다면 기본 템플릿 초안을 작성해 드릴 수 있습니다. 요청 주시면 돕겠습니다.
.gitignore (1)
30-33: 디렉터리 무시 패턴에 슬래시(/) 추가 권고관례상 디렉터리 패턴 끝에
/를 붙여 명확하게 구분합니다. 기능상 문제는 없으나 가독성과 실수 방지를 위해 다음과 같이 제안합니다.-# vitepress -docs/.vitepress/cache -docs/.vitepress/dist -docs/.vitepress/tmp +# VitePress +docs/.vitepress/cache/ +docs/.vitepress/dist/ +docs/.vitepress/tmp/biome.json (1)
16-18:docs전체를 Biome 대상에서 제외하면 규칙 일관성이 깨질 수 있습니다문서용 코드(예:
config.ts, 스크립트)가 포맷팅·Lint 대상에서 빠지면 스타일이 흐트러질 위험이 있습니다.markdown폴더만 제외하거나js/ts파일은 포함하도록 세분화 고려해 주세요.docs/.vitepress/config.ts (1)
6-6: 설명 문자열에 오타가 있습니다.
troubleshootig를troubleshooting으로 수정해야 합니다.- description: 'mateball client convention & troubleshootig & docs', + description: 'mateball client convention & troubleshooting & docs',docs/git.md (3)
70-70: 마크다운 수평선 스타일을 통일하세요.문서 전체에서 수평선 스타일이 일관되지 않습니다.
---를 사용하도록 통일해주세요.-___ +---
137-141: 코드 블록에 언어 지정이 필요합니다.마크다운 린터에서 지적한 대로 fenced code block에 언어를 지정해주세요.
-``` +```text {type}: 커밋 메시지 (#이슈번호) ex) feat: 로그인 기능 구현 (#23) -``` +```
171-175: 코드 블록에 언어 지정이 필요합니다.브랜치 네이밍 예시에도 언어를 지정해주세요.
-``` +```text {type}/#이슈번호/기능명 ex) feat/#23/login-page -``` +```docs/folder.md (1)
12-31: 폴더 구조 다이어그램의 들여쓰기를 수정하세요.마크다운 린터에서 지적한 대로 하드 탭 대신 스페이스를 사용해주세요.
-``` +```text |-- 📁 .github |-- 📁 node_modules |-- 📁 public |-- 📁 src |-- 📁 pages - |-- 📁 home - |-- 📄ex) home.tsx - |-- 📁 components - |-- 📁 styles 등 + |-- 📁 home + |-- 📄ex) home.tsx + |-- 📁 components + |-- 📁 styles 등 |-- 📁 shared |-- 📁 components |-- 📄ex) home-header.tsx |-- 📁 styles |-- 📁 constants |-- 📁 types 등 |-- index.html 등 ETC -``` +```docs/coding.md (1)
45-70: 목록 스타일을 통일하세요.마크다운 린터에서 지적한 대로 unordered list 스타일을 일관되게 대시(-)로 통일해주세요.
-* 기본 템플릿은 `rafce` 사용 (React Arrow Function Component with Export) -* 불필요한 wrapper는 ❌ → **Fragment (`<>`) 사용 권장** +- 기본 템플릿은 `rafce` 사용 (React Arrow Function Component with Export) +- 불필요한 wrapper는 ❌ → **Fragment (`<>`) 사용 권장**나머지 asterisk(*) 목록들도 동일하게 대시(-)로 변경해주세요.
docs/stack.md (2)
16-17: 이미지alt텍스트를 구체적으로 작성해주세요
접근성·SEO 측면에서![alt text]는 placeholder 로 간주됩니다. 이미지가 전달하려는 핵심 메시지를 짧게 설명하는 대체 텍스트를 넣어 주세요. 예시:- +Also applies to: 21-22, 30-31, 41-42, 52-53
17-17: 불필요한<br/>태그 제거 제안
Markdown 에서는 빈 줄 두 개(\n\n)만으로도 개행·여백을 확보할 수 있습니다. HTML 태그를 섞으면 렌더러마다 출력이 달라질 수 있으니 가능하면 Markdown 문법으로 통일해 주세요.-<br/> +Also applies to: 22-22, 31-31, 42-42, 53-53
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (12)
docs/image-1.pngis excluded by!**/*.pngdocs/image-2.pngis excluded by!**/*.pngdocs/image-3.pngis excluded by!**/*.pngdocs/image-4.pngis excluded by!**/*.pngdocs/image-5.pngis excluded by!**/*.pngdocs/image-6.pngis excluded by!**/*.pngdocs/image.pngis excluded by!**/*.pngdocs/pnpm-lock.yamlis excluded by!**/pnpm-lock.yamldocs/public/favicon.svgis excluded by!**/*.svgpnpm-lock.yamlis excluded by!**/pnpm-lock.yamlsrc/shared/assets/svgs/error-filled.svgis excluded by!**/*.svgsrc/shared/assets/svgs/error.svgis excluded by!**/*.svg
📒 Files selected for processing (47)
.github/workflows/deploy.yml(1 hunks).gitignore(1 hunks)biome.json(1 hunks)docs/.vitepress/config.ts(1 hunks)docs/coding.md(1 hunks)docs/folder.md(1 hunks)docs/git.md(1 hunks)docs/index.md(1 hunks)docs/naming.md(1 hunks)docs/package.json(1 hunks)docs/stack.md(1 hunks)docs/trouble.md(1 hunks)package.json(2 hunks)pnpm-workspace.yaml(1 hunks)src/App.tsx(1 hunks)src/pages/home/components/match-list-section.tsx(3 hunks)src/pages/home/home.tsx(2 hunks)src/pages/match/components/match-tab-pannel.tsx(3 hunks)src/pages/match/components/mate-header.tsx(1 hunks)src/pages/match/components/mate.tsx(2 hunks)src/pages/match/constants/matching.ts(1 hunks)src/pages/match/create/components/group-match-card-section.tsx(1 hunks)src/pages/match/create/components/match-card-section.tsx(1 hunks)src/pages/match/create/components/single-match-card-section.tsx(1 hunks)src/pages/match/create/create.tsx(1 hunks)src/pages/match/create/types/match-data-type.ts(1 hunks)src/pages/match/groups/mates.tsx(1 hunks)src/pages/match/hooks/use-mate-create.ts(0 hunks)src/pages/match/match.tsx(2 hunks)src/pages/match/utils/mate.ts(1 hunks)src/pages/result/components/matching-agree-view.tsx(2 hunks)src/pages/result/components/matching-fail-view.tsx(1 hunks)src/pages/result/components/matching-receive-view.tsx(2 hunks)src/pages/result/components/matching-success-view.tsx(2 hunks)src/pages/result/components/sent-view.tsx(3 hunks)src/shared/apis/match/match-queries.ts(3 hunks)src/shared/components/bottom-sheet/game-match/game-match-bottom-sheet.tsx(1 hunks)src/shared/components/card/match-card/card.tsx(2 hunks)src/shared/components/card/match-card/components/card-header.tsx(3 hunks)src/shared/components/card/match-card/types/card.ts(1 hunks)src/shared/components/header/header.tsx(1 hunks)src/shared/components/tab/fill-tab/fill-tab-item.tsx(1 hunks)src/shared/components/tab/fill-tab/fill-tab-list.tsx(1 hunks)src/shared/constants/api.ts(1 hunks)src/shared/hooks/use-prevent-back-navigation.ts(1 hunks)src/shared/routes/layout.tsx(1 hunks)src/shared/utils/show-error-toast.tsx(1 hunks)
💤 Files with no reviewable changes (1)
- src/pages/match/hooks/use-mate-create.ts
🧰 Additional context used
🧠 Learnings (30)
📓 Common learnings
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#61
File: .github/workflows/chromatic.yml:0-0
Timestamp: 2025-07-05T08:48:42.836Z
Learning: peter-evans/create-or-update-comment GitHub Action의 최신 버전에서는 `body-includes` 옵션이 제거되었으며, `edit-mode: replace`만으로도 중복 댓글을 방지할 수 있습니다.
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#61
File: .github/workflows/chromatic.yml:0-0
Timestamp: 2025-07-05T08:48:42.836Z
Learning: peter-evans/create-or-update-comment GitHub Action v4에는 `body-includes` 파라미터가 존재하지 않으며, `edit-mode: replace`만으로도 중복 댓글을 방지할 수 있습니다.
.gitignore (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#73
File: src/shared/components/card/match-current-card/match-current-card.stories.tsx:1-2
Timestamp: 2025-07-07T20:02:52.570Z
Learning: MATEBALL-CLIENT 프로젝트에서는 vite.config.ts에 tsconfigPaths() 플러그인이 이미 설정되어 있어서, tsconfig의 @components alias가 자동으로 Vite와 Storybook에 적용됩니다. 별도의 alias 설정 없이도 @components 임포트가 정상 작동합니다.
src/pages/match/groups/mates.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/shared/components/bottom-sheet/game-match/game-match-bottom-sheet.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/shared/routes/layout.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
package.json (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#73
File: src/shared/components/card/match-current-card/match-current-card.stories.tsx:1-2
Timestamp: 2025-07-07T20:02:52.570Z
Learning: MATEBALL-CLIENT 프로젝트에서는 vite.config.ts에 tsconfigPaths() 플러그인이 이미 설정되어 있어서, tsconfig의 @components alias가 자동으로 Vite와 Storybook에 적용됩니다. 별도의 alias 설정 없이도 @components 임포트가 정상 작동합니다.
src/pages/result/components/sent-view.tsx (3)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#94
File: src/pages/sign-up/sign-up.tsx:4-4
Timestamp: 2025-07-09T17:24:19.755Z
Learning: heesunee는 src/pages/sign-up/sign-up.tsx의 isNicknameStep 하드코딩된 값을 퍼널 패턴으로 카카오 통합과 함께 나중에 처리할 예정이므로, 이 부분에 대해 다시 언급하지 않아야 합니다.
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#95
File: src/pages/sign-up/components/nickname-step.tsx:28-30
Timestamp: 2025-07-09T18:07:41.693Z
Learning: heesunee는 src/pages/sign-up/components/nickname-step.tsx의 onSubmit 핸들러 API 호출을 쿼리와 함께 통합해서 처리할 예정이므로, 이 부분에 대해 다시 언급하지 않아야 합니다.
src/pages/result/components/matching-agree-view.tsx (2)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#94
File: src/pages/sign-up/sign-up.tsx:4-4
Timestamp: 2025-07-09T17:24:19.755Z
Learning: heesunee는 src/pages/sign-up/sign-up.tsx의 isNicknameStep 하드코딩된 값을 퍼널 패턴으로 카카오 통합과 함께 나중에 처리할 예정이므로, 이 부분에 대해 다시 언급하지 않아야 합니다.
src/pages/match/match.tsx (2)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
Learnt from: Dubabbi
PR: MATEBALL/MATEBALL-CLIENT#110
File: src/pages/match/components/mate.tsx:8-11
Timestamp: 2025-07-11T13:42:53.182Z
Learning: Dubabbi는 src/pages/match/components/mate.tsx에서 하드코딩된 닉네임 '두밥비'를 개발 단계에서 사용하고 있으며, 아직 실제 사용자 정보가 구현되지 않았기 때문에 현재는 플레이스홀더로 유지하고 있습니다.
src/pages/home/components/match-list-section.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/pages/match/components/mate-header.tsx (4)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#94
File: src/pages/sign-up/sign-up.tsx:4-4
Timestamp: 2025-07-09T17:24:19.755Z
Learning: heesunee는 src/pages/sign-up/sign-up.tsx의 isNicknameStep 하드코딩된 값을 퍼널 패턴으로 카카오 통합과 함께 나중에 처리할 예정이므로, 이 부분에 대해 다시 언급하지 않아야 합니다.
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#95
File: src/pages/sign-up/components/nickname-step.tsx:28-30
Timestamp: 2025-07-09T18:07:41.693Z
Learning: heesunee는 src/pages/sign-up/components/nickname-step.tsx의 onSubmit 핸들러 API 호출을 쿼리와 함께 통합해서 처리할 예정이므로, 이 부분에 대해 다시 언급하지 않아야 합니다.
Learnt from: Dubabbi
PR: MATEBALL/MATEBALL-CLIENT#110
File: src/pages/match/components/mate.tsx:8-11
Timestamp: 2025-07-11T13:42:53.182Z
Learning: Dubabbi는 src/pages/match/components/mate.tsx에서 하드코딩된 닉네임 '두밥비'를 개발 단계에서 사용하고 있으며, 아직 실제 사용자 정보가 구현되지 않았기 때문에 현재는 플레이스홀더로 유지하고 있습니다.
src/shared/components/card/match-card/card.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/pages/home/home.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/shared/components/card/match-card/components/card-header.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/pages/match/constants/matching.ts (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#94
File: src/pages/sign-up/sign-up.tsx:4-4
Timestamp: 2025-07-09T17:24:19.755Z
Learning: heesunee는 src/pages/sign-up/sign-up.tsx의 isNicknameStep 하드코딩된 값을 퍼널 패턴으로 카카오 통합과 함께 나중에 처리할 예정이므로, 이 부분에 대해 다시 언급하지 않아야 합니다.
docs/.vitepress/config.ts (2)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#73
File: src/shared/components/card/match-current-card/match-current-card.stories.tsx:1-2
Timestamp: 2025-07-07T20:02:52.570Z
Learning: MATEBALL-CLIENT 프로젝트에서는 vite.config.ts에 tsconfigPaths() 플러그인이 이미 설정되어 있어서, tsconfig의 @components alias가 자동으로 Vite와 Storybook에 적용됩니다. 별도의 alias 설정 없이도 @components 임포트가 정상 작동합니다.
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
docs/index.md (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/pages/match/components/mate.tsx (2)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
Learnt from: Dubabbi
PR: MATEBALL/MATEBALL-CLIENT#110
File: src/pages/match/components/mate.tsx:8-11
Timestamp: 2025-07-11T13:42:53.182Z
Learning: Dubabbi는 src/pages/match/components/mate.tsx에서 하드코딩된 닉네임 '두밥비'를 개발 단계에서 사용하고 있으며, 아직 실제 사용자 정보가 구현되지 않았기 때문에 현재는 플레이스홀더로 유지하고 있습니다.
docs/package.json (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#73
File: src/shared/components/card/match-current-card/match-current-card.stories.tsx:1-2
Timestamp: 2025-07-07T20:02:52.570Z
Learning: MATEBALL-CLIENT 프로젝트에서는 vite.config.ts에 tsconfigPaths() 플러그인이 이미 설정되어 있어서, tsconfig의 @components alias가 자동으로 Vite와 Storybook에 적용됩니다. 별도의 alias 설정 없이도 @components 임포트가 정상 작동합니다.
src/pages/match/utils/mate.ts (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/pages/result/components/matching-success-view.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/pages/match/create/components/match-card-section.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/pages/match/create/components/single-match-card-section.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
docs/naming.md (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#94
File: src/pages/sign-up/sign-up.tsx:4-4
Timestamp: 2025-07-09T17:24:19.755Z
Learning: heesunee는 src/pages/sign-up/sign-up.tsx의 isNicknameStep 하드코딩된 값을 퍼널 패턴으로 카카오 통합과 함께 나중에 처리할 예정이므로, 이 부분에 대해 다시 언급하지 않아야 합니다.
src/App.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/pages/match/components/match-tab-pannel.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/pages/match/create/components/group-match-card-section.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/pages/result/components/matching-fail-view.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/pages/match/create/create.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
src/pages/result/components/matching-receive-view.tsx (1)
Learnt from: heesunee
PR: MATEBALL/MATEBALL-CLIENT#7
File: src/shared/routes/Router.tsx:4-4
Timestamp: 2025-06-29T18:02:42.616Z
Learning: The Home component file in the MATEBALL-CLIENT project was renamed from Home.tsx to home.tsx, so the correct import path is '@pages/home/home'.
🧬 Code Graph Analysis (11)
src/shared/components/bottom-sheet/game-match/game-match-bottom-sheet.tsx (1)
src/shared/components/tab/tab/constants/tab-type.ts (1)
TAB_TYPES(1-4)
src/shared/components/tab/fill-tab/fill-tab-list.tsx (1)
src/shared/libs/cn.ts (1)
cn(4-6)
src/pages/result/components/sent-view.tsx (1)
src/shared/routes/routes-config.ts (1)
ROUTES(1-22)
src/pages/result/components/matching-agree-view.tsx (2)
src/shared/routes/routes-config.ts (1)
ROUTES(1-22)src/shared/apis/match/match-queries.ts (1)
matchQueries(16-94)
src/pages/match/components/mate-header.tsx (1)
src/pages/match/constants/matching.ts (1)
MATCHING_HEADER_MESSAGE(11-14)
src/pages/home/home.tsx (1)
src/shared/apis/game/game-queries.ts (1)
gameQueries(7-18)
src/pages/match/create/types/match-data-type.ts (1)
src/shared/components/card/match-card/types/card.ts (2)
SingleCardProps(27-37)GroupCardProps(39-44)
src/shared/components/card/match-card/components/card-header.tsx (2)
src/shared/components/card/match-card/types/card.ts (1)
CardProps(71-71)src/shared/routes/routes-config.ts (1)
ROUTES(1-22)
src/pages/match/components/match-tab-pannel.tsx (4)
src/shared/apis/match/match-mutations.ts (1)
matchMutations(12-72)src/pages/match/constants/matching.ts (1)
CLICKABLE_STATUS_MAP(42-47)src/shared/routes/routes-config.ts (1)
ROUTES(1-22)src/shared/libs/cn.ts (1)
cn(4-6)
src/pages/result/components/matching-fail-view.tsx (1)
src/shared/routes/routes-config.ts (1)
ROUTES(1-22)
src/pages/match/create/create.tsx (2)
src/pages/match/utils/match-validators.ts (1)
isInvalidMatchId(1-3)src/shared/routes/routes-config.ts (1)
ROUTES(1-22)
🪛 YAMLlint (1.37.1)
pnpm-workspace.yaml
[error] 2-2: no new line character at the end of file
(new-line-at-end-of-file)
🪛 markdownlint-cli2 (0.17.2)
docs/git.md
70-70: Horizontal rule style
Expected: ---; Actual: ___
(MD035, hr-style)
137-137: Fenced code blocks should have a language specified
(MD040, fenced-code-language)
171-171: Fenced code blocks should have a language specified
(MD040, fenced-code-language)
docs/coding.md
45-45: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
46-46: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
59-59: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
60-60: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
66-66: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
67-67: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
68-68: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
69-69: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
70-70: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
83-83: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
89-89: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
91-91: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
99-99: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
101-101: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
107-107: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
108-108: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
109-109: Unordered list style
Expected: dash; Actual: asterisk
(MD004, ul-style)
docs/folder.md
12-12: Fenced code blocks should have a language specified
(MD040, fenced-code-language)
19-19: Hard tabs
Column: 1
(MD010, no-hard-tabs)
20-20: Hard tabs
Column: 1
(MD010, no-hard-tabs)
21-21: Hard tabs
Column: 1
(MD010, no-hard-tabs)
22-22: Hard tabs
Column: 1
(MD010, no-hard-tabs)
🔇 Additional comments (73)
src/shared/components/tab/fill-tab/fill-tab-item.tsx (1)
16-18: 패딩 조정이 디자인 시스템과 일관되는지 확인 필요가로 패딩이
0.8rem → 1.2rem으로 늘었는데, 다른 탭 컴포넌트와 불일치하면 레이아웃이 어색해질 수 있습니다. 디자인 가이드(예: spacing scale)와 맞는 값인지 다시 한번 확인 부탁드립니다.src/pages/match/groups/mates.tsx (1)
20-24: non-null assertion 제거와 명시적 prop 전달이 개선되었습니다.
numericMatchId에서!연산자를 제거하고isGroupMatching={true}를 명시적으로 전달하는 것이 좋습니다. 이는 타입 안전성을 향상시키고 그룹 매칭 모드를 명확히 합니다.src/shared/components/card/match-card/types/card.ts (1)
21-21: stadium 프로퍼티를 optional로 변경한 것이 적절합니다.이 변경사항은 카드 컴포넌트의 유연성을 높이며, 다른 파일에서
stadium || ''로 fallback 처리하는 것과 일치합니다.src/shared/routes/layout.tsx (1)
13-14: 동적 라우트 매칭으로 개선되었습니다.
matchPath를 사용하여/result/:id패턴으로 라우트를 매칭하는 것이 고정된 라우트 문자열보다 유연하고 적절합니다. 이는 동적 매개변수가 있는 결과 페이지에서 올바르게 fail 상태를 감지할 수 있게 합니다.src/shared/components/card/match-card/card.tsx (2)
12-12: gameInfoClass 단순화가 적절합니다.조건부 표현식을 제거하고 항상
'mt-[0.4rem]'로 설정하는 것이 코드를 단순화합니다.
24-32: 명시적 prop 전달로 개선되었습니다.props 스프레드 대신 명시적으로 필요한 props만 전달하는 것이 타입 안전성과 가독성을 향상시킵니다.
stadium || ''로 fallback 처리하는 것도 optional stadium 프로퍼티와 일치합니다.src/pages/result/components/matching-fail-view.tsx (2)
3-3: 뒤로 가기 방지 기능이 적절히 추가되었습니다.
usePreventBackNavigation훅을 사용하여 매칭 페이지로의 뒤로 가기를 방지하는 것이 결과 페이지에서 적절합니다. 사용자 플로우를 개선합니다.Also applies to: 10-10
13-13: 뷰포트 높이 처리가 개선되었습니다.
h-full에서h-svh로 변경하여 모바일 디바이스에서 동적 화면 크기를 더 잘 처리할 수 있습니다.src/pages/result/components/matching-success-view.tsx (2)
3-3: 뒤로가기 방지 기능 추가가 적절합니다.매칭 성공 후 매칭 페이지로 되돌아가는 것을 방지하는 기능이 추가되었습니다. 이는 매칭 플로우에서 일관된 사용자 경험을 제공하는 좋은 개선사항입니다.
Also applies to: 15-15
18-18: 모바일 환경을 고려한 viewport 높이 개선
h-full에서h-svh로 변경하여 모바일 환경에서 dynamic viewport height를 더 잘 처리하도록 개선되었습니다. 이는 모바일 브라우저의 주소창 등으로 인한 viewport 변화에 대응하는 좋은 방법입니다.src/pages/match/create/types/match-data-type.ts (1)
3-5: 타입 안전성을 위한 discriminated union 패턴 적절히 사용
MatchCardData타입이 discriminated union 패턴을 사용하여 single과 group 카드를 구분하고 있습니다.type필드를 통해 런타임에 타입을 안전하게 구분할 수 있고, 기존 카드 타입들을 확장하여 일관성도 유지하고 있습니다.src/pages/result/components/matching-agree-view.tsx (2)
5-5: 뒤로가기 방지 로직 일관성 있게 적용매칭 수락 완료 후 매칭 페이지로 되돌아가는 것을 방지하는 기능이 추가되었습니다. 다른 result 뷰 컴포넌트들과 일관된 패턴을 따르고 있어 사용자 경험이 향상됩니다.
Also applies to: 17-17
23-23: 모바일 환경 고려한 viewport 높이 개선
h-full에서h-svh로 변경하여 모바일 환경에서의 viewport height 처리가 개선되었습니다. 이는 다른 result 뷰들과 일관된 스타일링 개선입니다.docs/package.json (1)
1-11: 문서 시스템 기반 설정 적절히 구성VitePress 기반의 문서 시스템을 위한 package.json이 적절하게 구성되었습니다. 빌드, 개발, 프리뷰 스크립트가 올바르게 정의되어 있고, GitHub Actions와 함께 자동 배포 시스템의 기반을 제공합니다.
src/pages/result/components/sent-view.tsx (2)
3-3: 뒤로가기 방지 로직 적절히 구현매칭 요청 전송 후 홈으로 되돌아가는 것을 방지하는 기능이 추가되었습니다. 다른 result 뷰 컴포넌트들과 일관된 패턴을 따르고 있어 사용자 경험 개선에 도움이 됩니다.
Also applies to: 14-14
21-21: 레이아웃 개선사항 적절히 적용
h-svh클래스로 변경하여 모바일 환경에서의 viewport height 처리가 개선되었고, 버튼 컨테이너에w-full클래스를 추가하여 전체 너비를 차지하도록 개선되었습니다. 이는 레이아웃 일관성을 향상시키는 좋은 변경사항입니다.Also applies to: 33-33
src/pages/match/constants/matching.ts (1)
11-14: 메시지 구조 단순화 개선사항동적 닉네임 삽입에서 정적 문자열로 변경한 것이 좋습니다. 이는 메시지 처리를 단순화하고 일관성을 향상시킵니다.
src/pages/match/create/create.tsx (2)
16-18: 검증 로직 단순화 개선사항
matchData의존성을 제거하고matchId와matchType만 검증하도록 단순화한 것이 좋습니다. 이는 데이터 페칭을 자식 컴포넌트로 이동시킨 리팩토링과 일치합니다.
22-22: Props 전달 방식 개선 확인
MatchCardSection에matchData객체 대신matchId와type을 직접 전달하도록 변경되었습니다. 이는 컴포넌트 간 의존성을 줄이는 좋은 개선사항입니다.src/pages/home/home.tsx (2)
34-37: 쿼리 최적화 개선사항바텀시트가 열렸을 때만 게임 리스트 데이터를 페칭하도록
enabled옵션을 추가한 것이 좋습니다. 이는 불필요한 네트워크 요청을 방지하여 성능을 향상시킵니다.
51-51: 스타일링 정리
className의 공백 정리가 깔끔합니다.src/shared/constants/api.ts (2)
29-29: API 엔드포인트 구조 개선
GET_MATCH_DETAIL엔드포인트가 더 RESTful한 구조로 변경되었습니다./v1/users/match/${matchId}형태가 더 일관성 있고 직관적입니다.
34-36: 새로운 요청 API 엔드포인트 추가
POST_MATCH_NEW_REQUEST엔드포인트가 PR 목표인 "승인 완료에서 요청 대기 중으로 상태 변화" 기능을 지원합니다. 쿼리 파라미터를 사용한 구조가 적절합니다.src/shared/components/tab/fill-tab/fill-tab-list.tsx (2)
6-6: 제어 컴포넌트 전환 개선
selectedprop을 선택적으로 만들어 유연성을 제공하는 것이 좋습니다.
11-24: 상태 관리 개선사항내부 상태 관리를 제거하고 외부에서 제어하는 방식으로 변경한 것이 좋습니다. 이는 React 모범 사례를 따르며 컴포넌트의 재사용성과 예측 가능성을 향상시킵니다.
src/shared/components/card/match-card/components/card-header.tsx (4)
6-7: 라우터 관련 임포트가 적절하게 추가되었습니다.매치 생성 페이지에서 상태 칩을 숨기기 위한 라우터 기능들이 정확히 임포트되었습니다.
11-13: 현재 경로 감지 로직이 올바르게 구현되었습니다.
useLocation과matchPath를 사용하여 현재 페이지가 매치 생성 페이지인지 확인하는 로직이 적절합니다.
31-35: 단일 매치 카드에서 조건부 렌더링이 올바르게 구현되었습니다.매치 생성 페이지에서는
ChipState컴포넌트를 숨기는 로직이 정확히 적용되었습니다.
53-57: 그룹 매치 카드에서 조건부 렌더링이 올바르게 구현되었습니다.단일 매치 카드와 일관된 방식으로 그룹 매치 카드에서도
ChipState컴포넌트를 조건부로 렌더링하고 있습니다.docs/.vitepress/config.ts (1)
3-19: VitePress 설정이 적절하게 구성되었습니다.문서 사이트를 위한 기본 설정들이 올바르게 구성되어 있습니다. GitHub Pages 배포를 위한 base path 설정과 필요한 메타데이터들이 포함되어 있습니다.
src/pages/match/components/mate-header.tsx (1)
8-12: 정적 메시지 사용으로 단순화된 구현이 좋습니다.동적 닉네임 보간을 제거하고 정적 메시지를 사용하는 방식으로 컴포넌트가 단순화되었습니다.
src/shared/hooks/use-prevent-back-navigation.ts (1)
4-19: 뒤로 가기 방지 로직이 올바르게 구현되었습니다.히스토리 조작과 popstate 이벤트 리스너를 사용한 뒤로 가기 방지 로직이 적절하게 구현되었습니다. 이벤트 리스너 정리도 올바르게 처리되었습니다.
src/pages/match/utils/mate.ts (1)
4-8: 데이터 변환 로직이 올바르게 구현되었습니다.객체 스프레드, 배열 변환, 그리고 타입 가드를 사용한 필터링 로직이 적절하게 구현되었습니다.
src/shared/apis/match/match-queries.ts (4)
13-13: 타입 가져오기 업데이트 승인
getSingleMatchMate에서getSingleMatchStatusResponse로 변경된 것이 올바릅니다.
69-69: 제네릭 타입 업데이트 승인
getSingleMatchStatusResponse타입으로 변경된 것이 적절합니다.
78-78: 그룹 매칭 응답 타입 구조 개선
mates배열을 포함한 객체 타입으로 변경된 것이 좋습니다. 응답 구조가 더 명확해졌습니다.
86-93: 매칭 상세 쿼리 확장 승인
newRequest파라미터 추가로 상태 변경 기능을 지원하는 것이 PR 목표와 일치합니다. 쿼리 키와 URL 파라미터 처리가 올바르게 구현되었습니다.src/pages/match/create/components/group-match-card-section.tsx (3)
15-17: Suspense 쿼리 사용 승인
useSuspenseQuery를 사용한 데이터 페칭이 적절하며, 사용자 경험을 개선합니다.
19-24: 데이터 변환 로직 승인
MatchCardData타입으로 변환하면서type: 'group'필드를 추가한 것이 올바릅니다.
26-28: null 체크 처리 승인데이터가 없을 때
null을 반환하는 처리가 적절합니다.src/pages/match/create/components/match-card-section.tsx (3)
1-2: 컴포넌트 가져오기 승인새로운
SingleMatchCard와GroupMatchCard컴포넌트 import가 올바릅니다.
4-7: Props 인터페이스 개선
matchData대신matchId와type을 사용하는 것이 더 명확하고 효율적입니다.
9-19: 조건부 렌더링 로직 승인타입에 따른 조건부 렌더링이 깔끔하게 구현되었습니다. 기본
null반환도 적절합니다.src/pages/match/components/mate.tsx (5)
17-20: 쿼리 사용 개선
useQuery를 사용하면서matchId가 있을 때만 쿼리를 활성화하는 것이 효율적입니다.
22-22: 데이터 변환 승인
mapMateData유틸리티 함수를 사용한 데이터 변환이 적절합니다.
26-26: 로딩 상태 처리 승인로딩 중일 때
Loading컴포넌트를 표시하는 것이 좋은 UX를 제공합니다.
29-29: 뷰포트 높이 사용 승인
h-svh사용으로 뷰포트 높이에 맞춘 레이아웃이 더 적절합니다.
31-34: 닉네임 처리 개선동적으로 첫 번째 메이트의 닉네임 첫 글자를 추출하는 로직이 잘 구현되었습니다. 기본값 처리도 적절합니다.
src/pages/match/create/components/single-match-card-section.tsx (4)
15-17: Suspense 쿼리 사용 승인단일 매칭 결과 조회를 위한
useSuspenseQuery사용이 적절합니다.
19-26: 데이터 변환 로직 승인단일 매칭 데이터를
MatchCardData타입으로 변환하는 로직이 올바릅니다.imgUrl배열 변환과chips배열 생성이 적절합니다.
28-30: null 체크 처리 승인데이터가 없을 때의 처리가
GroupMatchCard와 일관성 있게 구현되었습니다.
38-42: 컴포넌트 구조 승인
MatchGuideSection과Card컴포넌트를 사용한 구조가GroupMatchCard와 일관성 있게 잘 구현되었습니다.src/pages/home/components/match-list-section.tsx (2)
22-22: 그룹 매칭 기능 추가가 적절합니다.싱글 매칭과 동일한 패턴으로 그룹 매칭 쿼리가 구현되었으며,
enabled플래그로 불필요한 API 호출을 방지하고 있습니다.Also applies to: 34-38
39-41: 조건부 데이터 선택 로직이 올바르게 구현되었습니다.
isSingle플래그에 따라 적절한 데이터를 반환하며, 의존성 배열도 정확하게 업데이트되었습니다.docs/index.md (1)
1-47: 문서 홈페이지가 잘 구성되었습니다.VitePress 레이아웃을 적절히 활용하여 팀 컨벤션과 개발 문서에 쉽게 접근할 수 있도록 구성되었습니다.
src/pages/match/components/match-tab-pannel.tsx (2)
1-1: React Query mutation 설정이 올바르게 구현되었습니다.매칭 상태 변경을 위한 mutation hook이 적절히 설정되었습니다.
Also applies to: 10-10, 23-23
48-54: 빈 상태 UI 처리가 개선되었습니다.필터링된 결과가 없을 때 적절한 안내 메시지를 표시하여 사용자 경험이 향상되었습니다.
src/pages/result/components/matching-receive-view.tsx (3)
18-27: React Query를 활용한 데이터 페칭 전환이 잘 구현되었습니다.뒤로가기 방지와 실시간 매칭 데이터 조회가 적절히 구현되어 사용자 경험이 개선되었습니다.
29-40: 에러 처리와 동적 데이터 매핑이 적절합니다.API 응답 실패 시 명확한 에러 메시지를 제공하고, 받아온 데이터를 카드 컴포넌트에 맞게 변환하고 있습니다.
46-56: 매칭 수락/거절 핸들러가 올바르게 구현되었습니다.카드 타입에 따라 적절한 결과 페이지로 이동하며, 에러 발생 시 에러 페이지로 안전하게 리다이렉트됩니다.
docs/naming.md (1)
1-64: 팀 네이밍 컨벤션 문서가 체계적으로 작성되었습니다.JavaScript/TypeScript 커뮤니티 표준을 따르면서도 팀의 필요에 맞게 명확한 규칙과 근거를 제시하고 있습니다. 특히 크로스 플랫폼 호환성을 고려한 kebab-case 채택이 실용적입니다.
src/pages/match/match.tsx (4)
1-15: 타입 import가 잘 정리되어 있습니다.타입과 실제 컴포넌트 import가 적절히 분리되어 있고, React Query import도 정확합니다. 코드 구조가 깔끔합니다.
18-32: 상태 관리 로직이 효율적으로 개선되었습니다.탭과 필터 상태를 하나의 객체로 통합하여 관리하고, 핸들러 함수들이 명확하게 분리되어 있습니다. 탭 변경 시 필터를 '전체'로 초기화하는 로직도 사용자 경험 측면에서 적절합니다.
34-42: React Query 사용이 적절합니다.조건부 enabled 옵션을 사용하여 필요한 탭에서만 데이터를 가져오도록 구현한 것이 효율적입니다. 타입 지정도 정확하게 되어 있습니다.
56-82: 컴포넌트 렌더링 구조가 깔끔합니다.contentMap 패턴을 사용한 조건부 렌더링이 명확하고, 각 탭에 고유한 key를 부여한 것도 좋습니다. 전체적인 JSX 구조가 읽기 쉽게 구성되어 있습니다.
.github/workflows/deploy.yml (4)
4-10: 트리거 조건이 적절하게 설정되어 있습니다.docs/ 디렉토리 변경 시에만 워크플로우가 실행되도록 path 필터가 잘 설정되어 있고, develop 브랜치에 대한 push와 PR 모두 커버합니다.
12-19: 권한 및 동시성 설정이 올바릅니다.GitHub Pages 배포에 필요한 최소 권한만 부여하고, 동시성 제어로 중복 배포를 방지하는 설정이 적절합니다.
22-52: 빌드 단계가 체계적으로 구성되어 있습니다.pnpm 설정, Node.js 20 버전 사용, 캐시 활용, 그리고 VitePress 빌드 과정이 순서대로 잘 배치되어 있습니다. working-directory 설정도 정확합니다.
53-60: 배포 단계가 간단하고 명확합니다.build 작업 완료 후 GitHub Pages 배포가 정상적으로 진행되도록 구성되어 있습니다.
docs/git.md (2)
1-184: 포괄적이고 유용한 Git 전략 문서입니다.Squash Merge 전략, 브랜치 전략, 커밋 컨벤션 등이 체계적으로 정리되어 있어 팀 협업에 도움이 될 것입니다. 특히 왜 3브랜치 전략을 선택했는지에 대한 근거도 명확하게 제시되어 있습니다.
64-68: 이미지 참조 확인 완료: 파일이 존재하며 경로가 올바릅니다.
docs/git.md에서 참조하는image.png와image-1.png가 각각docs/image.png,docs/image-1.png로 동일 디렉토리에 존재함을 확인했습니다.docs/folder.md (1)
1-89: 명확하고 유용한 폴더 구조 가이드입니다.케밥 케이스 사용 이유와 각 폴더별 역할이 잘 설명되어 있고, 설계 원칙까지 포함되어 있어 팀원들이 프로젝트 구조를 이해하는 데 도움이 될 것입니다.
docs/coding.md (1)
1-125: 실용적이고 포괄적인 코딩 컨벤션입니다.React/TypeScript 개발에 필요한 핵심 규칙들이 잘 정리되어 있고, 코드 예시도 적절하게 포함되어 있습니다. 특히 Early Return 패턴, 구조 분해 할당, async/await 사용 등 모던 JavaScript 패턴들이 잘 반영되어 있습니다.
bongtta
force-pushed
the
feat/#211/complete-to-wait
branch
from
432eeb3 to
82e9aa0
Compare
|
MATEBALL-STORYBOOK |
4 participants
#️⃣ Related Issue
Closes #211
☀️ New-insight
그룹 매칭 시 승인 완료에서 요청 대기 중으로 상태를 변화시키는 api를 연동했습니다.
💎 PR Point
"승인 완료"인 카드 클릭 시 서버에 상태 변경 patch → 이후 결과 페이지로 이동 → 에러는 try/catch로 안전하게 처리
📸 Screenshot
Summary by CodeRabbit
새로운 기능
버그 수정
문서화
리팩터링/스타일
환경/설정