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

- 회원가입 성공 시 완료 다이얼로그 표시
- 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, FormControlLabel,
FormGroup, FormGroup,
Link, Link,
Dialog,
DialogContent,
DialogActions,
} from '@mui/material'; } 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 { useState, useEffect, Suspense } from 'react';
import { useUIStore } from '@/stores/uiStore'; import { useUIStore } from '@/stores/uiStore';
import { useAuthStore } from '@/stores/authStore'; import { useAuthStore } from '@/stores/authStore';
@ -90,6 +93,7 @@ function RegisterForm() {
const [errors, setErrors] = useState<Record<string, string>>({}); const [errors, setErrors] = useState<Record<string, string>>({});
const [isVerifyingBusinessNumber, setIsVerifyingBusinessNumber] = useState(false); const [isVerifyingBusinessNumber, setIsVerifyingBusinessNumber] = useState(false);
const [isBusinessNumberVerified, setIsBusinessNumberVerified] = useState(false); const [isBusinessNumberVerified, setIsBusinessNumberVerified] = useState(false);
const [successDialogOpen, setSuccessDialogOpen] = useState(false);
// step 변경 시 URL 업데이트 // step 변경 시 URL 업데이트
useEffect(() => { useEffect(() => {
@ -224,8 +228,7 @@ function RegisterForm() {
}; };
login(mockUser, 'mock-jwt-token'); login(mockUser, 'mock-jwt-token');
showToast('회원가입이 완료되었습니다!', 'success'); setSuccessDialogOpen(true);
router.push('/');
} catch { } catch {
showToast('회원가입에 실패했습니다. 다시 시도해주세요.', 'error'); showToast('회원가입에 실패했습니다. 다시 시도해주세요.', 'error');
} finally { } finally {
@ -233,6 +236,11 @@ function RegisterForm() {
} }
}; };
const handleSuccessDialogClose = () => {
setSuccessDialogOpen(false);
router.push('/');
};
return ( return (
<Box <Box
sx={{ sx={{
@ -636,6 +644,33 @@ function RegisterForm() {
</Box> </Box>
)} )}
</Paper> </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> </Box>
); );
} }