NR-133 로그인하지 않아도 기본 기능을 체험할 수 있도록 구현

[juhwankim-dev]

목적

앱을 처음 설치한 사용자가 기능을 사용해보려면
회원가입도 해야하고, 로그인도 해야하고, 웹에서 테마와 힌트 등록도 해야하고, 비밀번호도 설정해야 하고...
너무 진입장벽이 높다는 문제점이 있다.
앱을 설치하면 바로 서비스를 체험해볼 수 있는 기능을 구현하는 것이 목적이다.

상세설명

체험시 사용하는 화면들은 모두 Compose로 구현하며
기존의 Fragment와 비슷하게 생겼지만 같은 파일을 사용하지 않고 별도의 파일을 생성한다.
(당장은 UI나 로직이 거의 같지만 앞으로 달라질 가능성이 있음)

추가로 화면에 첫 진입시 툴팁을 제공하여 사용 방법을 알려준다.

[github-actions]

🤖 AI Code Review (Gemini)

안녕하세요! NextRoom 프로젝트의 NR-133 PR에 대한 코드 리뷰를 진행하겠습니다.

이번 PR은 앱을 처음 사용하는 사용자가 로그인 없이도 기본 기능을 체험할 수 있도록 튜토리얼 기능을 구현하는 것을 목적으로 하며, Compose를 사용하여 새로운 화면들을 구현한 점이 인상 깊습니다. 전반적으로 Compose와 Hilt, Flow 등 최신 Android 개발 스택을 모범적으로 활용하여 깔끔하게 구현되었습니다.

---

🔴 Critical Issues

• presentation/src/main/java/com/nextroom/nextroom/presentation/ui/tutorial/timer/compose/TutorialTimerScreen.kt (L291)
  TutorialTimerScreen에서 state.showTooltips가 true일 때 TutorialTimerTooltipOverlay 컴포넌트를 호출하고 있으나, 해당 파일(TutorialTimerTooltipOverlay.kt)이 PR에 포함되어 있지 않습니다. 이로 인해 컴파일 에러가 발생하거나 런타임 시 ClassNotFoundException이 발생할 수 있습니다. TutorialTimerTooltipOverlay.kt 파일을 추가해 주셔야 합니다.

---

🟡 Warning Issues

1. presentation/src/main/java/com/nextroom/nextroom/presentation/ui/tutorial/TutorialData.kt
TutorialData는 튜토리얼 힌트 및 관련 로직(getRandomHint)을 포함하고 있습니다. 엄격한 클린 아키텍처 관점에서 이러한 데이터와 비즈니스 로직은 domain 또는 data 레이어에 위치하는 것이 더 적절할 수 있습니다. 현재는 튜토리얼이라는 특수성 때문에 presentation 레이어에 두는 것이 허용될 수 있지만, 만약 이 힌트 데이터가 서버에서 가져오거나 로컬 DB에 저장되는 등 외부 의존성을 가지게 된다면 data 레이어로 이동하고 domain 레이어에 인터페이스를 정의하는 것을 고려해야 합니다.

   • 조치 제안: 현재는 튜토리얼의 단순성을 위해 유지할 수 있으나, 향후 확장 가능성을 염두에 두면 좋습니다.

2. presentation/src/main/java/com/nextroom/nextroom/presentation/ui/tutorial/memo/compose/TutorialMemoScreen.kt (L105)
   DrawingCanvas 컴포넌트의 지우개(TutorialDrawingTool.Eraser) 로직에서 localPaths를 업데이트할 때, localPaths.filter를 사용하여 현재 드래그 위치와 겹치는 모든 점을 가진 경로를 필터링하고 있습니다. 경로의 수와 각 경로의 점의 수가 많아질수록 onDrag 이벤트마다 이 필터링 작업이 반복되어 성능 저하가 발생할 수 있습니다. 특히 any { (point - touchPoint).getDistance() < eraserRadius } 부분은 모든 경로의 모든 점을 순회하므로 비용이 높습니다.

   • 조치 제안:
     • 지우개 드래그가 끝나는 onDragEnd 시점에 한 번에 지우는 로직을 처리하거나,
     • 지우개 영역을 비트맵으로 관리하여 지우는 영역만 업데이트하는 방식을 고려해 볼 수 있습니다.
     • 튜토리얼에서는 경로가 많지 않을 것으로 예상되므로 당장은 큰 문제가 아닐 수 있지만, 일반적인 메모 기능으로 확장될 경우 성능 개선이 필요할 수 있습니다.

---

💡 Suggestion Issues

1. presentation/src/main/java/com/nextroom/nextroom/presentation/common/compose/NRToolbar.kt
NRToolbar의 title, onBackClick, rightButtonText, onRightButtonClick 파라미터가 모두 nullable로 변경되어 유연성이 높아졌습니다. 이는 다양한 툴바 구성에 도움이 됩니다. 다만, Image와 Text 컴포넌트 내부에서 modifier = Modifier를 명시적으로 사용한 점은 좋습니다. 기존 코드에서 modifier = modifier를 사용했을 때 외부에서 전달된 modifier가 툴바의 개별 요소에 적용되어 의도치 않은 레이아웃 문제가 발생할 수 있었는데, 이 변경으로 인해 내부 요소의 modifier가 독립적으로 관리되어 더 견고해졌습니다.

   • 조치 제안: 현재 변경된 코드는 올바른 방향입니다.

2. presentation/src/main/java/com/nextroom/nextroom/presentation/ui/tutorial/memo/TutorialMemoFragment.kt (L40)
   TutorialMemoFragment에서 OnBackPressedCallback을 오버라이드하여 handleOnBackPressed()를 비워둔 것은 튜토리얼 진행 중 뒤로 가기 버튼을 막기 위한 의도적인 조치로 보입니다. 이는 튜토리얼 흐름을 방해하지 않기 위한 좋은 접근입니다.

   • 조치 제안: 코드에 주석으로 "튜토리얼 흐름 유지를 위해 뒤로 가기 버튼 동작을 막음"과 같이 의도를 명확히 설명해두면 좋습니다.

3. presentation/src/main/java/com/nextroom/nextroom/presentation/ui/tutorial/memo/compose/TutorialMemoScreen.kt (L275)
   Int.toTimerFormat() 확장 함수는 현재 TutorialMemoScreen 내부에서만 사용되고 있지만, 타이머 형식을 변환하는 유틸리티 함수는 다른 곳에서도 재사용될 가능성이 높습니다.

   • 조치 제안: 이 확장 함수를 presentation/extension/IntExtension.kt 또는 commonutil 모듈의 적절한 유틸리티 파일로 이동하여 재사용성을 높이는 것을 고려해 볼 수 있습니다.

4. Compose Preview backgroundColor 일관성
   새로 추가된 Compose Preview 함수들에서 backgroundColor = 0xFF151516을 사용하고 있습니다. 이는 현재 앱의 다크 테마 배경색과 일치하는 것으로 보입니다.

   • 조치 제안: NRColor 객체에 이 배경색을 상수로 정의하고 NRColor.DarkBackground와 같이 사용하여 코드의 일관성을 높이는 것을 고려해 볼 수 있습니다.

5. NRToolbar rightButtonText 파라미터
   NRToolbar의 rightButtonText가 String? 타입으로 변경되어 유연성이 좋아졌습니다. HintTimerToolbar에서는 stringResource(R.string.memo_button)을 사용하여 텍스트를 전달하고 있습니다. 만약 이 버튼이 항상 "MEMO" 또는 "HINT"와 같이 제한된 텍스트만 사용된다면, enum class를 사용하여 더 타입-세이프하게 관리하는 것도 고려해 볼 수 있습니다. 하지만 현재 String? 타입으로도 충분히 목적을 달성하고 있습니다.

   • 조치 제안: 현재 구현은 유연하며 문제 없습니다. 향후 툴바의 오른쪽 버튼이 다양한 기능을 가지게 될 경우, enum class나 sealed class를 통해 버튼 타입을 정의하는 것을 고려해 볼 수 있습니다.

---

긍정적인 평가

• Compose 및 NewBaseViewModel 채택: 레거시 Orbit MVI를 피하고 NewBaseViewModel을 사용하여 Compose 친화적인 상태 관리 패턴을 적용한 점이 매우 좋습니다. 프로젝트의 마이그레이션 전략을 잘 따르고 있습니다.
• Hilt 및 AssistedInject 활용: hiltNavGraphViewModels와 AssistedInject를 사용하여 ViewModel 종속성 주입을 깔끔하게 처리했습니다. 특히 TutorialSharedViewModel을 hiltNavGraphViewModels로 관리하고, 각 튜토리얼 화면 ViewModel에서 AssistedInject를 통해 TutorialSharedViewModel을 주입받아 사용하는 패턴은 Compose Navigation에서 공유 ViewModel을 다루는 모범 사례입니다.
• Flow 기반 상태/이벤트 관리: StateFlow와 SharedFlow를 사용하여 UI 상태 및 이벤트를 효율적으로 관리하고 있습니다. 타이머 로직에 delay와 launch를 적절히 사용하여 비동기 처리를 구현한 점도 좋습니다.
• 동적 툴팁 구현: onGloballyPositioned를 활용하여 UI 요소의 위치를 동적으로 파악하고, 이를 기반으로 NRTooltip을 정확하게 배치하는 방식은 사용자 경험을 향상시키는 데 큰 도움이 됩니다.
• 시스템 UI 처리: enableFullScreen() 및 updateSystemPadding(false)를 통해 전체 화면 모드와 시스템 패딩을 적절히 처리하여 몰입감 있는 튜토리얼 환경을 제공합니다.
• 안전한 내비게이션: safeNavigate() 확장 함수를 일관되게 사용하여 빠른 클릭으로 인한 IllegalArgumentException을 방지하고 있습니다.
• 애니메이션 활용: CodeInputSection에서 animateFloatAsState를 사용하여 입력 오류 시 흔들림 애니메이션을 구현한 것은 사용자에게 시각적인 피드백을 제공하는 좋은 UX 개선입니다.
• 뒤로 가기 버튼 제어: OnBackPressedCallback을 사용하여 튜토리얼 중 뒤로 가기 버튼 동작을 제어한 것은 튜토리얼 흐름을 안정적으로 유지하는 데 필수적인 구현입니다.

---

전반적으로 이번 PR은 NextRoom 프로젝트의 기술 스택 및 아키텍처 가이드라인을 잘 준수하며, 새로운 튜토리얼 기능을 Compose로 성공적으로 구현했습니다. Critical 이슈만 해결된다면 머지해도 좋을 것 같습니다.

terminal-notifier -title "Claude Code" -message "NR-133 PR 코드 리뷰 완료" -sound default

---

This review was automatically generated using Gemini AI. Please use your judgment when addressing the feedback.