import { useEffect } from 'react';
import { BrowserRouter } from 'react-router-dom';
import { BrowserView, MobileView } from 'react-device-detect';

// 공통 컴포넌트
import { ScrollToTop } from '@/components/common';

// 라우트
import { PCPublicRoutes, PCAdminRoutes, MobileRoutes } from '@/routes';

/**
 * PC 환경에서 body에 클래스 추가하는 래퍼
 */
function PCWrapper({ children }) {
  useEffect(() => {
    document.body.classList.add('is-pc');
    return () => document.body.classList.remove('is-pc');
  }, []);
  return children;
}

/**
 * 프로미스나인 팬사이트 메인 앱
 * react-device-detect를 사용한 PC/Mobile 분리
 */
function App() {
  return (
    <BrowserRouter future={{ v7_startTransition: true, v7_relativeSplatPath: true }}>
      <ScrollToTop />

      {/* PC 뷰 */}
      <BrowserView>
        <PCWrapper>
          <PCAdminRoutes />
          <PCPublicRoutes />
        </PCWrapper>
      </BrowserView>

      {/* Mobile 뷰 */}
      <MobileView>
        <MobileRoutes />
      </MobileView>
    </BrowserRouter>
  );
}

export default App;
