contact form and netlify function by interim17 · Pull Request #64 · AllenCell/idea-board

interim17 · 2026-03-03T23:55:17Z

Problem

Advances #44
Closes #60 and #61

Solution

Building out the initial scaffolding for our email/contact system.

In terms of design I think this a placeholder, aiming for a functional proof of concept.

In this PR:

added "trunk/**" to pull request branches in ci.yml so we can get checks on feature trunks (TBD if it works)
removed (commented out) start and comment icons as we are not implementing those yet
each idea page renders a contact form modal
the modal takes in user submissions and triggers a netlify function contact
the response from the function is logged if succesful

This is a fairly harmless template that we can build on top of as we decide what email tooling we want to use and how we want to store/manage email addresses.

Testing this function locally with netlify cli seems to work, I'm not sure if it will deployed in preview or only when we merge, watching this as it moves through PR will be a useful scan of that system.

netlify · 2026-03-03T23:55:22Z

✅ Deploy Preview for project-idea-board ready!

Name	Link
🔨 Latest commit	`4094e4d`
🔍 Latest deploy log	https://app.netlify.com/projects/project-idea-board/deploys/69a774e763e3fd0008555497
😎 Deploy Preview	https://deploy-preview-64--project-idea-board.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

Copilot

Pull request overview

Initial scaffolding for an idea-page “Contact” flow, including a UI modal and a Netlify Function endpoint, plus CMS/schema updates to support a designated primary contact.

Changes:

Add ContactModal and wire it into the idea post template to submit to /.netlify/functions/contact.
Add primaryContact to Decap CMS config + Gatsby schema/query/frontmatter.
Add Netlify Functions dependency and ignore local Netlify state folder.

Reviewed changes

Copilot reviewed 8 out of 10 changed files in this pull request and generated 6 comments.

Show a summary per file

File	Description
`package.json`	Adds `@netlify/functions` dependency for the new serverless handler.
`yarn.lock`	Locks new Netlify Functions dependency (+ types).
`netlify/functions/contact.mts`	Introduces the `contact` Netlify Function (currently echo-style response).
`src/components/ContactModal.tsx`	New modal UI that collects sender info and POSTs to the Netlify function.
`src/templates/idea-post.tsx`	Adds “Contact” button/modal to idea pages and queries `authors` + `primaryContact`.
`gatsby/schema/base.gql`	Extends Frontmatter with `primaryContact`.
`static/admin/config.yml`	Adds `primaryContact` relation field to the CMS idea editor.
`src/pages/ideas/dev-example.md`	Adds `primaryContact` (and reorganizes some frontmatter content) in an example idea.
`.gitignore`	Ignores local `.netlify` folder.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.

interim17 · 2026-03-04T00:54:50Z

netlify/functions/contact.mts

