import { lazy, Suspense } from 'react';
import { Navigate, useRoutes, Outlet } from 'react-router-dom';

import { AuthGuard } from 'src/auth/guard/auth-guard';
import { GuestGuard } from 'src/auth/guard/guest-guard';

import { AuthSplitLayout } from 'src/layouts/auth-split';
import { DashboardLayout } from 'src/layouts/dashboard';

import { SplashScreen } from 'src/components/loading-screen';

// ----------------------------------------------------------------------
// Auth - JWT

const JwtSignInView = lazy(() =>
  import('src/sections/auth/jwt/jwt-sign-in-view').then((m) => ({ default: m.JwtSignInView }))
);
const JwtSignUpView = lazy(() =>
  import('src/sections/auth/jwt/jwt-sign-up-view').then((m) => ({ default: m.JwtSignUpView }))
);
const JwtForgotPasswordView = lazy(() =>
  import('src/sections/auth/jwt/jwt-forgot-password-view').then((m) => ({
    default: m.JwtForgotPasswordView,
  }))
);
const JwtResetPasswordView = lazy(() =>
  import('src/sections/auth/jwt/jwt-reset-password-view').then((m) => ({
    default: m.JwtResetPasswordView,
  }))
);
const JwtVerifyEmailView = lazy(() =>
  import('src/sections/auth/jwt/jwt-verify-email-view').then((m) => ({
    default: m.JwtVerifyEmailView,
  }))
);

// ----------------------------------------------------------------------
// Dashboard - Overview

const OverviewAnalyticsView = lazy(() =>
  import('src/sections/overview/analytics/view').then((m) => ({
    default: m.OverviewAnalyticsView,
  }))
);
const OverviewEcommerceView = lazy(() =>
  import('src/sections/overview/e-commerce/view').then((m) => ({
    default: m.OverviewEcommerceView,
  }))
);
const OverviewBankingView = lazy(() =>
  import('src/sections/overview/banking/view').then((m) => ({ default: m.OverviewBankingView }))
);
const OverviewBookingView = lazy(() =>
  import('src/sections/overview/booking/view').then((m) => ({ default: m.OverviewBookingView }))
);
const OverviewFileView = lazy(() =>
  import('src/sections/overview/file/view').then((m) => ({ default: m.OverviewFileView }))
);
const OverviewCourseView = lazy(() =>
  import('src/sections/overview/course/view').then((m) => ({ default: m.OverviewCourseView }))
);

// Dashboard - Features

const CalendarView = lazy(() =>
  import('src/sections/calendar/view').then((m) => ({ default: m.CalendarView }))
);
const ChatView = lazy(() =>
  import('src/sections/chat/view').then((m) => ({ default: m.ChatView }))
);
const MailView = lazy(() =>
  import('src/sections/mail/view').then((m) => ({ default: m.MailView }))
);
const KanbanView = lazy(() =>
  import('src/sections/kanban/view').then((m) => ({ default: m.KanbanView }))
);
const FileManagerView = lazy(() =>
  import('src/sections/file-manager/view').then((m) => ({ default: m.FileManagerView }))
);
const PermissionDeniedView = lazy(() =>
  import('src/sections/permission/view').then((m) => ({ default: m.PermissionDeniedView }))
);
const BlankView = lazy(() =>
  import('src/sections/blank/view').then((m) => ({ default: m.BlankView }))
);

// Dashboard - User

const UserProfileView = lazy(() =>
  import('src/sections/user/view').then((m) => ({ default: m.UserProfileView }))
);
const UserListView = lazy(() =>
  import('src/sections/user/view').then((m) => ({ default: m.UserListView }))
);
const UserCardsView = lazy(() =>
  import('src/sections/user/view').then((m) => ({ default: m.UserCardsView }))
);
const UserCreateView = lazy(() =>
  import('src/sections/user/view').then((m) => ({ default: m.UserCreateView }))
);
const UserEditView = lazy(() =>
  import('src/sections/user/view').then((m) => ({ default: m.UserEditView }))
);
const AccountView = lazy(() =>
  import('src/sections/account/view').then((m) => ({ default: m.AccountView }))
);

// Dashboard - Product

