fix(homepage): white screen fix + login message + vibe coding manual
- useMemberAuth: return null to loading spinner - MemberOnly: add login/register message - manual/40: vibe coding guide (closed/open network) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
c67a9d2037
commit
a2e4f49b81
@ -58,21 +58,41 @@ export function MemberOnly({ children, feature = '이 기능' }) {
|
||||
const { isLoggedIn, loaded } = useMemberAuth();
|
||||
const navigate = useNavigate();
|
||||
|
||||
if (!loaded) return null;
|
||||
if (!loaded) {
|
||||
return (
|
||||
<div style={{ minHeight: 200, display: 'flex', alignItems: 'center', justifyContent: 'center', color: '#94a3b8' }}>
|
||||
<span>로딩 중...</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (!isLoggedIn) {
|
||||
return (
|
||||
<div className="member-guard" style={{ position:'relative', minHeight:120 }}>
|
||||
{children}
|
||||
<div className="member-guard-overlay">
|
||||
<div className="member-guard-icon">🔒</div>
|
||||
<div className="member-guard-text">{feature}은 회원 전용입니다</div>
|
||||
<div className="member-guard-sub">로그인 후 이용하실 수 있습니다</div>
|
||||
<div style={{
|
||||
minHeight: 260, display: 'flex', flexDirection: 'column',
|
||||
alignItems: 'center', justifyContent: 'center', padding: '40px 24px',
|
||||
background: '#f8fafc', borderRadius: 12, border: '1px solid #e2e8f0',
|
||||
margin: '20px 0', textAlign: 'center', gap: 12,
|
||||
}}>
|
||||
<div style={{ fontSize: 40 }}>🔒</div>
|
||||
<div style={{ fontSize: 16, fontWeight: 700, color: '#1e293b' }}>
|
||||
로그인 또는 회원가입을 하셔야 사용할 수 있는 기능입니다.
|
||||
</div>
|
||||
<div style={{ fontSize: 14, color: '#64748b' }}>
|
||||
{feature} 서비스는 회원 전용입니다.
|
||||
</div>
|
||||
<div style={{ display: 'flex', gap: 10, marginTop: 8 }}>
|
||||
<button
|
||||
onClick={() => navigate('/login')}
|
||||
style={{ marginTop:8, padding:'8px 24px', background:'#1a5fd8', color:'#fff',
|
||||
border:'none', borderRadius:8, cursor:'pointer', fontWeight:600, fontSize:14 }}>
|
||||
로그인 / 회원가입
|
||||
style={{ padding: '10px 28px', background: '#1a5fd8', color: '#fff',
|
||||
border: 'none', borderRadius: 8, cursor: 'pointer', fontWeight: 700, fontSize: 14 }}>
|
||||
로그인
|
||||
</button>
|
||||
<button
|
||||
onClick={() => navigate('/login?tab=register')}
|
||||
style={{ padding: '10px 28px', background: '#fff', color: '#1a5fd8',
|
||||
border: '2px solid #1a5fd8', borderRadius: 8, cursor: 'pointer', fontWeight: 700, fontSize: 14 }}>
|
||||
회원가입
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user