import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import { Outlet, Link, createRootRouteWithContext, useRouter, useLocation, HeadContent, Scripts, type ErrorComponentProps, } from "@tanstack/react-router"; import { useEffect, type ReactNode } from "react"; import { Toaster } from "@/components/ui/sonner"; import { AppHeader } from "@/components/app-header"; import { useScrollReveal } from "@/hooks/use-scroll-reveal"; import appCss from "../styles.css?url"; import { reportLovableError } from "../lib/lovable-error-reporting"; function NotFoundComponent() { return (

404

Page not found

The page you're looking for doesn't exist or has been moved.

Go home
); } function ErrorComponent({ error, reset }: ErrorComponentProps) { console.error(error); const router = useRouter(); useEffect(() => { reportLovableError(error, { boundary: "tanstack_root_error_component" }); }, [error]); return (

This page didn't load

Something went wrong on our end. You can try refreshing or head back home.

Go home
); } export const Route = createRootRouteWithContext<{ queryClient: QueryClient }>()({ head: () => ({ meta: [ { charSet: "utf-8" }, { name: "viewport", content: "width=device-width, initial-scale=1" }, { title: "Codesynux — Autonomous AI Platform" }, { name: "description", content: "Codesynux: live voice agents, autonomous systems, security scans and cloud deployment." }, { property: "og:type", content: "website" }, { name: "twitter:card", content: "summary_large_image" }, { name: "twitter:site", content: "@Lovable" }, ], links: [ { rel: "stylesheet", href: appCss, }, { rel: "icon", href: "/favicon.png", type: "image/png" }, { rel: "preconnect", href: "https://fonts.googleapis.com" }, { rel: "preconnect", href: "https://fonts.gstatic.com", crossOrigin: "anonymous" }, { rel: "stylesheet", href: "https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;700&display=swap", }, ], }), shellComponent: RootShell, component: RootComponent, notFoundComponent: NotFoundComponent, errorComponent: ErrorComponent, }); function RootShell({ children }: { children: ReactNode }) { return ( {children} ); } function RootComponent() { const { queryClient } = Route.useRouteContext(); useScrollReveal(); const location = useLocation(); return ( {/* Required: nested routes render here. Removing breaks all child routes. */}
); }