let accessToken;
let refreshToken;
if (usertype === 'kiosk') {
  accessToken = res.authToken?.accessToken;
  refreshToken = res.authToken?.refreshToken;
} else if (usertype === 'pos') {
  accessToken = res.accessToken;
  refreshToken = res.refreshToken;
} else {
  accessToken = res.accessToken;
  refreshToken = res.refreshToken;
}
console.log(`accessToken : ${accessToken}`);

if (accessToken) {
  console.log('yes');
  axios.defaults.headers.common['Authorization'] = `Bearer ${accessToken}`;

  // accessToken을 localStorage에 저장
  localStorage.setItem('accessToken', accessToken);

  // refreshToken을 쿠키에 저장
  Cookies.set('refreshToken', refreshToken);

  // 사용자 데이터 준비
  const newUserData = {
    user: id,
    type: usertype,
    typeInfo:
      usertype === 'kiosk'
        ? await getKioskInfo()
        : usertype === 'pos'
        ? await getPosInfo()
        : null,
    token: accessToken,
  };
  console.log('userData before dispatch:', newUserData);
  console.log(`newUserData : ${newUserData.typeInfo}`);

  if (newUserData) {
    console.log(`userData : ${newUserData.user.id}`);
    dispatch(setUser(newUserData));
    console.log('Dispatch successful');
    navigate(`/${usertype}`);
  } else {
    console.error('사용자 데이터가 누락되었습니다.');
  }
} else {
console.error('토큰이 응답에 누락되었습니다.');
}

// config 작성 후, rootReducer 감싸기
import { combineReducers } from 'redux';
import authReducer from './authReducer';
import { persistReducer } from 'redux-persist';
import storage from 'redux-persist/lib/storage';

// config 작성
const persistConfig = {
  key: "root", // localStorage key 
  storage, // localStorage
  whitelist: ["auth"], // target (reducer name)
}

const rootReducer = combineReducers({
  auth: authReducer
});

// persistReducer로 감싸기
export default persistReducer(persistConfig, rootReducer);

import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import { Provider } from "react-redux";
import { PersistGate } from 'redux-persist/integration/react';
import { store, persistor } from './state/Store';

const root = ReactDOM.createRoot(
  document.getElementById('root') as HTMLElement
);
root.render(
  <Provider store={store}>
    <PersistGate persistor={persistor}>
      <App />
    </PersistGate>
  </Provider>
);

useEffect(() => {
  if (isFirstRender.current) {
    const connectEventSource = () => {
      const url = 'https://i11a601.p.ssafy.io/api/customer/face-recognition-events';
      console.log('Connecting to:', url);

      const eventSource = new EventSource(url);

      // 대기 상태 이벤트 수신
      eventSource.addEventListener('waitingStatus', (event) => {
        const data = JSON.parse(event.data);
        console.log('Received waitingStatus event:', data);
        setIsWaiting(data.waiting);
        setShowModal(data.waiting);
      });

      // 얼굴 감지 결과 이벤트 수신
      eventSource.addEventListener('faceDetectionResult', (event) => {
        const data = JSON.parse(event.data);
        console.log('Received faceDetectionResult event:', data);
        if (!data.isFace) {
          setIsWaiting(false);
          setShowModal(false);
          setResult(null);
        }
      });

      // 얼굴 분석 결과 이벤트 수신
      eventSource.addEventListener('analysisResult', (event) => {
        const data = JSON.parse(event.data);
        console.log('Received analysisResult event:', data);
        setResult({
          age: data.age,
          gender: data.gender,
          isFace: data.isFace,
          isCustomer: data.isCustomer,
          customerId: data.customerId,
          customerAge: data.customerAge,
          customerGender: data.customerGender,
          faceEmbeddingData: data.faceEmbeddingData,
        });
        setIsWaiting(false);
        setShowModal(true);
      });

      eventSource.onerror = (error) => {

// 특정 Role로 로그인 되어있으면 다른 Role에 해당되는 페이지로 넘어가지 못하게 한다.
const ProtectedRoute = ({ type }) => {
  const user = useSelector((state) => state.user);
  if (!user || user.type !== type) {
    return <Navigate to="/" />;
  }
  return <Outlet />;
};