Meta

uchicago-dsi · May 28, 2024 · 6654807 · 6654807
1 parent b03159e
commit 6654807
Show file tree

Hide file tree

Showing 7 changed files with 176 additions and 7 deletions.
diff --git a/app/api/og/route.tsx b/app/api/og/route.tsx
@@ -0,0 +1,31 @@
+import { ImageResponse } from 'next/og';
+// App router includes @vercel/og.
+// No need to install it.
+
+export async function GET(request: Request) {
+  const { searchParams } = new URL(request.url);
+  const locationName = searchParams.get('name') || 'World';
+  return new ImageResponse(
+    (
+      <div
+        style={{
+          fontSize: 40,
+          color: 'black',
+          background: 'white',
+          width: '100%',
+          height: '100%',
+          padding: '50px 200px',
+          textAlign: 'center',
+          justifyContent: 'center',
+          alignItems: 'center',
+        }}
+      >
+        {locationName}
+      </div>
+    ),
+    {
+      width: 1200,
+      height: 630,
+    },
+  );
+}
diff --git a/app/robots.ts b/app/robots.ts
@@ -0,0 +1,12 @@
+import { MetadataRoute } from 'next'
+
+export default function robots(): MetadataRoute.Robots {
+  return {
+    rules: {
+      userAgent: '*',
+      allow: '{/api/og/*}',
+      disallow: '/private/',
+    },
+    // sitemap: 'https://acme.com/sitemap.xml',
+  }
+}
diff --git a/app/tract/[tract]/page.tsx b/app/tract/[tract]/page.tsx
@@ -1,6 +1,7 @@
 import React from "react"
 import ReportLayout from "components/ReportLayout"
 import { getContentDirs } from "utils/contentDirs"
+import Head from "next/head"
 
 type TractRouteParams = {
   params: {
@@ -10,7 +11,16 @@ type TractRouteParams = {
 
 const TractPage: React.FC<TractRouteParams> = async ({ params }) => {
   getContentDirs()
-  return <ReportLayout id={params.tract} />
+  return <>
+  <Head>
+    <title>Tract Report</title>
+    <meta
+      property="og:image"
+      content="/api/og"
+    />
+  </Head>
+  <ReportLayout id={params.tract} />
+  </>
 }
 
 export default TractPage
diff --git a/components/Map/Map.tsx b/components/Map/Map.tsx
@@ -103,6 +103,7 @@ export const Map: React.FC<MapProps> = ({ initialFilter, simpleMap = false, onCl
     snapshot,
     colors,
     breaks,
+    currentColumn,
     currentColumnSpec,
     colorFilter,
     currentColumnGroup,
@@ -407,7 +408,7 @@ export const Map: React.FC<MapProps> = ({ initialFilter, simpleMap = false, onCl
                   key={i}
                   onClick={() => handleSetColumn(c)}
                   label={c}
-                  selected={currentColumnSpec.name === c}
+                  selected={currentColumn === c}
                 />
               ))}
             </MenuSection>

diff --git a/components/Nav/index.tsx b/components/Nav/index.tsx
@@ -1,15 +1,12 @@
 import React from "react";
 import { getMdxContent } from "hooks/useMdxContent";
 import {NavClient} from "./Client"
-import {NavRenderer} from "./Renderer"
 import { NavProps } from "./types";
 
-const NavInner = process.env.NODE_ENV === "development" ? NavClient : NavRenderer;
-
 export const Nav: React.FC = async () => {
   const navInfo = await getMdxContent<NavProps['navInfo']>("nav", "main-nav.mdx")
   // @ts-ignore
-  return <NavInner navInfo={navInfo} />
+  return <NavClient navInfo={navInfo} />
 }
 
 export default Nav;
diff --git a/package.json b/package.json
@@ -77,6 +77,7 @@
     "@types/papaparse": "^5.3.14",
     "@types/react-icons": "^3.0.0",
     "@types/tinycolor2": "^1.4.6",
+    "@vercel/og": "^0.6.2",
     "@vercel/otel": "^0.3.0",
     "@visx/axis": "^3.10.1",
     "@visx/curve": "^3.3.0",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml