From fc3bc0168737e5b8dd70286a45b355edc9bf9c46 Mon Sep 17 00:00:00 2001
From: VibhavSetlur <vibhav.a.setlur@gmail.com>
Date: Thu, 24 Sep 2026 15:45:05 -0500
Subject: [PATCH 1/2] feat(biochem): add landing page

---
 app/(reference-data)/biochem/page.tsx | 27 +++++++++++++++++++++++++++
 tests/e2e/biochem/landing.spec.ts     | 18 ++++++++++++++++++
 2 files changed, 45 insertions(+)
 create mode 100644 app/(reference-data)/biochem/page.tsx
 create mode 100644 tests/e2e/biochem/landing.spec.ts

diff --git a/app/(reference-data)/biochem/page.tsx b/app/(reference-data)/biochem/page.tsx
new file mode 100644
index 00000000..91dcad17
--- /dev/null
+++ b/app/(reference-data)/biochem/page.tsx
@@ -0,0 +1,27 @@
+'use client';
+
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import Typography from '@mui/material/Typography';
+import Link from 'next/link';
+
+export default function BiochemPage() {
+    return (
+        <Box component="main" sx={{ maxWidth: 720, mx: 'auto', py: { xs: 4, md: 8 }, textAlign: 'center' }}>
+            <Typography component="h1" variant="h3" gutterBottom>
+                Biochemistry
+            </Typography>
+            <Typography color="text.secondary" sx={{ mb: 4 }}>
+                Explore ModelSEED biochemical reactions and compounds.
+            </Typography>
+            <Box sx={{ display: 'flex', flexDirection: { xs: 'column', sm: 'row' }, justifyContent: 'center', gap: 2 }}>
+                <Button component={Link} href="/biochem/reactions" variant="contained" color="primary" size="large">
+                    Reactions
+                </Button>
+                <Button component={Link} href="/biochem/compounds" variant="contained" color="primary" size="large">
+                    Compounds
+                </Button>
+            </Box>
+        </Box>
+    );
+}
diff --git a/tests/e2e/biochem/landing.spec.ts b/tests/e2e/biochem/landing.spec.ts
new file mode 100644
index 00000000..1a6d35c4
--- /dev/null
+++ b/tests/e2e/biochem/landing.spec.ts
@@ -0,0 +1,18 @@
+import { expect, test } from '@playwright/test';
+
+test.describe('Biochemistry landing page', () => {
+    test('renders public reaction and compound links', async ({ page }) => {
+        await page.goto('/biochem');
+
+        await expect(page).toHaveURL(/\/biochem$/);
+        await expect(page.getByRole('heading', { name: 'Biochemistry' })).toBeVisible();
+
+        const reactions = page.getByRole('link', { name: 'Reactions' });
+        await expect(reactions).toBeVisible();
+        await expect(reactions).toHaveAttribute('href', '/biochem/reactions');
+
+        const compounds = page.getByRole('link', { name: 'Compounds' });
+        await expect(compounds).toBeVisible();
+        await expect(compounds).toHaveAttribute('href', '/biochem/compounds');
+    });
+});

From 766f6a7df55b3f38433bcae852ea726fb310dce7 Mon Sep 17 00:00:00 2001
From: VibhavSetlur <vibhav.a.setlur@gmail.com>
Date: Mon, 28 Sep 2026 17:10:07 -0500
Subject: [PATCH 2/2] fix(home): link Biochemistry CTA to landing page

---
 app/page.tsx                      | 2 +-
 tests/e2e/biochem/landing.spec.ts | 8 ++++++++
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/app/page.tsx b/app/page.tsx
index e352bdbd..ed241581 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -138,7 +138,7 @@ function HomePageContent() {
                                 </Typography>
                                 <Button
                                     component={Link}
-                                    href="/biochem/reactions"
+                                    href="/biochem"
                                     variant="contained"
                                     className={styles.biochemButton}
                                     sx={{
diff --git a/tests/e2e/biochem/landing.spec.ts b/tests/e2e/biochem/landing.spec.ts
index 1a6d35c4..79c3f484 100644
--- a/tests/e2e/biochem/landing.spec.ts
+++ b/tests/e2e/biochem/landing.spec.ts
@@ -1,6 +1,14 @@
 import { expect, test } from '@playwright/test';
 
 test.describe('Biochemistry landing page', () => {
+    test('homepage Biochemistry CTA links to the landing page', async ({ page }) => {
+        await page.goto('/');
+
+        const biochemistry = page.getByRole('link', { name: 'Biochemistry (No login required)' });
+        await expect(biochemistry).toBeVisible();
+        await expect(biochemistry).toHaveAttribute('href', '/biochem');
+    });
+
     test('renders public reaction and compound links', async ({ page }) => {
         await page.goto('/biochem');