import React from 'react'
import ReactDOM from 'react-dom/client'
import { BrowserRouter } from 'react-router-dom'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
import App from './App'
import './index.css'

const queryClient = new QueryClient({
    defaultOptions: {
        queries: {
            refetchOnWindowFocus: false,
            // 배포(1~2분 다운) 후에도 화면이 스스로 살아나도록:
            // - 재시도 3회(지수 백오프, 최대 10초)
            // - 네트워크 복구 시 자동 재조회
            // - 오프라인 판단으로 쿼리가 멈추지 않도록 항상 실행
            retry: 3,
            retryDelay: (attempt) => Math.min(1000 * 2 ** attempt, 10000),
            refetchOnReconnect: true,
            networkMode: 'always',
        },
        mutations: { networkMode: 'always' },
    },
})

ReactDOM.createRoot(document.getElementById('root')!).render(
    <React.StrictMode>
        <QueryClientProvider client={queryClient}>
            <BrowserRouter
                future={{
                    v7_startTransition: true,
                    v7_relativeSplatPath: true,
                }}
            >
                <App />
            </BrowserRouter>
        </QueryClientProvider>
    </React.StrictMode>,
)