import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import { Outlet, createRootRouteWithContext, useRouter, useRouterState, HeadContent, Scripts, Link, } from "@tanstack/react-router"; import type { ReactNode } from "react"; import appCss from "../styles.css?url"; import { Header } from "../components/site/Header"; import { Footer } from "../components/site/Footer"; function NotFoundComponent() { return (

404

Page not found

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

Return home
); } function ErrorComponent({ error, reset }: { error: Error; reset: () => void }) { console.error(error); const router = useRouter(); return (

This page didn't load

Something went wrong. Try refreshing or return home.

Go home
); } export const Route = createRootRouteWithContext<{ queryClient: QueryClient }>()({ head: () => ({ meta: [ { charSet: "utf-8" }, { name: "viewport", content: "width=device-width, initial-scale=1" }, { title: "Vigor Group of Companies — A diversified Tanzanian business group" }, { name: "description", content: "Vigor Group of Companies is a diversified Tanzanian conglomerate operating across seven sectors: healthcare, hospitality, manufacturing, trading, real estate, investment and community development.", }, { name: "author", content: "Vigor Group of Companies" }, { property: "og:title", content: "Vigor Group of Companies" }, { property: "og:description", content: "A diversified Tanzanian business group building lasting value across seven sectors." }, { property: "og:type", content: "website" }, { name: "twitter:card", content: "summary_large_image" }, ], links: [ { rel: "stylesheet", href: appCss }, { rel: "icon", href: "/favicon.ico", type: "image/x-icon" }, { rel: "preconnect", href: "https://fonts.googleapis.com" }, { rel: "preconnect", href: "https://fonts.gstatic.com", crossOrigin: "" }, { rel: "stylesheet", href: "https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,600;0,700;0,800;1,600&family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;1,500;1,600&display=swap", }, ], }), shellComponent: RootShell, component: RootComponent, notFoundComponent: NotFoundComponent, errorComponent: ErrorComponent, }); function RootShell({ children }: { children: ReactNode }) { return ( {children} ); } function RootComponent() { const { queryClient } = Route.useRouteContext(); const pathname = useRouterState({ select: (s) => s.location.pathname }); const immersive = pathname === "/" || pathname === "/careers"; return (
); }