feat: 홈 앱 공유 온보딩 모달 추가 - #411
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Discord 스레드 연동용 메타데이터입니다. discord-pr-bot 워크플로가 자동 생성하며, 수정·삭제하면 PR 과 Discord 알림 연동이 끊깁니다. |
ℹ️ Recent review info⚙️ Run configurationConfiguration used: Repository UI Review profile: CHILL Plan: Pro Plus Run ID: ⛔ Files ignored due to path filters (4)
📒 Files selected for processing (11)
📝 WalkthroughWalkthrough홈 페이지에 토너먼트 생성 다이얼로그를 분리하고, 플랫폼별 홈 온보딩 캐러셀을 추가했습니다. 온보딩 완료 상태는 localStorage에 저장합니다. Playwright 인증 상태는 온보딩 완료 상태를 포함하도록 변경했습니다. Changes홈 사용자 경험
Estimated code review effort: 3 (Moderate) | ~25 minutes Sequence Diagram(s)sequenceDiagram
participant HomePage
participant HomeOnboarding
participant localStorage
participant OnboardingIndicator
HomePage->>HomeOnboarding: render
HomeOnboarding->>localStorage: read ONBOARDING_KEY.HOME
HomeOnboarding->>OnboardingIndicator: pass current slide state
OnboardingIndicator->>HomeOnboarding: select slide index
HomeOnboarding->>localStorage: save completion on close
Possibly related PRs
Suggested labels: Suggested reviewers: 🚥 Pre-merge checks | ✅ 3 | ❌ 2❌ Failed checks (2 warnings)
✅ Passed checks (3 passed)
✨ Finishing Touches 💡 1📝 Generate docstrings 💡
🧪 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 |
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
apps/web/src/app/home/_consts/onboarding.ts (1)
1-4: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winimport 규칙을 일관되게 적용하세요.
프로젝트 모듈은 같은 디렉터리의 파일이 아닌 경우
@/절대 경로로 import해야 합니다. 변경한 import 선언에는 세미콜론도 추가하세요.
apps/web/src/app/home/_consts/onboarding.ts#L1-L4: SVG import를@/app/home/_assets/...절대 경로로 변경하고 세미콜론을 추가하세요.apps/web/src/components/common/onboarding-indicator/index.tsx#L1-L1: import 끝에 세미콜론을 추가하세요.apps/web/src/app/onboarding/_components/OnboardingClient.tsx#L9-L9: import 끝에 세미콜론을 추가하세요.apps/web/src/app/home/_components/home-onboarding/index.tsx#L3-L15:getOnboardingSlidesimport를@/app/home/_consts/onboarding으로 변경하고 import 선언에 세미콜론을 추가하세요.수정 예시
-import Onboarding1 from '../_assets/onboarding-1.svg'; +import Onboarding1 from '`@/app/home/_assets/onboarding-1.svg`'; -import { getOnboardingSlides } from '../../_consts/onboarding'; +import { getOnboardingSlides } from '`@/app/home/_consts/onboarding`';As per coding guidelines, project modules must use absolute imports outside the same directory and TypeScript files must use semicolons.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@apps/web/src/app/home/_consts/onboarding.ts` around lines 1 - 4, 일관된 import 규칙과 세미콜론을 적용하세요. apps/web/src/app/home/_consts/onboarding.ts 1-4의 SVG import를 `@/app/home/_assets/`... 절대 경로로 변경하고 세미콜론을 추가하세요. apps/web/src/components/common/onboarding-indicator/index.tsx 1-1 및 apps/web/src/app/onboarding/_components/OnboardingClient.tsx 9-9의 import 선언에 세미콜론을 추가하세요. apps/web/src/app/home/_components/home-onboarding/index.tsx 3-15의 getOnboardingSlides import를 `@/app/home/_consts/onboarding` 절대 경로로 변경하고 세미콜론을 추가하세요.Source: Coding guidelines
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@apps/web/src/components/common/onboarding-indicator/index.tsx`:
- Around line 13-21: Update the slide indicator buttons in the onboarding
indicator component to expose the selected slide to assistive technologies by
adding aria-current="step" only when i equals currentIndex; leave it unset for
inactive buttons.
---
Nitpick comments:
In `@apps/web/src/app/home/_consts/onboarding.ts`:
- Around line 1-4: 일관된 import 규칙과 세미콜론을 적용하세요.
apps/web/src/app/home/_consts/onboarding.ts 1-4의 SVG import를
`@/app/home/_assets/`... 절대 경로로 변경하고 세미콜론을 추가하세요.
apps/web/src/components/common/onboarding-indicator/index.tsx 1-1 및
apps/web/src/app/onboarding/_components/OnboardingClient.tsx 9-9의 import 선언에
세미콜론을 추가하세요. apps/web/src/app/home/_components/home-onboarding/index.tsx 3-15의
getOnboardingSlides import를 `@/app/home/_consts/onboarding` 절대 경로로 변경하고 세미콜론을
추가하세요.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro Plus
Run ID: b7684875-9924-448e-81ce-a9d8fd241c3f
⛔ Files ignored due to path filters (4)
apps/web/src/app/home/_assets/onboarding-1.svgis excluded by!**/*.svgapps/web/src/app/home/_assets/onboarding-2.svgis excluded by!**/*.svgapps/web/src/app/home/_assets/onboarding-3-android.svgis excluded by!**/*.svgapps/web/src/app/home/_assets/onboarding-3-ios.svgis excluded by!**/*.svg
📒 Files selected for processing (11)
apps/web/e2e/consts.tsapps/web/e2e/setup/auth.setup.tsapps/web/playwright.config.tsapps/web/src/app/home/_components/CreateTournamentDialog.tsxapps/web/src/app/home/_components/home-onboarding/index.tsxapps/web/src/app/home/_consts/onboarding.tsapps/web/src/app/home/page.tsxapps/web/src/app/onboarding/_components/OnboardingClient.tsxapps/web/src/components/common/onboarding-indicator/index.tsxapps/web/src/consts/onboarding.tsapps/web/src/consts/zIndex.ts
There was a problem hiding this comment.
Caution
Inline review comments failed to post. This is likely due to GitHub's internal server error or limits when posting large numbers of comments. If you are seeing this consistently it is likely a permissions issue. Please check "Moderation" -> "Code review limits" under your organization settings.
Actionable comments posted: 1
🧹 Nitpick comments (1)
apps/web/src/app/home/_consts/onboarding.ts (1)
1-4: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winimport 규칙을 일관되게 적용하세요.
프로젝트 모듈은 같은 디렉터리의 파일이 아닌 경우
@/절대 경로로 import해야 합니다. 변경한 import 선언에는 세미콜론도 추가하세요.
apps/web/src/app/home/_consts/onboarding.ts#L1-L4: SVG import를@/app/home/_assets/...절대 경로로 변경하고 세미콜론을 추가하세요.apps/web/src/components/common/onboarding-indicator/index.tsx#L1-L1: import 끝에 세미콜론을 추가하세요.apps/web/src/app/onboarding/_components/OnboardingClient.tsx#L9-L9: import 끝에 세미콜론을 추가하세요.apps/web/src/app/home/_components/home-onboarding/index.tsx#L3-L15:getOnboardingSlidesimport를@/app/home/_consts/onboarding으로 변경하고 import 선언에 세미콜론을 추가하세요.수정 예시
-import Onboarding1 from '../_assets/onboarding-1.svg'; +import Onboarding1 from '`@/app/home/_assets/onboarding-1.svg`'; -import { getOnboardingSlides } from '../../_consts/onboarding'; +import { getOnboardingSlides } from '`@/app/home/_consts/onboarding`';As per coding guidelines, project modules must use absolute imports outside the same directory and TypeScript files must use semicolons.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@apps/web/src/app/home/_consts/onboarding.ts` around lines 1 - 4, 일관된 import 규칙과 세미콜론을 적용하세요. apps/web/src/app/home/_consts/onboarding.ts 1-4의 SVG import를 `@/app/home/_assets/`... 절대 경로로 변경하고 세미콜론을 추가하세요. apps/web/src/components/common/onboarding-indicator/index.tsx 1-1 및 apps/web/src/app/onboarding/_components/OnboardingClient.tsx 9-9의 import 선언에 세미콜론을 추가하세요. apps/web/src/app/home/_components/home-onboarding/index.tsx 3-15의 getOnboardingSlides import를 `@/app/home/_consts/onboarding` 절대 경로로 변경하고 세미콜론을 추가하세요.Source: Coding guidelines
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@apps/web/src/components/common/onboarding-indicator/index.tsx`:
- Around line 13-21: Update the slide indicator buttons in the onboarding
indicator component to expose the selected slide to assistive technologies by
adding aria-current="step" only when i equals currentIndex; leave it unset for
inactive buttons.
---
Nitpick comments:
In `@apps/web/src/app/home/_consts/onboarding.ts`:
- Around line 1-4: 일관된 import 규칙과 세미콜론을 적용하세요.
apps/web/src/app/home/_consts/onboarding.ts 1-4의 SVG import를
`@/app/home/_assets/`... 절대 경로로 변경하고 세미콜론을 추가하세요.
apps/web/src/components/common/onboarding-indicator/index.tsx 1-1 및
apps/web/src/app/onboarding/_components/OnboardingClient.tsx 9-9의 import 선언에
세미콜론을 추가하세요. apps/web/src/app/home/_components/home-onboarding/index.tsx 3-15의
getOnboardingSlides import를 `@/app/home/_consts/onboarding` 절대 경로로 변경하고 세미콜론을
추가하세요.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro Plus
Run ID: b7684875-9924-448e-81ce-a9d8fd241c3f
⛔ Files ignored due to path filters (4)
apps/web/src/app/home/_assets/onboarding-1.svgis excluded by!**/*.svgapps/web/src/app/home/_assets/onboarding-2.svgis excluded by!**/*.svgapps/web/src/app/home/_assets/onboarding-3-android.svgis excluded by!**/*.svgapps/web/src/app/home/_assets/onboarding-3-ios.svgis excluded by!**/*.svg
📒 Files selected for processing (11)
apps/web/e2e/consts.tsapps/web/e2e/setup/auth.setup.tsapps/web/playwright.config.tsapps/web/src/app/home/_components/CreateTournamentDialog.tsxapps/web/src/app/home/_components/home-onboarding/index.tsxapps/web/src/app/home/_consts/onboarding.tsapps/web/src/app/home/page.tsxapps/web/src/app/onboarding/_components/OnboardingClient.tsxapps/web/src/components/common/onboarding-indicator/index.tsxapps/web/src/consts/onboarding.tsapps/web/src/consts/zIndex.ts
🛑 Comments failed to post (1)
apps/web/src/components/common/onboarding-indicator/index.tsx (1)
13-21: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
선택된 슬라이드를 보조기술에 표시하세요.
현재 슬라이드는 클래스명으로만 구분됩니다. 화면 읽기 사용자는 현재 슬라이드를 알 수 없습니다. 활성 버튼에
aria-current="step"을 추가하세요.수정 예시
aria-label={`${i + 1}번째 슬라이드`} + aria-current={i === currentIndex ? 'step' : undefined} onClick={() => onSelect(i)}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.<button key={i} type="button" aria-label={`${i + 1}번째 슬라이드`} aria-current={i === currentIndex ? 'step' : undefined} onClick={() => onSelect(i)} className={cn( 'h-2 cursor-pointer rounded-full transition-all duration-300', i === currentIndex ? 'w-5 bg-icon-neutral-primary' : 'w-2 bg-icon-neutral-secondary' )}🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@apps/web/src/components/common/onboarding-indicator/index.tsx` around lines 13 - 21, Update the slide indicator buttons in the onboarding indicator component to expose the selected slide to assistive technologies by adding aria-current="step" only when i equals currentIndex; leave it unset for inactive buttons.
작업 요약
작업 내용
스크린샷
2026-08-01.10.58.01.mov
연관 이슈
closes #394
Summary by CodeRabbit