Add generic iframe component, US SNAP map

app/src/Router.tsx

@@ -15,12 +15,14 @@ import PrivacyPage from './pages/Privacy.page';
 import ReportOutputPage from './pages/ReportOutput.page';
 import ReportsPage from './pages/Reports.page';
 import SimulationsPage from './pages/Simulations.page';
+import SNAPMapPage from './pages/SNAPMap.page';
 import SupportersPage from './pages/Supporters.page';
 import TeamPage from './pages/Team.page';
 import TermsPage from './pages/Terms.page';
 import { CountryGuard } from './routing/guards/CountryGuard';
 import { MetadataGuard } from './routing/guards/MetadataGuard';
 import { MetadataLazyLoader } from './routing/guards/MetadataLazyLoader';
+import { USOnlyGuard } from './routing/guards/USOnlyGuard';
 import { RedirectToCountry } from './routing/RedirectToCountry';
 import { RedirectToLegacy } from './routing/RedirectToLegacy';
 
@@ -31,6 +33,7 @@ const router = createBrowserRouter(
       // Dynamically detect and redirect to user's country
       element: <RedirectToCountry />,
     },
+    // US-specific routes
     {
       path: '/:countryId',
       element: <CountryGuard />,
@@ -150,6 +153,21 @@ const router = createBrowserRouter(
             },
           ],
         },
+        // US-only routes
+        {
+          element: <USOnlyGuard />,
+          children: [
+            {
+              element: <StaticLayout />,
+              children: [
+                {
+                  path: 'snap-map',
+                  element: <SNAPMapPage />,
+                },
+              ],
+            },
+          ],
+        },
         // Legacy routes - redirect to legacy.policyengine.org
         {
           children: [

app/src/components/IframeContent.tsx

@@ -0,0 +1,18 @@
+interface IframeContentProps {
+  url: string;
+}
+
+export default function IframeContent({ url }: IframeContentProps) {
+  return (
+    <iframe
+      src={url}
+      style={{
+        width: '100%',
+        height: 'calc(100vh - var(--header-height, 58px))',
+        border: 'none',
+        display: 'block',
+      }}
+      title="Embedded content"
+    />
+  );
+}

app/src/pages/SNAPMap.page.tsx

@@ -0,0 +1,5 @@
+import IframeContent from '@/components/IframeContent';
+
+export default function SNAPMapPage() {
+  return <IframeContent url="https://policyengine.github.io/snap-district-map/" />;
+}

app/src/routing/guards/USOnlyGuard.tsx

@@ -0,0 +1,15 @@
+import { Navigate, Outlet, useParams } from 'react-router-dom';
+
+/**
+ * Guard component that only allows access for US country routes.
+ * Redirects to root for any other country.
+ */
+export function USOnlyGuard() {
+  const { countryId } = useParams<{ countryId: string }>();
+
+  if (countryId !== 'us') {
+    return <Navigate to="/" replace />;
+  }
+
+  return <Outlet />;
+}