52 lines
1.9 KiB
TypeScript
52 lines
1.9 KiB
TypeScript
|
import { GoogleLogin, GoogleOAuthProvider } from '@react-oauth/google';
|
||
|
|
import { Navigate } from 'react-router';
|
||
|
|
import { useAuth } from '../auth/useAuth';
|
||
|
|
|
||
|
|
const GOOGLE_CLIENT_ID =
|
||
|
|
'295080817934-1uqaqrkup9jnslajkl1ngpee7gm249fv.apps.googleusercontent.com';
|
||
|
|
|
||
|
|
export function LoginPage() {
|
||
|
|
const { user, login, loading } = useAuth();
|
||
|
|
|
||
|
|
if (loading) return null;
|
||
|
|
if (user && user.status === 'ACTIVE') return <Navigate to="/" replace />;
|
||
|
|
if (user && user.status === 'PENDING')
|
||
|
|
return <Navigate to="/pending" replace />;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<GoogleOAuthProvider clientId={GOOGLE_CLIENT_ID}>
|
||
|
|
<div className="min-h-screen bg-gradient-to-br from-slate-900 via-blue-950 to-slate-900 flex items-center justify-center px-4">
|
||
|
|
<div className="bg-white rounded-2xl shadow-2xl p-10 max-w-sm w-full text-center">
|
||
|
|
<div className="mb-6">
|
||
|
|
<div className="w-16 h-16 bg-blue-600 rounded-xl mx-auto mb-4 flex items-center justify-center">
|
||
|
|
<span className="text-white text-2xl font-bold">GC</span>
|
||
|
|
</div>
|
||
|
|
<h1 className="text-2xl font-bold text-gray-900">
|
||
|
|
GC SI 개발자 가이드
|
||
|
|
</h1>
|
||
|
|
<p className="text-gray-500 mt-2 text-sm">
|
||
|
|
@gcsc.co.kr 계정으로 로그인하세요
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<div className="flex justify-center">
|
||
|
|
<GoogleLogin
|
||
|
|
onSuccess={(res) => {
|
||
|
|
if (res.credential) login(res.credential);
|
||
|
|
}}
|
||
|
|
onError={() => {
|
||
|
|
console.error('Google Login failed');
|
||
|
|
}}
|
||
|
|
theme="outline"
|
||
|
|
size="large"
|
||
|
|
width="280"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
<p className="text-xs text-gray-400 mt-6">
|
||
|
|
GC SI 사내 개발환경 전용
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</GoogleOAuthProvider>
|
||
|
|
);
|
||
|
|
}
|