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