From 6923077a4b2844e8295bf6d9f840f5da4f4bdc06 Mon Sep 17 00:00:00 2001 From: Willem Wyndham Date: Thu, 3 Sep 2026 00:56:09 -0400 Subject: [PATCH 1/3] feat: add contract explorer previews --- app/root.module.css | 4 + app/root.tsx | 17 +- app/routes.ts | 1 + app/routes/explorerPreview.module.css | 1582 ++++++++++++++++++++++ app/routes/explorerPreview.tsx | 1739 +++++++++++++++++++++++++ 5 files changed, 3338 insertions(+), 5 deletions(-) create mode 100644 app/routes/explorerPreview.module.css create mode 100644 app/routes/explorerPreview.tsx diff --git a/app/root.module.css b/app/root.module.css index 5466a95..70a14ea 100644 --- a/app/root.module.css +++ b/app/root.module.css @@ -177,6 +177,10 @@ flex-direction: column; } +.previewContent { + min-width: 0; +} + /* ── Scaffold Stellar banner ─────────────────────────── */ .scaffoldBanner { diff --git a/app/root.tsx b/app/root.tsx index 4aaa2cb..bfc2b34 100644 --- a/app/root.tsx +++ b/app/root.tsx @@ -15,12 +15,13 @@ import { Scripts, ScrollRestoration, useRouteLoaderData, + useLocation, } from "react-router" import { type Route } from "./+types/root" -import { Logo } from "~/components/logo" import "./app.css" import styles from "./root.module.css" +import { Logo } from "~/components/logo" import { checkHealth } from "~/lib/api" // Runs before hydration to avoid flash of wrong theme. Defaults to dark. @@ -361,8 +362,10 @@ export function useRootData() { export default function App({ loaderData }: Route.ComponentProps) { const { network } = loaderData + const { pathname } = useLocation() const [isDark, setIsDark] = useState(true) const [queryClient] = useState(() => new QueryClient()) + const isExplorerPreview = pathname.startsWith("/explorer-preview") useEffect(() => { setIsDark(document.documentElement.classList.contains("dark")) @@ -377,12 +380,16 @@ export default function App({ loaderData }: Route.ComponentProps) { return ( -
-
+ {!isExplorerPreview && ( +
+ )} +
- -