1import {
 2    createFileRoute,
 3    defer,
 4    Await,
 5    Outlet,
 6} from "@tanstack/react-router";
 7import {
 8    RouterHostContext,
 9    fetchHost,
10} from "@marzneshin/modules/hosts";
11import { Suspense } from "react";
12import {
13    AlertDialog,
14    AlertDialogContent,
15    Loading
16} from "@marzneshin/common/components";
17
18const HostProvider = () => {
19    const { host } = Route.useLoaderData()
20    return (
21        <Suspense fallback={<Loading />}>
22            <Await promise={host}>
23                {(host) => (
24                    <RouterHostContext.Provider value={{ host }}>
25                        <Suspense>
26                            <Outlet />
27                        </Suspense>
28                    </RouterHostContext.Provider>
29                )}
30            </Await>
31        </Suspense>
32    )
33}
34
35export const Route = createFileRoute('/_dashboard/hosts/$hostId')({
36    loader: async ({ params }) => {
37        const hostPromise = fetchHost({
38            queryKey: ["hosts", Number.parseInt(params.hostId)]
39        });
40
41        return {
42            host: defer(hostPromise)
43        }
44    },
45    errorComponent: () => (
46        <AlertDialog open={true}>
47            <AlertDialogContent>Host not found</AlertDialogContent>
48        </AlertDialog>
49    ),
50    component: HostProvider,
51})