const ProductListView = lazy(() =>
  import('src/sections/product/view').then((m) => ({ default: m.ProductListView }))
);
const ProductDetailsView = lazy(() =>
  import('src/sections/product/view').then((m) => ({ default: m.ProductDetailsView }))
);
const ProductCreateView = lazy(() =>
  import('src/sections/product/view').then((m) => ({ default: m.ProductCreateView }))
);
const ProductEditView = lazy(() =>
  import('src/sections/product/view').then((m) => ({ default: m.ProductEditView }))
);

// Dashboard - Order

const OrderListView = lazy(() =>
  import('src/sections/order/view').then((m) => ({ default: m.OrderListView }))
);
const OrderDetailsView = lazy(() =>
  import('src/sections/order/view').then((m) => ({ default: m.OrderDetailsView }))
);

// Dashboard - Invoice

const InvoiceListView = lazy(() =>
  import('src/sections/invoice/view').then((m) => ({ default: m.InvoiceListView }))
);
const InvoiceDetailsView = lazy(() =>
  import('src/sections/invoice/view').then((m) => ({ default: m.InvoiceDetailsView }))
);
const InvoiceCreateView = lazy(() =>
  import('src/sections/invoice/view').then((m) => ({ default: m.InvoiceCreateView }))
);
const InvoiceEditView = lazy(() =>
  import('src/sections/invoice/view').then((m) => ({ default: m.InvoiceEditView }))
);

// Dashboard - Blog / Post

const PostListView = lazy(() =>
  import('src/sections/blog/view').then((m) => ({ default: m.PostListView }))
);
const PostCreateView = lazy(() =>
  import('src/sections/blog/view').then((m) => ({ default: m.PostCreateView }))
);
const PostDetailsView = lazy(() =>
  import('src/sections/blog/view').then((m) => ({ default: m.PostDetailsView }))
);
const PostEditView = lazy(() =>
  import('src/sections/blog/view').then((m) => ({ default: m.PostEditView }))
);

// Dashboard - Job

const JobListView = lazy(() =>
  import('src/sections/job/view').then((m) => ({ default: m.JobListView }))
);
const JobDetailsView = lazy(() =>
  import('src/sections/job/view').then((m) => ({ default: m.JobDetailsView }))
);
const JobCreateView = lazy(() =>
  import('src/sections/job/view').then((m) => ({ default: m.JobCreateView }))
);
const JobEditView = lazy(() =>
  import('src/sections/job/view').then((m) => ({ default: m.JobEditView }))
);

// Dashboard - Tour

const TourListView = lazy(() =>
  import('src/sections/tour/view').then((m) => ({ default: m.TourListView }))
);
const TourDetailsView = lazy(() =>
  import('src/sections/tour/view').then((m) => ({ default: m.TourDetailsView }))
);
const TourCreateView = lazy(() =>
  import('src/sections/tour/view').then((m) => ({ default: m.TourCreateView }))
);
const TourEditView = lazy(() =>
  import('src/sections/tour/view').then((m) => ({ default: m.TourEditView }))
);

// Error pages

const Page403 = lazy(() =>
  import('src/sections/error/403-view').then((m) => ({ default: m.View403 }))
);
const Page404 = lazy(() =>
  import('src/sections/error/not-found-view').then((m) => ({ default: m.NotFoundView }))
);
const Page500 = lazy(() =>
  import('src/sections/error/500-view').then((m) => ({ default: m.View500 }))
);

// ----------------------------------------------------------------------

function Loading() {
  return <SplashScreen />;
}

function DashboardLayoutWrapper() {
  return (
    <AuthGuard>
      <DashboardLayout>
        <Outlet />
      </DashboardLayout>
    </AuthGuard>
  );
}

function AuthLayoutWrapper() {
  return (
    <GuestGuard>
      <AuthSplitLayout>
        <Outlet />
      </AuthSplitLayout>
    </GuestGuard>
  );
}

// ----------------------------------------------------------------------

