feat: 로그인 진입 온보딩 슬라이드 구현 - #406
Conversation
- 인디케이터/다음 버튼을 BottomCta(hasGradient)로 감쌈 — 시안의 36px Top Gradient와 동일 - main을 min-h-dvh -> h-dvh로 변경. 상한이 없어 페이지가 늘어나면서 flex-1이 축소되지 않던 문제 - 일러스트 max-h-full은 부모 높이를 순환 참조해 클램프되지 않아, h-full + preserveAspectRatio 기반으로 교체
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Discord 스레드 연동용 메타데이터입니다. discord-pr-bot 워크플로가 자동 생성하며, 수정·삭제하면 PR 과 Discord 알림 연동이 끊깁니다. |
|
Warning Review limit reached
Next review available in: 17 minutes Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: Repository UI Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthrough스플래시 이후 온보딩 열람 여부에 따라 Changes로그인 진입 온보딩 흐름
Estimated code review effort: 3 (Moderate) | ~20 minutes Sequence Diagram(s)sequenceDiagram
participant SplashClient
participant OnboardingStorage
participant OnboardingClient
participant LoginPage
SplashClient->>OnboardingStorage: hasSeenOnboarding()
alt 미열람
SplashClient->>OnboardingClient: /onboarding 프리페치 및 이동
OnboardingClient->>OnboardingStorage: markOnboardingSeen()
OnboardingClient->>LoginPage: 마지막 슬라이드에서 /login 이동
else 열람 완료
SplashClient->>LoginPage: /login 프리페치 및 이동
end
Possibly related PRs
🚥 Pre-merge checks | ✅ 3 | ❌ 2❌ Failed checks (1 warning, 1 inconclusive)
✅ 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 (2)
apps/web/src/app/onboarding/_components/OnboardingClient.tsx (2)
8-8: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win
CarouselApi를import type으로 분리하세요.
CarouselApi는 타입 위치에서만 사용됩니다. 값 import와 분리해 타입 전용 import 규칙을 따르세요.수정 예시
-import { Carousel, type CarouselApi, CarouselContent, CarouselItem } from '`@/components/carousel`'; +import { Carousel, CarouselContent, CarouselItem } from '`@/components/carousel`'; +import type { CarouselApi } from '`@/components/carousel`';As per coding guidelines, “use type-only imports via
import type.”🤖 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/onboarding/_components/OnboardingClient.tsx` at line 8, Separate the CarouselApi type from the runtime Carousel import in the OnboardingClient imports, using an import type declaration for CarouselApi while keeping Carousel, CarouselContent, and CarouselItem as value imports.Source: Coding guidelines
13-13: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win교차 디렉터리 import를
@/절대 경로로 변경하세요.같은 디렉터리가 아닌 프로젝트 모듈에 상대 import를 사용하고 있습니다.
apps/web/src/app/onboarding/_components/OnboardingClient.tsx#L13-L13:ONBOARDING_SLIDESimport를@/app/onboarding/_consts/onboardingSlide로 변경하세요.apps/web/src/app/onboarding/_consts/onboardingSlide.ts#L1-L2: SVG import를@/app/onboarding/_assets/...절대 경로로 변경하세요.apps/web/src/app/onboarding/page.tsx#L1-L1:OnboardingClientimport를@/app/onboarding/_components/OnboardingClient로 변경하세요.As per coding guidelines, “Use
@/*absolute imports for project modules and relative imports only for files in the same directory.”🤖 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/onboarding/_components/OnboardingClient.tsx` at line 13, Replace the cross-directory relative imports with `@/`* absolute imports: update ONBOARDING_SLIDES in apps/web/src/app/onboarding/_components/OnboardingClient.tsx#L13-L13 to `@/app/onboarding/_consts/onboardingSlide`, update the SVG imports in apps/web/src/app/onboarding/_consts/onboardingSlide.ts#L1-L2 to `@/app/onboarding/_assets/`... paths, and update the OnboardingClient import in apps/web/src/app/onboarding/page.tsx#L1-L1 to `@/app/onboarding/_components/OnboardingClient`.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/app/onboarding/_components/OnboardingIndicator.tsx`:
- Around line 19-21: On the indicator button class construction in
OnboardingIndicator, add the cursor-pointer utility to indicate the element is
clickable. Keep the existing size, color, and transition classes unchanged.
---
Nitpick comments:
In `@apps/web/src/app/onboarding/_components/OnboardingClient.tsx`:
- Line 8: Separate the CarouselApi type from the runtime Carousel import in the
OnboardingClient imports, using an import type declaration for CarouselApi while
keeping Carousel, CarouselContent, and CarouselItem as value imports.
- Line 13: Replace the cross-directory relative imports with `@/`* absolute
imports: update ONBOARDING_SLIDES in
apps/web/src/app/onboarding/_components/OnboardingClient.tsx#L13-L13 to
`@/app/onboarding/_consts/onboardingSlide`, update the SVG imports in
apps/web/src/app/onboarding/_consts/onboardingSlide.ts#L1-L2 to
`@/app/onboarding/_assets/`... paths, and update the OnboardingClient import in
apps/web/src/app/onboarding/page.tsx#L1-L1 to
`@/app/onboarding/_components/OnboardingClient`.
🪄 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: 1d157862-c6b4-47a9-837e-202df80b942a
⛔ Files ignored due to path filters (2)
apps/web/src/app/onboarding/_assets/onboarding-1.svgis excluded by!**/*.svgapps/web/src/app/onboarding/_assets/onboarding-2.svgis excluded by!**/*.svg
📒 Files selected for processing (10)
apps/web/next.config.mjsapps/web/src/app/_components/SplashClient.tsxapps/web/src/app/onboarding/_components/OnboardingClient.tsxapps/web/src/app/onboarding/_components/OnboardingIndicator.tsxapps/web/src/app/onboarding/_consts/onboardingSlide.tsapps/web/src/app/onboarding/page.tsxapps/web/src/consts/onboarding.tsapps/web/src/consts/route.tsapps/web/src/utils/getRouteType.tsapps/web/src/utils/onboarding.ts
* chore: E2E 목 데이터·fixture 확장 (토너먼트 상태별·위시·회원) Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * test: 솔로 토너먼트 생성·아이템 담기 E2E 추가 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * test: 솔로 토너먼트 매치 진행 E2E 추가 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * test: 솔로 토너먼트 결과 영수증 E2E 추가 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * fix: 결승 진출 목 데이터를 실제 승자(11·13) 기준으로 수정 * test: 토너먼트 생성·위시 담기 요청 payload 검증 추가 * fix: test에서 사용하는 타입 export로 변경 --------- Co-authored-by: Claude Fable 5 <noreply@anthropic.com> Co-authored-by: Jung Sun A <amber0809@naver.com> Co-authored-by: iOdiO89 <117376841+iOdiO89@users.noreply.github.com>
작업 요약
작업 내용
/onboarding라우트 추가 — 슬라이드 2장 캐러셀(좌우 스와이프 +다음버튼), 인디케이터와다음버튼은 공통BottomCta로 감쌌습니다.consts/onboarding.ts(키) +utils/onboarding.ts(read/mark)로 분리했습니다. 홈 온보딩 등은 키만 추가해 재사용할 수 있습니다.a,b로 축약해 한 페이지에 인라인된 SVG 끼리url(#...)참조가 충돌하던 문제를next.config.mjs에서 함께 수정했습니다. 온보딩 외에 defs 를 가진 SVG 전반에 해당합니다.스크린샷
2026-07-31.12.34.59.mov
연관 이슈
closes #393
Summary by CodeRabbit
새 기능
개선