From d4e45d9b52c04d55ca31cda37c8a54543d14464b Mon Sep 17 00:00:00 2001 From: mdy3722 Date: Sat, 1 Nov 2025 11:50:43 +0900 Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20=EB=A1=9C=EA=B7=B8=EC=9D=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/login/page.tsx | 169 +++++++++++++++++++++++++++-------------- 1 file changed, 111 insertions(+), 58 deletions(-) diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx index c8daf8f..661f95c 100644 --- a/src/app/login/page.tsx +++ b/src/app/login/page.tsx @@ -4,81 +4,134 @@ import { useState, useEffect } from 'react' import { useAuthStore, selectLogin, selectIsLogin } from '@/store/AuthStore' import { useRouter } from 'next/navigation' import { Button } from '@/components/Common/Button' +import BubbleBackground from '@/components/Home/BubbleBackground' + +// --- 아이콘 SVG 컴포넌트 --- +const MailIcon = () => ( + + + +); +const LockIcon = () => ( + + + +); + +const BubblogLogoIcon = () => ( + + + + + + + + + +); export default function LoginPage() { const login = useAuthStore(selectLogin); const isAuthenticated = useAuthStore(selectIsLogin); - const router = useRouter() - const [email, setEmail] = useState('') - const [password, setPassword] = useState('') - const [error, setError] = useState('') + const router = useRouter(); + const [form, setForm] = useState({ email: '', password: '' }); + const [error, setError] = useState(''); useEffect(() => { if (isAuthenticated) { - router.replace('/') + router.replace('/'); } - }, [isAuthenticated, router]) + }, [isAuthenticated, router]); + + const onChange = (e: React.ChangeEvent) => { + setForm({ ...form, [e.target.name]: e.target.value }); + }; const onSubmit = async (e: React.FormEvent) => { - e.preventDefault() - setError('') + e.preventDefault(); + setError(''); try { - await login({ email, password }) - router.push('/') + await login(form); + router.push('/'); } catch (err: any) { - setError(err.message) + setError(err.message || '로그인 중 오류가 발생했습니다.'); } - } + }; return ( -
-

- 로그인 -

+
+ +
+
+
+
+
+ +

Welcome to Bubblog

+
+

로그인

+
- {error && ( -

- {error} -

- )} + + {error && ( +

{error}

+ )} -
- - setEmail(e.target.value)} - required - placeholder="you@example.com" - className="w-full px-4 py-3 rounded-xl border border-gray-300 focus:border-blue-400 focus:ring-2 focus:ring-blue-100 transition" - /> -
+
+
+
+ +
+ +
+
-
- - setPassword(e.target.value)} - required - placeholder="••••••••" - className="w-full px-4 py-3 rounded-xl border border-gray-300 focus:border-blue-400 focus:ring-2 focus:ring-blue-100 transition" - /> -
+
+
+
+ +
+ +
+
+ + + +
- - - ) +
+

+ 계정이 없으신가요?{' '} + + 회원가입 + +

+
+
+
+
+ ); } \ No newline at end of file