// DynamicRouter.tsx
import React from 'react'
import { Routes, Route, Navigate } from 'react-router-dom'
import { mapDynamicRoutes, loadComponent } from './dynamicRouteLoader'
import { useDynamicRoutes } from './dynamicRoutesContext'
import ProtectedRoute from '@/components/route/ProtectedRoute'
import PermissionGuard from '@/components/route/PermissionGuard'
import PageContainer from '@/components/template/PageContainer'
import { ROUTES_ENUM } from './route.constant'
import { hasSubdomain } from '@/utils/subdomain'

// AccessDenied ve NotFound'u dinamiklikten çıkarıyoruz
const AccessDenied = React.lazy(() => import('@/views/AccessDenied'))
const NotFound = React.lazy(() => import('@/views/NotFound'))

export const DynamicRouter: React.FC = () => {
  const { routes, loading, error } = useDynamicRoutes()
  const dynamicRoutes = React.useMemo(() => mapDynamicRoutes(routes), [routes])

  if (loading) return <div>Loading...</div>
  if (error) return <div>Hata: {error}</div>

  return (
    <Routes>
      {/* ADMIN */}
      <Route path="/admin/*" element={<ProtectedRoute />}>
        {dynamicRoutes
          .filter((r) => r.routeType === 'protected')
          .map((route) => {
            const Component = route.getComponent()
            return (
              <Route
                key={route.key}
                path={route.path.replace(/^\/admin\/?/, '') || '.'}
                element={
                  <PermissionGuard permissions={route.authority}>
                    <PageContainer>
                      <React.Suspense fallback={<div>Loading {route.path}...</div>}>
                        <Component />
                      </React.Suspense>
                    </PageContainer>
                  </PermissionGuard>
                }
              />
            )
          })}

        {/* admin default */}
        <Route index element={<Navigate to={ROUTES_ENUM.protected.dashboard} replace />} />

        {/* admin access denied (statik) */}
        <Route
          path="access-denied"
          element={
            <PageContainer>
              <React.Suspense fallback={<div>Loading...</div>}>
                <AccessDenied />
              </React.Suspense>
            </PageContainer>
          }
        />

        {/* admin not found (statik) */}
        <Route
          path="*"
          element={
            <PageContainer>
              <React.Suspense fallback={<div>Loading...</div>}>
                <NotFound />
              </React.Suspense>
            </PageContainer>
          }
        />
      </Route>

      {/* Auth/Public dinamik rotalar */}
      {dynamicRoutes
        .filter((r) =>
          hasSubdomain() ? r.routeType === 'authenticated' : r.routeType !== 'protected',
        )
        .map((route) => {
          const Component = route.getComponent()
          return (
            <Route
              key={route.key}
              path={route.path}
              element={
                <React.Suspense fallback={<div>Loading {route.path}...</div>}>
                  <Component />
                </React.Suspense>
              }
            />
          )
        })}

      {/* root redirect */}
      <Route
        path="/"
        element={
          <Navigate
            to={hasSubdomain() ? ROUTES_ENUM.authenticated.login : ROUTES_ENUM.public.home}
            replace
          />
        }
      />

      {/* public access denied (statik) */}
      <Route
        path="/access-denied"
        element={
          <React.Suspense fallback={<div>Loading...</div>}>
            <AccessDenied />
          </React.Suspense>
        }
      />

      {/* public not found (statik) */}
      <Route
        path="*"
        element={
          <React.Suspense fallback={<div>Loading...</div>}>
            <NotFound />
          </React.Suspense>
        }
      />
    </Routes>
  )
}