회원가입 완료 다이얼로그 추가

- 회원가입 성공 시 완료 다이얼로그 표시
- CheckCircle 아이콘과 환영 메시지 추가
- 사용자 이름을 포함한 개인화된 메시지 표시
- '시작하기' 버튼으로 대시보드 이동
- Dialog, DialogContent, DialogActions 컴포넌트 임포트 추가

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
cherry2250 2025-10-24 16:16:23 +09:00
parent 6a9dcda398
commit 7ebaa38807

View File

@ -19,8 +19,11 @@ import {
FormControlLabel,
FormGroup,
Link,
Dialog,
DialogContent,
DialogActions,
} from '@mui/material';
import { ArrowBack, Visibility, VisibilityOff } from '@mui/icons-material';
import { ArrowBack, Visibility, VisibilityOff, CheckCircle } from '@mui/icons-material';
import { useState, useEffect, Suspense } from 'react';
import { useUIStore } from '@/stores/uiStore';
import { useAuthStore } from '@/stores/authStore';
@ -90,6 +93,7 @@ function RegisterForm() {
const [errors, setErrors] = useState<Record<string, string>>({});
const [isVerifyingBusinessNumber, setIsVerifyingBusinessNumber] = useState(false);
const [isBusinessNumberVerified, setIsBusinessNumberVerified] = useState(false);
const [successDialogOpen, setSuccessDialogOpen] = useState(false);
// step 변경 시 URL 업데이트
useEffect(() => {
@ -224,8 +228,7 @@ function RegisterForm() {
};
login(mockUser, 'mock-jwt-token');
showToast('회원가입이 완료되었습니다!', 'success');
router.push('/');
setSuccessDialogOpen(true);
} catch {
showToast('회원가입에 실패했습니다. 다시 시도해주세요.', 'error');
} finally {
@ -233,6 +236,11 @@ function RegisterForm() {
}
};
const handleSuccessDialogClose = () => {
setSuccessDialogOpen(false);
router.push('/');
};
return (
<Box
sx={{
@ -636,6 +644,33 @@ function RegisterForm() {
</Box>
)}
</Paper>
{/* 회원가입 완료 다이얼로그 */}
<Dialog open={successDialogOpen} onClose={handleSuccessDialogClose} maxWidth="xs" fullWidth>
<DialogContent sx={{ textAlign: 'center', py: 6, px: 4 }}>
<CheckCircle sx={{ fontSize: 80, color: 'success.main', mb: 2 }} />
<Typography variant="h5" sx={{ fontWeight: 700, mb: 1 }}>
!
</Typography>
<Typography variant="body1" color="text.secondary" sx={{ mb: 2 }}>
<strong>{formData.name}</strong>, !
</Typography>
<Typography variant="body2" color="text.secondary">
KT AI <br />
</Typography>
</DialogContent>
<DialogActions sx={{ justifyContent: 'center', pb: 3 }}>
<Button
variant="contained"
size="large"
onClick={handleSuccessDialogClose}
sx={{ minWidth: 200, py: 1.5, fontSize: 16, fontWeight: 600 }}
>
</Button>
</DialogActions>
</Dialog>
</Box>
);
}