Page: Contact Us

Code: CONT Route: /contact Access: Public Priority: P1 Test Script: scripts/page-tests/test-CONT.sh Components: src/components/marketing/index.ts

Purpose

Provide a way for visitors to contact Peerloop for support, partnerships, press inquiries, and general questions. Reduce friction for potential users with questions.

Connections

Incoming (users arrive from)

Source Trigger Notes
HOME Footer 'Contact' link Primary entry
FAQP "Contact Us" CTA Fallback from FAQ
Footer "Contact" link Global footer link

Outgoing (users navigate to)

Target Trigger Notes
FAQP "Visit FAQ" link Reduce unnecessary contacts
HOME "Return to Home" after form submission Return to home

Data Requirements

Entity Fields Used Purpose
contact_submissions name, email, subject, category, message, created_at Store contact form submissions

Sections

Hero

  • • Headline: "Get in Touch"
  • • Subheadline: "We're here to help. Reach out and we'll respond within 24 hours."

Contact Form

  • • Name (required, min 2 chars)
  • • Email (required, valid format)
  • • Category dropdown (7 options)
  • • Subject (required, min 5 chars)
  • • Message (required, min 20 chars)
  • • Submit button: "Send Message"

FAQ Redirect Card

  • • "Looking for Quick Answers?"
  • • "Visit FAQ" button → /faq

Alternative Contact Methods

  • • support@peerloop.com
  • • partnerships@peerloop.com
  • • press@peerloop.com

Social Links

  • • Twitter/X
  • • LinkedIn
  • • Instagram

Office Info

  • • Address display
  • • Remote-first note

User Stories Fulfilled

  • • US-G020
  • • US-G021

States & Variations

State Description
Default (idle) Empty form ready for input
Submitting Spinner on button, fields disabled
Success Thank you message with CTAs
Error Error banner shown, form remains
Validation Error Inline field errors shown

Mobile Considerations

  • • Form fields full-width
  • • Category dropdown native on mobile
  • • Submit button prominent and thumb-accessible
  • • Sidebar stacks below form

Error Handling

Error Display
Form submission fails Show error message with retry option
Invalid email format Inline validation error
Field too short Inline validation with min length message

Analytics Events

Event Trigger Data
page_view Page load source, referrer
form_start First field interaction field_name
form_submit Form submitted category, success

Notes

  • • Form submission stores to D1 contact_submissions table
  • • Email notification via Resend planned for Block 9
  • • Rate limiting not yet implemented
  • • Has dev mode toggle (PageSpecView + real content)
  • • Responsive: form full-width on mobile, sidebar stacks below

Features

Contact Form

  • ✓
    Hero with headline and subheadline [US-G020]
  • ✓
    Contact form with 5 fields (name, email, category, subject, message) [US-G020]
  • ✓
    Category dropdown (7 options) [US-G020]
  • ✓
    Client-side validation with inline errors [US-G020]
  • ✓
    Form states: idle, submitting (spinner), success, error [US-G020]
  • ✓
    Success message with "Return to Home" + "Send Another" options [US-G020]

Sidebar Info

  • ✓
    FAQ redirect card [US-G020]
  • ✓
    Alternative contact emails (3) [US-G021]
  • ✓
    Social links (Twitter/X, LinkedIn, Instagram) [US-G020]
  • ✓
    Office address info [US-G020]

Backend

  • ✓
    Form submission to POST /api/contact [US-G020]
  • ✓
    Submissions stored in D1 contact_submissions table [US-G020]
  • ○
    Email notification via Resend [US-G020] Planned for Block 9

Interactive Elements

Buttons: 2/2 active Links: 8/8 active

Buttons

Element Component Action Status
Send Message ContactPage Submits form, shows spinner active
Send Another Message SuccessMessage Resets form to idle active

Links

FAQ Card

Element Target Status
"Visit FAQ" /faq active

Success State

Element Target Status
"Return to Home" / active

Contact Emails

Element Target Status
support@peerloop.com mailto: active
partnerships@peerloop.com mailto: active
press@peerloop.com mailto: active

Social Links

Element Target Status
Twitter/X External (twitter.com) active
LinkedIn External (linkedin.com) active
Instagram External (instagram.com) active

Target Pages Status

Target Page Code Status
/faq FAQP Implemented
/ HOME Implemented

Verification Notes

Verified: 2026-01-08 Consolidated: 2026-01-08

Verified Components

  • ✓ src/components/marketing/ContactPage.tsx

Screenshots

  • 📷 CONT-2026-01-08-02-20-00.png - Full page with form

Notes

  • • All interactive elements are functional
  • • Form validation works client-side
  • • Form submits successfully to /api/contact
  • • All email links use mailto: protocol
  • • Social links open in new tab with proper rel attributes
  • • Analytics planned for Block 9

Test Coverage

Component ✓ Page ○ SSR ○ API 1/1 ✓ Ready
Script: scripts/page-tests/test-CONT.sh
Page Test: tests/pages/contact.test.tsx ○
Component Test: tests/components/marketing/ContactPage.test.tsx ✓

API Tests

Endpoint Test File Status
POST /api/contact tests/api/contact.test.ts ✓ tested

Discrepancies (Spec vs Implementation)

As of 2026-01-08

Planned but Not Implemented

Feature Original Spec Status Priority
Email notification via Resend Send email to support team on form submission Planned for Block 9 Medium
Analytics events 3 events (page_view, form_start, form_submit) Not implemented Low
Map embed Optional map showing office location Not implemented Low

Get in Touch

Have a question? We'd love to hear from you. Send us a message and we'll respond within 24 hours.

Looking for Quick Answers?

Many common questions are answered in our FAQ.

Visit FAQ→

Other Ways to Reach Us

support@peerloop.com

For general inquiries and support

partnerships@peerloop.com

For business and partnership opportunities

press@peerloop.com

For media and press inquiries

We typically respond within 24 hours on business days.

Follow Us

Our Office

123 Learning Lane
San Francisco, CA 94105
United States

We're a remote-first company, but our headquarters is in San Francisco.