//import { ProtectedRoute } from "@erp/auth/components";
import { LoadingOverlay } from "@repo/rdx-ui/components";
import { Suspense, lazy } from "react";
import { Outlet, RouteObject } from "react-router-dom";
import { InvoicesGrid } from "./components";

// Lazy load components
const InvoicesLayout = lazy(() =>
  import("./components").then((m) => ({ default: m.InvoicesLayout }))
);
const InvoicesList = lazy(() => import("./pages").then((m) => ({ default: m.InvoicesList })));

//const LogoutPage = lazy(() => import("./app").then((m) => ({ default: m.LogoutPage })));

/*const DealerLayout = lazy(() => import("./app").then((m) => ({ default: m.DealerLayout })));
const DealersList = lazy(() => import("./app").then((m) => ({ default: m.DealersList })));

const LoginPageWithLanguageSelector = lazy(() =>
  import("./app").then((m) => ({ default: m.LoginPageWithLanguageSelector }))
);

const InvoiceCreate = lazy(() => import("./app").then((m) => ({ default: m.InvoiceCreate })));
const InvoiceEdit = lazy(() => import("./app").then((m) => ({ default: m.InvoiceEdit })));
const SettingsEditor = lazy(() => import("./app").then((m) => ({ default: m.SettingsEditor })));
const SettingsLayout = lazy(() => import("./app").then((m) => ({ default: m.SettingsLayout })));
const CatalogLayout = lazy(() => import("./app").then((m) => ({ default: m.CatalogLayout })));
const CatalogList = lazy(() => import("./app").then((m) => ({ default: m.CatalogList })));
const DashboardPage = lazy(() => import("./app").then((m) => ({ default: m.DashboardPage })));
const InvoicesLayout = lazy(() => import("./app").then((m) => ({ default: m.InvoicesLayout })));
const InvoicesList = lazy(() => import("./app").then((m) => ({ default: m.InvoicesList })));*/

export const InvoiceRoutes = (): RouteObject[] => {
  // Define routes accessible only to authenticated users
  const privateRoutes: RouteObject[] = [
    {
      path: "/invoices",
      element: (
        <Suspense fallback={<LoadingOverlay />}>
          <InvoicesLayout>
            <Outlet />
          </InvoicesLayout>
        </Suspense>
      ),
      children: [
        {
          index: true,
          element: <InvoicesGrid />,
        },
      ],
    },
  ];

  // Define routes accessible only to non-authenticated users
  const publicRoutes = [{}];

  return privateRoutes;

  // Provide the router configuration using RouterProvider
  //return <RouterProvider router={router} />;
};