+    if (event.body === null) {
+        return {
+            statusCode: 400,
+            body: JSON.stringify("Payload required"),
+        };
+    }
+
+    const requestBody = JSON.parse(event.body) as {
+        senderName: string;
+        senderEmail: string;
+        recipient: string;
+        message: string;


out of scope

netlify/functions/contact.mts

+    return {
+        statusCode: 200,
+        body: JSON.stringify(requestBody),
+    };


src/templates/idea-post.tsx


+import { ContactModal } from "../components/ContactModal";
 import IconText from "../components/IconText";
 import Layout from "../components/Layout";


src/components/ContactModal.tsx

+        fetch("/.netlify/functions/contact", {
+            method: "POST",
+            body: JSON.stringify({
+                senderName: senderName,
+                senderEmail: senderEmail,
+                recipient: recipientLabel,
+                message: message,
+            }),


static/admin/config.yml

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

…oard into feature/contact

ShrimpCryptid

Left a bunch of questions, overall looks good! Re-request me when you want me to take another look :>

ShrimpCryptid · 2026-03-04T19:18:58Z

netlify/functions/contact.mts

+    };
+};
+
+export { handler };


Nit: Missing whitespace at EOF-- can Prettier handle these file types?

Hmm, yeah maybe missing that extension

netlify/functions/contact.mts

ShrimpCryptid · 2026-03-04T19:24:51Z

src/components/ContactModal.tsx

+    const recipientLabel = hasPrimaryContact
+        ? primaryContact
+        : hasAuthors
+          ? (authors?.filter(Boolean).join(", ") ?? "the authors")


Is the nullish coalescing operator necessary here? Shouldn't authors be defined?

So in this repo there will be a hardening step that will ensure this is defined, but that will come in a subsequent PR.

Currently authors is inferred and not an explicit part of our schema. We will add a more structured type and resolver to the gatsby node APIs when we know what we need. We will likely query both a name and a contactId to use in getting an environment variable (email address stored as secret).

For now gatsby is just inferring that its (string | nuull) | null

ShrimpCryptid · 2026-03-04T19:25:52Z

src/components/ContactModal.tsx

+        ? primaryContact
+        : hasAuthors
+          ? (authors?.filter(Boolean).join(", ") ?? "the authors")
+          : "fake default email inbox";


Add a TODO or something so this doesn't get left in the code in the future? 🤭

Will do, but there is kind of a TODO on all of this code, since we don't have a design and we don't know the shape of the data/query yet.

ShrimpCryptid · 2026-03-04T19:26:11Z

src/components/ContactModal.tsx

+
+    const handleSubmit = async () => {
+        try {
+            const response = await fetch("/.netlify/functions/contact", {


Should these function paths be stored somewhere as constants? What validates that these exist?

I'm going ahead and storing these now as constants which is good feedback, this PR was the first time we are defining and calling netlify functions.

By default in netlify the file name for the function defined in netlify/functions is the path.

A constant doesn't hurt, but I don't currently know how I plan to do more robust validation, especially given that not everyone has access to the netlify CLI for this repo, currently just me and Megan, so we don't have a good set up for testing and verifying across users and reviewers.

I think best thing will be to do it in CI/CD via the netlify back end but I have to look into it a bit.

ShrimpCryptid · 2026-03-04T19:27:51Z

src/components/ContactModal.tsx

+                console.log("Failed to send message. Please try again later.");
+            }
+        } catch (error) {
+            console.error("Error sending message:", error);


Should this be shown on the modal as error text or something?

Probably something like that for real failure points down the line

ShrimpCryptid · 2026-03-04T19:28:45Z

src/components/ContactModal.tsx

+            if (response.ok) {
+                console.log("Message sent successfully, response:", response);
+            } else {


Should the modal close itself on a success and show an error message on failure?

Good question

ShrimpCryptid · 2026-03-04T19:29:17Z

src/components/ContactModal.tsx

+            <p>
+                <strong>Idea:</strong> {title}
+            </p>
+            {authors && authors.length > 0 && (


use hasAuthors from above?

ShrimpCryptid · 2026-03-04T19:29:32Z

src/components/ContactModal.tsx

+            {authors && authors.length > 0 && (
+                <p>
+                    <strong>Authors:</strong>{" "}
+                    {authors.filter(Boolean).join(", ")}


Repeated filtering here, could do it once up above

ShrimpCryptid · 2026-03-04T19:34:17Z

src/templates/idea-post.tsx

+    // MessageOutlined,
+    // StarOutlined,


Remove? I feel like it's better just to reimport these if the related comment block is uncommented in the future rather than leave these hanging out.

interim17 · 2026-03-05T00:29:15Z

@ShrimpCryptid thanks for review. I pushed some changed in response to your feedback and also deferred on a couple things since this is still somewhat of a draft to just start setting up the use of netlify functions. Note that we aren't merging to main!

interim17 added 3 commits March 3, 2026 14:02

WIP contact component

2855b0a

install netlify functions types

f5ab783

add and call WIP contact function

4094e4d

update CI to run on pull requests into trunks

bf7f29d

interim17 changed the base branch from main to trunk/email March 3, 2026 23:57

interim17 requested a review from Copilot March 3, 2026 23:59

interim17 changed the title ~~Feature/contact~~ contact form and netlify function Mar 3, 2026

Copilot started reviewing on behalf of interim17 March 4, 2026 00:00 View session

Copilot AI reviewed Mar 4, 2026

View reviewed changes

interim17 and others added 8 commits March 3, 2026 16:56

Update src/components/ContactModal.tsx

41db6a8

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

Update static/admin/config.yml

17d8629

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

comment unused imports

e5063dc

add content type header to contact request

97c55fe

Merge branch 'feature/contact' of https://github.com/AllenCell/idea-b…

a78d69f

…oard into feature/contact

Merge branch 'feature/contact' of https://github.com/AllenCell/idea-b…

28cc817

…oard into feature/contact

Merge branch 'feature/contact' of https://github.com/AllenCell/idea-b…

d2d628d

…oard into feature/contact

format

ecba46e

interim17 marked this pull request as ready for review March 4, 2026 17:30

interim17 requested review from ShrimpCryptid, jessicasyu, meganrm and rugeli March 4, 2026 17:30

ShrimpCryptid reviewed Mar 4, 2026

View reviewed changes

interim17 added 4 commits March 4, 2026 15:07

remove commented code

7e9d437

use filtered authors

832245c

use constant for netlify function

0d0bb9b

add .mts to formatter glob

e26a124

interim17 requested a review from ShrimpCryptid March 5, 2026 00:28

ShrimpCryptid approved these changes Mar 5, 2026

View reviewed changes

Conversation

interim17 commented Mar 3, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Problem

Solution

Uh oh!

netlify bot commented Mar 3, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for project-idea-board ready!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

This comment was marked as resolved.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

This comment was marked as resolved.

Uh oh!

This comment was marked as resolved.

Uh oh!

Uh oh!

This comment was marked as resolved.

Uh oh!

Uh oh!

ShrimpCryptid left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

interim17 commented Mar 5, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

interim17 commented Mar 3, 2026 •

edited

Loading

netlify bot commented Mar 3, 2026 •

edited

Loading