Fix: 배포 관련 수정 사항

src/api/axiosInstance.ts

@@ -1,5 +1,5 @@
 import axios from "axios";
-import { setToken } from "../utils/jwt";
+import { setToken, removeToken } from "../utils/jwt";
 
 const API_URL = "https://keunsori-api.everdu.com/";
 
@@ -44,19 +44,16 @@ axiosInstance.interceptors.response.use(
           { headers: { "Refresh-Token": refreshToken } }
         );
 
-        console.log("성공했다잉:", data);
-
         setToken(data);
 
-        console.log("이제 다시 요청할게");
-        console.log("악쎄스 토큰 여기: ", localStorage.getItem("accessToken"));
         const newAccessToken = localStorage.getItem("accessToken");
+
         originalRequest.headers.Authorization = `Bearer ${newAccessToken}`;
+
         return axiosInstance(originalRequest);
       } catch (refreshError) {
         console.error("토큰 갱신 실패", refreshError);
-        localStorage.removeItem("accessToken");
-        localStorage.removeItem("refreshToken");
+        removeToken();
         window.location.href = "/login";
         return Promise.reject(refreshError);
       }

src/api/register.ts

@@ -8,12 +8,7 @@ export const registerUser = async (data: {
   passwordConfirm: string;
 }) => {
   try {
-    console.log("request content: ", data);
     const response = await axiosInstance.post("/signup", data);
-
-    //test code
-    console.log("이게 status 임: ", response.status);
-
     return response.data;
   } catch (error) {
     console.error("error: ", error);

src/components/Book/Application/DropBox.tsx

@@ -120,7 +120,7 @@ const TeamDropBox: React.FC<DropBoxProps> = ({ onClick }) => {
     </Container>
   );
 };
-const ArrowButton = styled.button`
+const ArrowButton = styled.div`
   font-size: 10px;
   color: #000;
   background-color: transparent;

src/components/Book/Application/Reservation.tsx

@@ -196,7 +196,7 @@ const Reservation: React.FC<ReservationProps> = ({
         <TimeContainer>
           <TimeSlots>
             {selectedSlots.map((slot, index) => (
-              <>
+              <div key={index}>
                 <div
                   className={css`
                     display: flex;
@@ -227,7 +227,7 @@ const Reservation: React.FC<ReservationProps> = ({
                     }
                   ></SlotButton>
                 </div>
-              </>
+              </div>
             ))}
           </TimeSlots>
         </TimeContainer>

src/components/Book/CurrentBook.tsx

@@ -65,7 +65,6 @@ const CurrentBook: React.FC = () => {
 
   async function fetchData() {
     const token = localStorage.getItem("accessToken");
-    console.log(`Token: ${token}`);
     try {
       const response = await axiosInstance.get(
         `/reservation/list?month=${formatDate(date)}`,

src/components/ProtectedRoute.tsx

@@ -1,15 +1,17 @@
 import { Navigate, Outlet } from "react-router-dom";
 import { useContext } from "react";
-import {AuthContext} from "../contexts/AuthContext";
+import { AuthContext } from "../contexts/AuthContext";
 
 const ProtectedRoute = () => {
-    const { user } = useContext(AuthContext);
+  const { user, isLoading } = useContext(AuthContext);
 
-    if (!user?.isLoggedIn) {
-        return <Navigate to="/login" replace />;
-    }
+  // ✅ 로딩 중이면 아무것도 렌더링하지 않음 (or 로딩 UI 표시 가능)
+  if (isLoading) {
+    return null; // 👈 로딩 중에는 리디렉트 X
+  }
 
-    return <Outlet />;
-}
+  // ✅ 로그인 상태 확인 후 접근 허용 또는 리디렉트
+  return user.isLoggedIn ? <Outlet /> : <Navigate to="/login" replace />;
+};
 
-export default ProtectedRoute;
+export default ProtectedRoute;

src/contexts/AuthContext.tsx

@@ -5,6 +5,7 @@ import axios from "axios";
 
 interface AuthContextProps {
   user: User;
+  isLoading: boolean;
   loginUser: (
     studentId: string,
     password: string
@@ -22,22 +23,21 @@ interface User {
 
 export const AuthContext = createContext<AuthContextProps>({
   user: { isLoggedIn: false },
+  isLoading: true,
   loginUser: async () => ({ success: false, message: "초기값" }),
   logoutUser: () => {},
 });
 
 export const AuthProvider: React.FC<AuthProviderProps> = ({ children }) => {
   const [user, setUser] = useState<User>({ isLoggedIn: false });
+  const [isLoading, setIsLoading] = useState(true);
 
   useEffect(() => {
     const token = getToken();
 
     if (token) {
-      setUser({ isLoggedIn: false });
-
-      // getUserData(token)
-      //   .then(setUser)
-      //   .catch(() => removeToken());
+      setUser({ isLoggedIn: true });
+      setIsLoading(false);
     }
   }, []);
 
@@ -51,7 +51,6 @@ export const AuthProvider: React.FC<AuthProviderProps> = ({ children }) => {
       setUser({ isLoggedIn: true });
       return { success: true };
     } catch (error) {
-      console.log(" 일단 에러 받았어~ ");
       if (axios.isAxiosError(error)) {
         console.error("login failed:", error.response?.data || error.message);
 
@@ -72,7 +71,7 @@ export const AuthProvider: React.FC<AuthProviderProps> = ({ children }) => {
   };
 
   return (
-    <AuthContext.Provider value={{ user, loginUser, logoutUser }}>
+    <AuthContext.Provider value={{ user, isLoading, loginUser, logoutUser }}>
       {children}
     </AuthContext.Provider>
   );