import { Layout } from '@/components/layout';
import { NotFoundPage } from '@/features/not-found/not-found-page';
import { ServerErrorPage } from '@/features/server-error/server-error-page';
import type { ApiClient } from '@/lib/api-client';
import type { AuthContextValue } from '@/lib/auth';
import { Outlet, createRootRouteWithContext } from '@tanstack/react-router';

type RouterContext = {
  auth: AuthContextValue;
  api: ApiClient;
};

export const Route = createRootRouteWithContext<RouterContext>()({
  component: RootRoute,
  errorComponent: ServerErrorPage,
  notFoundComponent: NotFoundPage,
});

function RootRoute() {
  return (
    <Layout>
      <div className="flex flex-col p-6">
        <Outlet />
      </div>
    </Layout>
  );
}
