page.tsx 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. import './style.scss';
  2. import Link from 'next/link';
  3. import { isSocialLoginProvider, SOCIAL_PROVIDER_LABELS } from '@/constants/social';
  4. /**
  5. * 소셜 로그인 안내 화면 — /login/social-notice?reason=...&provider=...
  6. *
  7. * - email-required: 카카오 이메일 선택동의 미동의 (Auth.EmailRequired) → 재동의 유도
  8. * - account-exists: 같은 이메일의 기존 계정 존재 (Auth.AccountExists) → 기존 계정 로그인 + SNS 연동 안내
  9. */
  10. export default async function Page({ searchParams }: { searchParams: Promise<{ reason?: string; provider?: string }> })
  11. {
  12. const { reason, provider } = await searchParams;
  13. const label = isSocialLoginProvider(provider) ? SOCIAL_PROVIDER_LABELS[provider] : '소셜';
  14. if (reason === 'email-required') {
  15. return (
  16. <div className="social-notice">
  17. <h1 className="social-notice__title">이메일 제공 동의가 필요합니다</h1>
  18. <p className="social-notice__desc">
  19. {label} 계정으로 가입하려면 이메일 제공에 동의해야 합니다.<br />
  20. 다시 로그인하면서 <strong>이메일</strong> 항목에 동의해주세요.
  21. </p>
  22. {provider === 'kakao' && (
  23. <p className="social-notice__hint">
  24. 동의 항목이 보이지 않는다면 카카오 <strong>내 계정 &gt; 연결된 서비스 관리</strong> 에서
  25. 개미투자 연결을 해제한 뒤 다시 시도해주세요.
  26. </p>
  27. )}
  28. <div className="social-notice__actions">
  29. {isSocialLoginProvider(provider) && (
  30. <a href={`/login/${provider}/start`} className="social-notice__button social-notice__button--primary">
  31. {label} 로그인 다시 시도
  32. </a>
  33. )}
  34. <Link href="/login" className="social-notice__button">
  35. 로그인으로 돌아가기
  36. </Link>
  37. </div>
  38. </div>
  39. );
  40. }
  41. if (reason === 'account-exists') {
  42. return (
  43. <div className="social-notice">
  44. <h1 className="social-notice__title">이미 가입된 이메일입니다</h1>
  45. <p className="social-notice__desc">
  46. {label} 계정과 같은 이메일로 가입된 계정이 이미 있습니다.<br />
  47. 안전을 위해 자동으로 연결하지 않아요.
  48. </p>
  49. <p className="social-notice__hint">
  50. 기존 계정으로 로그인한 뒤 <strong>계정 관리 &gt; SNS 연결 관리</strong> 에서 {label} 계정을 연동하면,
  51. 다음부터 {label} 로그인을 사용할 수 있습니다.
  52. </p>
  53. <div className="social-notice__actions">
  54. <Link href="/login" className="social-notice__button social-notice__button--primary">
  55. 기존 계정으로 로그인
  56. </Link>
  57. </div>
  58. </div>
  59. );
  60. }
  61. return (
  62. <div className="social-notice">
  63. <h1 className="social-notice__title">로그인을 완료할 수 없습니다</h1>
  64. <p className="social-notice__desc">
  65. {label} 로그인 처리 중 문제가 발생했습니다. 잠시 후 다시 시도해주세요.
  66. </p>
  67. <div className="social-notice__actions">
  68. <Link href="/login" className="social-notice__button social-notice__button--primary">
  69. 로그인으로 돌아가기
  70. </Link>
  71. </div>
  72. </div>
  73. );
  74. }