export function Router() {
  return useRoutes([
    // Root redirect
    {
      path: '/',
      element: <Navigate to="/dashboard/analytics" replace />,
    },

    // Auth - JWT
    {
      path: 'auth/jwt',
      element: <AuthLayoutWrapper />,
      children: [
        {
          path: 'sign-in',
          element: (
            <Suspense fallback={<Loading />}>
              <JwtSignInView />
            </Suspense>
          ),
        },
        {
          path: 'sign-up',
          element: (
            <Suspense fallback={<Loading />}>
              <JwtSignUpView />
            </Suspense>
          ),
        },
        {
          path: 'forgot-password',
          element: (
            <Suspense fallback={<Loading />}>
              <JwtForgotPasswordView />
            </Suspense>
          ),
        },
        {
          path: 'reset-password',
          element: (
            <Suspense fallback={<Loading />}>
              <JwtResetPasswordView />
            </Suspense>
          ),
        },
      ],
    },

    // Verify email — без GuestGuard
    {
      path: 'auth/jwt/verify-email',
      element: (
        <AuthSplitLayout>
          <Suspense fallback={<Loading />}>
            <JwtVerifyEmailView />
          </Suspense>
        </AuthSplitLayout>
      ),
    },

    // Dashboard
    {
      path: 'dashboard',
      element: <DashboardLayoutWrapper />,
      children: [
        { index: true, element: <Navigate to="analytics" replace /> },

        // Overview
        {
          path: 'analytics',
          element: (
            <Suspense fallback={<Loading />}>
              <OverviewAnalyticsView />
            </Suspense>
          ),
        },
        {
          path: 'ecommerce',
          element: (
            <Suspense fallback={<Loading />}>
              <OverviewEcommerceView />
            </Suspense>
          ),
        },
        {
          path: 'banking',
          element: (
            <Suspense fallback={<Loading />}>
              <OverviewBankingView />
            </Suspense>
          ),
        },
        {
          path: 'booking',
          element: (
            <Suspense fallback={<Loading />}>
              <OverviewBookingView />
            </Suspense>
          ),
        },
        {
          path: 'file',
          element: (
            <Suspense fallback={<Loading />}>
              <OverviewFileView />
            </Suspense>
          ),
        },
        {
          path: 'course',
          element: (
            <Suspense fallback={<Loading />}>
              <OverviewCourseView />
            </Suspense>
          ),
        },

        // Features
        {
          path: 'schedule',
          element: (
            <Suspense fallback={<Loading />}>
              <CalendarView />
            </Suspense>
          ),
        },
        {
          path: 'chat',
          element: (
            <Suspense fallback={<Loading />}>
              <ChatView />
            </Suspense>
          ),
        },
        {
          path: 'mail',
          element: (
            <Suspense fallback={<Loading />}>
              <MailView />
            </Suspense>
          ),
        },
        {
          path: 'kanban',
          element: (
            <Suspense fallback={<Loading />}>
              <KanbanView />
            </Suspense>
          ),
        },
        {
          path: 'file-manager',
          element: (
            <Suspense fallback={<Loading />}>
              <FileManagerView />
            </Suspense>
          ),
        },
        {
          path: 'permission',
          element: (
            <Suspense fallback={<Loading />}>
              <PermissionDeniedView />
            </Suspense>
          ),
        },
        {
          path: 'blank',
          element: (
            <Suspense fallback={<Loading />}>
              <BlankView />
            </Suspense>
          ),
        },

        // User
        {
          path: 'user',
          children: [
            { index: true, element: <Navigate to="profile" replace /> },
            {
              path: 'profile',
              element: (
                <Suspense fallback={<Loading />}>
                  <UserProfileView />
                </Suspense>
              ),
            },
            {
              path: 'list',
              element: (
                <Suspense fallback={<Loading />}>
                  <UserListView />
                </Suspense>
              ),
            },
            {
              path: 'cards',
              element: (
                <Suspense fallback={<Loading />}>
                  <UserCardsView />
                </Suspense>
              ),
            },
            {
              path: 'new',
              element: (
                <Suspense fallback={<Loading />}>
                  <UserCreateView />
                </Suspense>
              ),
            },
            {
              path: ':id/edit',
              element: (
                <Suspense fallback={<Loading />}>
                  <UserEditView />
                </Suspense>
              ),
            },
            {
              path: 'account',
              element: (
                <Suspense fallback={<Loading />}>
                  <AccountView />
                </Suspense>
              ),
            },
          ],
        },

        // Product
        {
          path: 'product',
          children: [
            {
              index: true,
              element: (
                <Suspense fallback={<Loading />}>
                  <ProductListView />
                </Suspense>
              ),
            },
            {
              path: 'new',
              element: (
                <Suspense fallback={<Loading />}>
                  <ProductCreateView />
                </Suspense>
              ),
            },
            {
              path: ':id',
              element: (
                <Suspense fallback={<Loading />}>
                  <ProductDetailsView />
                </Suspense>
              ),
            },
            {
              path: ':id/edit',
              element: (
                <Suspense fallback={<Loading />}>
                  <ProductEditView />
                </Suspense>
              ),
            },
          ],
        },

        // Order
        {
          path: 'order',
          children: [
            {
              index: true,
              element: (
                <Suspense fallback={<Loading />}>
                  <OrderListView />
                </Suspense>
              ),
            },
            {
              path: ':id',
              element: (
                <Suspense fallback={<Loading />}>
                  <OrderDetailsView />
                </Suspense>
              ),
            },
          ],
        },

        // Invoice
        {
          path: 'invoice',
          children: [
            {
              index: true,
              element: (
                <Suspense fallback={<Loading />}>
                  <InvoiceListView />
                </Suspense>
              ),
            },
            {
              path: 'new',
              element: (
                <Suspense fallback={<Loading />}>
                  <InvoiceCreateView />
                </Suspense>
              ),
            },
            {
              path: ':id',
              element: (
                <Suspense fallback={<Loading />}>
                  <InvoiceDetailsView />
                </Suspense>
              ),
            },
            {
              path: ':id/edit',
              element: (
                <Suspense fallback={<Loading />}>
                  <InvoiceEditView />
                </Suspense>
              ),
            },
          ],
        },

        // Blog / Post
        {
          path: 'post',
          children: [
            {
              index: true,
              element: (
                <Suspense fallback={<Loading />}>
                  <PostListView />
                </Suspense>
              ),
            },
            {
              path: 'new',
              element: (
                <Suspense fallback={<Loading />}>
                  <PostCreateView />
                </Suspense>
              ),
            },
            {
              path: ':title',
              element: (
                <Suspense fallback={<Loading />}>
                  <PostDetailsView />
                </Suspense>
              ),
            },
            {
              path: ':title/edit',
              element: (
                <Suspense fallback={<Loading />}>
                  <PostEditView />
                </Suspense>
              ),
            },
          ],
        },

        // Job
        {
          path: 'job',
          children: [
            {
              index: true,
              element: (
                <Suspense fallback={<Loading />}>
                  <JobListView />
                </Suspense>
              ),
            },
            {
              path: 'new',
              element: (
                <Suspense fallback={<Loading />}>
                  <JobCreateView />
                </Suspense>
              ),
            },
            {
              path: ':id',
              element: (
                <Suspense fallback={<Loading />}>
                  <JobDetailsView />
                </Suspense>
              ),
            },
            {
              path: ':id/edit',
              element: (
                <Suspense fallback={<Loading />}>
                  <JobEditView />
                </Suspense>
              ),
            },
          ],
        },

        // Tour
        {
          path: 'tour',
          children: [
            {
              index: true,
              element: (
                <Suspense fallback={<Loading />}>
                  <TourListView />
                </Suspense>
              ),
            },
            {
              path: 'new',
              element: (
                <Suspense fallback={<Loading />}>
                  <TourCreateView />
                </Suspense>
              ),
            },
            {
              path: ':id',
              element: (
                <Suspense fallback={<Loading />}>
                  <TourDetailsView />
                </Suspense>
              ),
            },
            {
              path: ':id/edit',
              element: (
                <Suspense fallback={<Loading />}>
                  <TourEditView />
                </Suspense>
              ),
            },
          ],
        },
      ],
    },

    // Error pages
    { path: '403', element: <Suspense fallback={<Loading />}><Page403 /></Suspense> },
    { path: '404', element: <Suspense fallback={<Loading />}><Page404 /></Suspense> },
    { path: '500', element: <Suspense fallback={<Loading />}><Page500 /></Suspense> },

    // Catch-all
    { path: '*', element: <Navigate to="/404" replace /> },
  ]);
}
