import { Suspense } from "react";
import { Routes as ReactRoutes, Route } from "react-router-dom";
import { HomePage } from "@/pages/home.page";
import { SecondaryPage } from "@/pages/secondary.page";
import { AuthPage } from "@/pages/AuthPage";
import { CreateOrganizationPage } from "@/pages/CreateOrganizationPage";
import { ProtectedRoute } from "./helper/protected.route";

export const Routing = () => {
  return (
    <Suspense
      fallback={
        <div className="flex items-center justify-center min-h-screen">
          Загрузка...
        </div>
      }
    >
      <ReactRoutes>
        <Route path="/" element={<AuthPage />} />
        <Route
          path="/create-organization"
          element={<CreateOrganizationPage />}
        />
        <Route
          path="/home"
          element={
            <ProtectedRoute>
              <HomePage />
            </ProtectedRoute>
          }
        />
        <Route
          path="/secondary"
          element={
            <ProtectedRoute>
              <SecondaryPage />
            </ProtectedRoute>
          }
        />
      </ReactRoutes>
    </Suspense>
  );
};