htlee
79b21c7d44
- shared/auth 모듈: AuthProvider, ProtectedRoute, useAuth, authApi - 페이지: LoginPage(Google OAuth), PendingPage, DeniedPage - WING_PERMIT 역할 기반 접근 제어 - Topbar에 사용자 이름 + 로그아웃 버튼 추가 - App.tsx에 react-router 라우팅 + AuthProvider 래핑 - DEV 모드 Mock 로그인 지원 (김개발) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
40 lines
993 B
TypeScript
40 lines
993 B
TypeScript
import { Navigate } from 'react-router';
|
|
import { useAuth } from '../../shared/auth';
|
|
|
|
export function PendingPage() {
|
|
const { user, loading, logout } = useAuth();
|
|
|
|
if (loading) {
|
|
return (
|
|
<div className="auth-loading">
|
|
<div className="auth-loading__spinner" />
|
|
</div>
|
|
);
|
|
}
|
|
|
|
if (!user) {
|
|
return <Navigate to="/login" replace />;
|
|
}
|
|
|
|
if (user.status !== 'PENDING') {
|
|
return <Navigate to="/" replace />;
|
|
}
|
|
|
|
return (
|
|
<div className="auth-page">
|
|
<div className="auth-card">
|
|
<div className="auth-status-icon">⏳</div>
|
|
<div className="auth-title">승인 대기 중</div>
|
|
<div className="auth-message">
|
|
<b>{user.email}</b> 계정이 등록되었습니다.
|
|
<br />
|
|
관리자가 승인하면 대시보드에 접근할 수 있습니다.
|
|
</div>
|
|
<button className="auth-link-btn" onClick={logout}>
|
|
로그아웃
|
|
</button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|