diff --git a/packages/frontend/src/components/landingPage/GuestLoginButton.tsx b/packages/frontend/src/components/landingPage/GuestLoginButton.tsx
index f913b12..9ef7c0b 100644
--- a/packages/frontend/src/components/landingPage/GuestLoginButton.tsx
+++ b/packages/frontend/src/components/landingPage/GuestLoginButton.tsx
@@ -1,6 +1,8 @@
+import { useState } from 'react';
import Button from '@/components/common/Button';
+import NicknameModal from './NicknameModal';
import { useNavigate } from 'react-router-dom';
-import { postGuestLogin } from '@/apis/login';
+import { getGuestLogin } from '@/apis/login';
import { useAuthStore } from '@/states/store/authStore';
import { useSocketStore } from '@/states/store/socketStore';
import { useSignalingSocketStore } from '@/states/store/signalingSocketStore';
@@ -10,31 +12,48 @@ export default function GuestLoginButton() {
const { setUserData } = useAuthStore();
const { connectSocket } = useSocketStore();
const { connectSignalingSocket } = useSignalingSocketStore();
+ const [showModal, setShowModal] = useState(false);
- async function handleClick() {
- try {
- localStorage.removeItem('auth-storage');
- localStorage.removeItem('room-storage');
- localStorage.removeItem('lobbyPageVisited');
- localStorage.removeItem('roomCreateTooltipShown');
- localStorage.removeItem('modalTooltipShown');
- localStorage.removeItem('gamePageVisited');
+ const clearLocalStorage = () => {
+ [
+ 'auth-storage',
+ 'room-storage',
+ 'lobbyPageVisited',
+ 'roomCreateTooltipShown',
+ 'modalTooltipShown',
+ 'gamePageVisited',
+ ].forEach((key) => localStorage.removeItem(key));
+ };
- const { userId, password } = await postGuestLogin();
+ const handleLogin = async (nickname: string) => {
+ try {
+ clearLocalStorage();
+ const { userId, password } = await getGuestLogin(nickname);
await connectSocket(userId, password);
await connectSignalingSocket(userId);
setUserData(userId, password);
navigate('/lobby');
} catch (error) {
- console.error('Guest login failed:', error);
+ console.error('게스트 로그인에 실패하였습니다.', error);
}
- }
+ };
return (
-
+ <>
+