fix: sitemap, 404 page, and Sentry client warning

package.json

@@ -1,6 +1,6 @@
 {
   "name": "webapp",
-  "version": "2.31.0",
+  "version": "2.31.1",
   "private": true,
   "scripts": {
     "dev": "next dev",

src/app/not-found.tsx

@@ -1,28 +1,36 @@
 import Link from 'next/link';
 
+import { AppFooter } from '@/components/app-footer/app-footer';
+import { AppHeader } from '@/components/app-header/app-header';
 import { PrimaryCTA } from '@/components/primary-cta';
 
 const NotFound = () => (
-  <section className='relative flex min-h-[calc(100vh-12rem)] w-full items-center justify-center overflow-hidden lg:min-h-[calc(100vh-14rem)]'>
-    <div className='pointer-events-none absolute inset-0 bg-[radial-gradient(ellipse_at_top,var(--tw-gradient-stops))] from-primary/4 via-transparent to-transparent' />
+  <>
+    <AppHeader />
+    <main className='mx-auto min-h-[calc(100vh-4rem)] max-w-7xl px-2 pt-4 lg:min-h-[calc(100vh-5rem)]'>
+      <section className='relative flex min-h-[calc(100vh-12rem)] w-full items-center justify-center overflow-hidden lg:min-h-[calc(100vh-14rem)]'>
+        <div className='pointer-events-none absolute inset-0 bg-[radial-gradient(ellipse_at_top,var(--tw-gradient-stops))] from-primary/4 via-transparent to-transparent' />
 
-    <div className='relative flex flex-col items-center gap-6 text-center'>
-      <div className='flex flex-col gap-3'>
-        <h1 className='text-3xl font-bold tracking-tight md:text-4xl'>
-          Nothing here anon.
-        </h1>
-        <p className='mx-auto max-w-md text-lg text-muted-foreground'>
-          This page doesn&apos;t exist, but thousands of web3 jobs do.
-        </p>
-      </div>
+        <div className='relative flex flex-col items-center gap-6 text-center'>
+          <div className='flex flex-col gap-3'>
+            <h1 className='text-3xl font-bold tracking-tight md:text-4xl'>
+              Nothing here anon.
+            </h1>
+            <p className='mx-auto max-w-md text-lg text-muted-foreground'>
+              This page doesn&apos;t exist, but thousands of web3 jobs do.
+            </p>
+          </div>
 
-      <div className='pt-2'>
-        <PrimaryCTA asChild>
-          <Link href='/'>Find Your Next Role</Link>
-        </PrimaryCTA>
-      </div>
-    </div>
-  </section>
+          <div className='pt-2'>
+            <PrimaryCTA asChild>
+              <Link href='/'>Find Your Next Role</Link>
+            </PrimaryCTA>
+          </div>
+        </div>
+      </section>
+    </main>
+    <AppFooter />
+  </>
 );
 
 export default NotFound;

src/app/sitemap.xml/route.ts

@@ -0,0 +1,20 @@
+import { clientEnv } from '@/lib/env/client';
+
+export const dynamic = 'force-static';
+
+const FRONTEND_URL = clientEnv.FRONTEND_URL;
+
+export function GET() {
+  const xml = [
+    '<?xml version="1.0" encoding="UTF-8"?>',
+    '<sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">',
+    `  <sitemap><loc>${FRONTEND_URL}/sitemap1.xml</loc></sitemap>`,
+    `  <sitemap><loc>${FRONTEND_URL}/sitemap2.xml</loc></sitemap>`,
+    `  <sitemap><loc>${FRONTEND_URL}/sitemap3.xml</loc></sitemap>`,
+    '</sitemapindex>',
+  ].join('\n');
+
+  return new Response(xml, {
+    headers: { 'Content-Type': 'application/xml' },
+  });
+}

src/app/sitemap1.xml/route.ts

@@ -0,0 +1,18 @@
+import { clientEnv } from '@/lib/env/client';
+
+export const dynamic = 'force-static';
+
+const FRONTEND_URL = clientEnv.FRONTEND_URL;
+
+export function GET() {
+  const xml = [
+    '<?xml version="1.0" encoding="UTF-8"?>',
+    '<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">',
+    `  <url><loc>${FRONTEND_URL}</loc><changefreq>hourly</changefreq></url>`,
+    '</urlset>',
+  ].join('\n');
+
+  return new Response(xml, {
+    headers: { 'Content-Type': 'application/xml' },
+  });
+}

src/app/sitemap2.xml/route.ts

@@ -0,0 +1,35 @@
+import * as Sentry from '@sentry/nextjs';
+
+import { fetchPillarSitemapSlugs } from '@/features/pillar/server/data';
+import { clientEnv } from '@/lib/env/client';
+
+export const revalidate = 3600;
+
+const FRONTEND_URL = clientEnv.FRONTEND_URL;
+
+export async function GET() {
+  let slugs: Awaited<ReturnType<typeof fetchPillarSitemapSlugs>> = [];
+
+  try {
+    slugs = await fetchPillarSitemapSlugs();
+  } catch (error) {
+    if (process.env.CI) throw error;
+    Sentry.captureException(error);
+  }
+
+  const urls = slugs.map(
+    ({ slug, lastModified }) =>
+      `  <url><loc>${FRONTEND_URL}/${slug}</loc><lastmod>${new Date(lastModified).toISOString()}</lastmod><changefreq>hourly</changefreq></url>`,
+  );
+
+  const xml = [
+    '<?xml version="1.0" encoding="UTF-8"?>',
+    '<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">',
+    ...urls,
+    '</urlset>',
+  ].join('\n');
+
+  return new Response(xml, {
+    headers: { 'Content-Type': 'application/xml' },
+  });
+}

src/app/sitemap3.xml/route.ts

@@ -0,0 +1,35 @@
+import * as Sentry from '@sentry/nextjs';
+
+import { fetchSitemapJobs } from '@/features/jobs/server/data';
+import { clientEnv } from '@/lib/env/client';
+
+export const revalidate = 3600;
+
+const FRONTEND_URL = clientEnv.FRONTEND_URL;
+
+export async function GET() {
+  let jobs: Awaited<ReturnType<typeof fetchSitemapJobs>> = [];
+
+  try {
+    jobs = await fetchSitemapJobs();
+  } catch (error) {
+    if (process.env.CI) throw error;
+    Sentry.captureException(error);
+  }
+
+  const urls = jobs.map(
+    ({ href, lastModified }) =>
+      `  <url><loc>${FRONTEND_URL}${href}</loc><lastmod>${lastModified.toISOString()}</lastmod><changefreq>hourly</changefreq></url>`,
+  );
+
+  const xml = [
+    '<?xml version="1.0" encoding="UTF-8"?>',
+    '<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">',
+    ...urls,
+    '</urlset>',
+  ].join('\n');
+
+  return new Response(xml, {
+    headers: { 'Content-Type': 'application/xml' },
+  });
+}

src/instrumentation-client.ts

@@ -7,3 +7,5 @@ Sentry.init({
   integrations: (defaults) =>
     defaults.filter((i) => i.name !== 'BrowserTracing'),
 });
+
+export const onRouterTransitionStart = Sentry.captureRouterTransitionStart;