feat: implement Kakao OAuth login functionality#52
Merged
devgony merged 1 commit intoprography:mainfrom Jul 26, 2025
Merged
Conversation
- Add Kakao OAuth endpoint to constants - Implement handleKakaoLogin with proper OAuth flow - Add separate loading states for Google and Kakao buttons - Fix loading spinner issue where both buttons showed loading state
|
Caution Review failedThe pull request is closed. WalkthroughThe changes introduce separate loading state management for Google and Kakao OAuth login buttons within the onboarding login screen. The Kakao login handler is fully implemented, including CSRF state generation and redirection. Additionally, a Kakao OAuth authorization endpoint constant is added to the application's constants. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant LoginScreen
participant KakaoOAuth
User->>LoginScreen: Click Kakao Login
LoginScreen->>LoginScreen: Set isKakaoLoading true, save step, generate CSRF state
LoginScreen->>KakaoOAuth: Redirect to KAKAO_AUTHORIZE with params
KakaoOAuth-->>User: OAuth flow continues
sequenceDiagram
participant User
participant LoginScreen
participant GoogleOAuth
User->>LoginScreen: Click Google Login
LoginScreen->>LoginScreen: Set isGoogleLoading true, save step, generate CSRF state
LoginScreen->>GoogleOAuth: Redirect to Google OAuth with params
GoogleOAuth-->>User: OAuth flow continues
Estimated code review effort🎯 2 (Simple) | ⏱️ ~8 minutes Poem
Warning There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure. 🔧 ESLint
npm error Exit handler never called! 📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (2)
✨ Finishing Touches
🧪 Generate unit tests
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 (
|
devgony
added a commit
that referenced
this pull request
Jul 26, 2025
* Fix mypage (#46) * fix: improve onboarding redirect logic and implement logout - Add logout functionality in MyPage component using auth store - Optimize onboarding page redirect by using useGoals hook with loading state - Replace window.location.href with Next.js router.replace() for better performance - Add loading spinner during goal data fetch in onboarding - Remove SSR/CSR conflicts by moving redirect logic to useEffect * fix: handle Zustand hydration delay in onboarding page - Add hydration state check to prevent premature login state evaluation - Wait 50ms for Zustand persist data to hydrate before checking login status - Show loading spinner during hydration process - Add debug console logs for hydration and auth states - Fix redirect logic to only execute after store has been properly hydrated * fix: resolve 401 error and smooth onboarding page transitions - Fix premature API call issue where useGoals was called before login completion - Add error handling and retry logic for 401 authentication errors - Use SWR mutate function to retry goals API after successful login - Improve loading state logic to prevent flickering during page transitions - Set shouldRetryOnError to false to prevent automatic retries on auth errors - Show loading spinner until proper authentication and data fetching is complete * fix: improve loading spinner visibility and eliminate page flash - Change spinner color from border-primary-500 to border-gray-800 for better visibility on white background - Add additional loading state for when goals exist and redirect is about to happen - Prevent brief flash of onboarding content during page transitions - Show consistent loading spinner during all redirect scenarios * feat: add useCompletedGoals hook for completed goals API - Add completedGoals query to useQuery object - Export useCompletedGoals hook for backward compatibility - Connect to 목표Api.getCompletedGoals endpoint - Return CompletedGoalListRs with todo counts and result counts - Follow existing hook patterns and naming conventions * refactor: integrate useCompletedGoals hook in DoneItems component - Replace mock data with real API data using useCompletedGoals hook - Update interface to use CompletedGoalItemRs from generated API types - Map API response fields to component display (todoCount, dueDate) - Remove hardcoded defaultGoals array and use dynamic data - Maintain existing UI layout and styling patterns * refactor: clean up component formatting and remove redundant elements - Remove redundant status bar elements from onboarding components - Standardize code formatting with Prettier for mypage components - Clean up whitespace and indentation inconsistencies - Remove hardcoded status bar time displays - Maintain consistent React component structure patterns * feat: integrate real API data in DoneItemDetail component - Add useGoalWithSubGoalsAndTodos hook to API hooks file - Update DoneItemDetail to use GoalWithSubGoalTodoRs from API - Replace mock data with real API data in done item detail page - Map TodoRs properties to component display (date, todoResult.fileUrl) - Fix hook naming consistency (goalWithSubGoal vs goalWithSubGoals) - Remove hardcoded mock goal details and use dynamic data * fix: update DoneItems statistics display and layout - Add flex-1 to statistics spans for better layout - Replace hardcoded 0 with actual todoResultCount for record count * fix: improve UserProfile edit button styling and accessibility * feat: sync TextField styling with Figma design - Update TextField to use design tokens (Color-gray-20, Color-primary-50) - Add proper border styling with 1px solid border - Implement correct focus states with ring styling - Use consistent color scheme matching Figma specifications - Remove custom color overrides from EditProfile component * fix: handle empty string in profile image fallback Changed from ?? to || operator to properly handle both null/undefined and empty string values for profileImageUrl fallback to /profile-default.png * feat: add save success toast notification to EditProfile Added toast notification that displays "저장 되었습니다" when user clicks save button in profile edit page. Follows existing toast implementation pattern with 2-second auto-hide duration. * feat: implement interest selection bottom sheet with Korean localization - Created InterestSelectionBottomSheet component using vaul library following existing patterns - Added state management for interest selection in EditProfile component - Updated UserUpdateRqInterestsEnumToKr converter with correct API enum mappings - Integrated Korean display for all interest chips in both bottom sheet and main interface - Added visual feedback with selected interests display and placeholder text - Maintained type safety with proper TypeScript integration Interest mappings: - HEALTH → 건강, READING → 독서, STUDY → 학업, LANGUAGE → 어학 - SPORTS → 운동, PROGRAMMING → 프로그래밍, CAREER → 취업/이직, SELF_IMPROVEMENT → 자기개발 * fix: update EditProfile component styling and functionality * deleteAccount is not implemeneted alert * fix: remove non-existent props from EditProfile stories Remove initialName, initialBio, and profileImageUrl from argTypes and story args as these props don't exist in the EditProfileProps interface. The component gets data from useMyProfile hook instead. * feat: replace point icon placeholder with money image in PointsDisplay * fix: resolve TypeScript error in useGoalWithSubGoalTodo hook Switch from useGoalWithSubGoals to useGoalWithSubGoalsAndTodos to access todos property on SubGoalWithTodosRs type. * feat: implement feed page with Figma design Add new /feed route with coming soon message and image from Figma design. Excludes system status bar as requested. * refactor: restructure feed page architecture and fix height issues - Extract FeedPage component to components/feed/ - Follow group page pattern with dynamic BottomTabBar import - Fix height calculation to prevent scrolling (calc(100vh-56px)) - Add Storybook integration for FeedPage component - Improve component separation and maintainability * style: update feed page styling to exactly match Figma design - Change background from gray to white - Remove notification button from AppBar - Add w-full to content container for proper width - Clean up component styling and formatting * feat: connect MyPage interests button to EditProfile interests selection - Update MyPage onAddInterests to navigate to /mypage/edit?openInterests=true - Add openInterests prop to EditProfile component - Auto-open interests bottom sheet when openInterests query param is present * feat: implement profile image upload functionality in EditProfile - Add file input state and ref for image selection - Implement handleImageUpload function to process selected files - Connect edit button to file picker with handleEditImage - Update onSave callback to pass selected file to parent component - Add hidden file input with image/* accept filter * feat: add image preview for profile picture upload - Add previewUrl state to show selected image immediately - Update handleImageUpload to create object URL for preview - Update img src to display preview before save - Add URL cleanup in useEffect to prevent memory leaks * style: remove background from profile pictures to fill full circle - Remove gray background and padding from EditProfile profile image - Update UserProfile to show full-size images without background - Keep background only for placeholder icon in UserProfile - Increase image size to fill the full 100px circle * style: update MyPage layout to match Figma design - Add gray background to UserProfile component with proper padding - Update MyPage layout structure for correct background colors - Format NavigationList component and improve hover states - Align profile section styling with Figma specifications * refactor: replace custom AppBar with shared AppBar component in EditProfile - Replace custom header implementation with AppBar component - Use AppBar type="back" with title and onBackClick handler - Position save button as absolute overlay on right side - Maintain consistent header height with standardized spacing * style: update EditProfile layout to match UserProfile styling - Replace simple profile image section with structured layout - Add consistent background and padding to profile section - Use same gap and spacing pattern as UserProfile component - Maintain visual consistency between profile components * refactor: simplify UserProfile image handling with fallback - Remove conditional rendering for profile image - Use fallback to default profile image when no profileImage provided - Consistent with EditProfile approach using profile-default.png - Simplify component logic while maintaining functionality * feat: update API types with new message features and user deletion - Add file metadata (fileName, fileMimeType) to TodoResultRs - Add GoalTitleUpdatedContent and MessageReactionContent types - Add MESSAGE_REACTION and GOAL_TITLE_UPDATE message types - Add user deletion endpoint - Add new goal query endpoint with all todos - Update group exit response status code * feat: implement user account deletion functionality - Replace placeholder alert with actual deleteUser API call - Add toast notification for deletion confirmation - Add automatic logout and redirect to home after deletion - Import required useToast and useAuthStore hooks * implement todoResult for both completed and incompleted * refactor: replace manual toast with useToast hook in EditProfile * fix: wrap useSearchParams in Suspense boundary for EditProfile page * feat: update button text based on initial interests state * style: add cursor pointer and improve formatting in EditIcon * Qa - 파비콘 추가 (#50) * feat: 파비콘 변경 * feat: implement Kakao OAuth login functionality (#52) - Add Kakao OAuth endpoint to constants - Implement handleKakaoLogin with proper OAuth flow - Add separate loading states for Google and Kakao buttons - Fix loading spinner issue where both buttons showed loading state --------- Co-authored-by: SangHyeon Lee <67571350+Hys-Lee@users.noreply.github.com>
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
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.
Summary by CodeRabbit
New Features
Enhancements