import type { ReactNode } from 'react';
import { Suspense } from 'react';
import type { RouteObject } from 'react-router-dom';
import { APP_ROUTE_PATHS } from '@/shared/constants/routes';
import { MODULES } from '@/shared/constants/appData';
import type { ModuleId } from '@/shared/types/app';
import {
  CampusAttendancePage,
  CampusAttendanceDetailsPage,
  ClassroomSupportPage,
  ClassroomTimerPage,
  CommunityPartnershipsPage,
  DashboardPage,
  DirectorDashboardPage,
  EmotionalIntelligencePage,
  EsaFundingPage,
  FramePage,
  HandbookPoliciesPage,
  InternalAlertsPage,
  MessagesPage,
  MyClassPage,
  OrganizationManagementPage,
  PlatformDashboardPage,
  ProfilePage,
  QbsSafetyPage,
  SafetyProtocolsPage,
  SignLanguagePage,
  UserAdminPage,
  VocationalOpportunitiesPage,
  WalkthroughPage,
  ZonesOfRegulationPage,
} from '@/app/lazyModulePages';
import { ModuleRouteGuard } from '@/app/ModuleRouteGuard';
import { AuthGuard } from '@/app/AuthGuard';
import { IndexRedirect } from '@/app/IndexRedirect';
import AppLayout from '@/components/AppLayout';
import { PageSkeleton } from '@/components/ui/page-skeleton';
import Login from '@/pages/Login';
import NotFound from '@/pages/NotFound';

/** Element rendered for each product module route (keyed by module id). */
const MODULE_ELEMENTS: Record<ModuleId, ReactNode> = {
  'platform-dashboard': <PlatformDashboardPage />,
  'organization-management': <OrganizationManagementPage />,
  'user-admin': <UserAdminPage />,
  class: <MyClassPage />,
  dashboard: <DashboardPage />,
  frame: <FramePage />,
  classroom: <ClassroomSupportPage />,
  timer: <ClassroomTimerPage />,
  qbs: <QbsSafetyPage />,
  ei: <EmotionalIntelligencePage />,
  zones: <ZonesOfRegulationPage />,
  signs: <SignLanguagePage />,
  attendance: <CampusAttendancePage />,
  'parent-comm': <MessagesPage />,
  'internal-comm': <InternalAlertsPage />,
  safety: <SafetyProtocolsPage />,
  handbook: <HandbookPoliciesPage />,
  community: <CommunityPartnershipsPage />,
  vocational: <VocationalOpportunitiesPage />,
  esa: <EsaFundingPage />,
  walkthrough: <WalkthroughPage />,
  director: <DirectorDashboardPage />,
};

// One shell child route per product module, in MODULES order, each behind the
// module permission/scope guard.
const moduleRoutes: RouteObject[] = MODULES.map((module) => ({
  path: module.routePath.slice(1),
  element: <ModuleRouteGuard>{MODULE_ELEMENTS[module.id]}</ModuleRouteGuard>,
}));

// Non-module shell routes (available to every authenticated user, not gated by
// the module permission/scope guard).
const extraShellRoutes: RouteObject[] = [
  {
    path: APP_ROUTE_PATHS.attendanceDetails.slice(1),
    element: (
      <ModuleRouteGuard>
        <CampusAttendanceDetailsPage />
      </ModuleRouteGuard>
    ),
  },
  {
    path: APP_ROUTE_PATHS.profile.slice(1),
    element: (
      <Suspense fallback={<PageSkeleton />}>
        <ProfilePage />
      </Suspense>
    ),
  },
];

export const appRoutes: RouteObject[] = [
  {
    element: <AuthGuard />,
    children: [
      {
        path: APP_ROUTE_PATHS.home,
        element: <AppLayout />,
        children: [
          { index: true, element: <IndexRedirect /> },
          ...moduleRoutes,
          ...extraShellRoutes,
        ],
      },
    ],
  },
  {
    path: APP_ROUTE_PATHS.login,
    element: <Login />,
  },
  {
    path: APP_ROUTE_PATHS.notFound,
    element: <NotFound />,
  },
];
