diff --git a/src/pages/AppShell.tsx b/src/pages/AppShell.tsx index b69ae37..fdee6a9 100644 --- a/src/pages/AppShell.tsx +++ b/src/pages/AppShell.tsx @@ -3,6 +3,7 @@ import { type NavigationItem, } from "@/components/GlobalCommandPalette" import { GithubIcon } from "@/components/Icons" +import { Loading } from "@/components/Loading" import SliderToggle from "@/components/Toggle" import { Button } from "@/components/ui/button" import { Sheet, SheetContent } from "@/components/ui/sheet" @@ -24,7 +25,7 @@ import { SquareFunction, UserRound, } from "lucide-react" -import { FC, PropsWithChildren, useState } from "react" +import { FC, PropsWithChildren, Suspense, useState } from "react" import { useLocation } from "react-router-dom" import { twMerge } from "tailwind-merge" import { NetworkSwitcher } from "./Network/Network" @@ -118,7 +119,9 @@ export const AppShell: FC = ({ children }) => {
setSidebarOpen(true)} /> - {children} + Loading Section…}> + {children} +
diff --git a/src/pages/Teleport/Teleport.tsx b/src/pages/Teleport/Teleport.tsx index 1b47667..a8dae8c 100644 --- a/src/pages/Teleport/Teleport.tsx +++ b/src/pages/Teleport/Teleport.tsx @@ -1,3 +1,4 @@ +import { LoadingBlocks } from "@/components/Loading" import { withSubscribe } from "@/components/withSuspense" import { useStateObservable } from "@react-rxjs/core" import { AlertTriangle } from "lucide-react" @@ -6,58 +7,65 @@ import { RoutePreview } from "./RoutePreview" import { origin$, Setup } from "./Setup" import { Submit } from "./Submit" -const Teleport = withSubscribe(() => { - const origin = useStateObservable(origin$) +const Teleport = withSubscribe( + () => { + const origin = useStateObservable(origin$) + + if (!origin) { + // TODO explore custom chains + return ( + +
+
+ +
+

Chain not supported

+

+ Teleport is currently available only for chains supported by + Paraspell. +

+
+
+
+
+ ) + } - if (!origin) { - // TODO explore custom chains return ( - -
-
- -
-

Chain not supported

-

- Teleport is currently available only for chains supported by - Paraspell. + +

+
+
+

+ Teleport +

+

+ Send assets from the connected chain to a supported destination.

+ + Powered by Paraspell ✨ + +
+ +
+ +
+ + +
) - } - - return ( - -
-
-
-

Teleport

-

- Send assets from the connected chain to a supported destination. -

-
- - Powered by Paraspell ✨ - -
- -
- -
- - -
-
-
-
- ) -}) + }, + { + fallback: , + }, +) export default Teleport