# Google Sheets Contact Form Integration Guide

Preparation Desk includes native support for sending all website inquiries, student feedback, and beta tester registrations directly into your own **Google Sheet** in real time.

---

## 1. Step-by-Step Setup (Takes 2 Minutes)

### Step 1: Create or Open a Google Sheet
1. Open [Google Sheets](https://sheets.new) and create a new blank spreadsheet.
2. Name it **Preparation Desk Inquiries**.

### Step 2: Open Google Apps Script
1. In the top menu of your Google Sheet, click **Extensions** > **Apps Script**.
2. Delete any code currently in `Code.gs`.
3. Paste the following script into `Code.gs`:

```javascript
/**
 * Preparation Desk - Google Sheets Contact Form Webhook
 * Automatically logs website inquiries and beta requests.
 */

function doPost(e) {
  var lock = LockService.getScriptLock();
  lock.tryLock(10000); // Prevent concurrent write collisions

  try {
    var sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
    
    // Auto-create header row if sheet is empty
    if (sheet.getLastRow() === 0) {
      sheet.appendRow([
        "Timestamp",
        "Full Name",
        "Email Address",
        "Category",
        "Subject",
        "Message",
        "Source URL"
      ]);
      // Format header
      sheet.getRange(1, 1, 1, 7).setFontWeight("bold").setBackground("#133661").setFontColor("#FFFFFF");
      sheet.setFrozenRows(1);
    }

    var data = {};
    if (e.postData && e.postData.contents) {
      try {
        data = JSON.parse(e.postData.contents);
      } catch (err) {
        data = e.parameter;
      }
    } else {
      data = e.parameter;
    }

    var timestamp = new Date();
    var name = data.name || "Anonymous";
    var email = data.email || "";
    var category = data.category || "General Inquiry";
    var subject = data.subject || "No Subject";
    var message = data.message || "";
    var sourceUrl = data.sourceUrl || "Direct Website";

    // Append row
    sheet.appendRow([timestamp, name, email, category, subject, message, sourceUrl]);

    return ContentService.createTextOutput(JSON.stringify({
      status: "success",
      message: "Row added to Google Sheet successfully",
      timestamp: timestamp.toISOString()
    })).setMimeType(ContentService.MimeType.JSON);

  } catch (error) {
    return ContentService.createTextOutput(JSON.stringify({
      status: "error",
      message: error.toString()
    })).setMimeType(ContentService.MimeType.JSON);

  } finally {
    lock.releaseLock();
  }
}

function doGet(e) {
  return ContentService.createTextOutput(JSON.stringify({
    status: "active",
    message: "Preparation Desk Google Sheets Webhook is Live!"
  })).setMimeType(ContentService.MimeType.JSON);
}
```

### Step 3: Deploy as Web App
1. Click the blue **Deploy** button in the top right > **New deployment**.
2. Click the gear icon ⚙️ next to "Select type" and select **Web app**.
3. Fill in:
   - **Description**: `Preparation Desk Website Inquiries`
   - **Execute as**: `Me (your google account)`
   - **Who has access**: `Anyone` *(Crucial: allows the website contact form to post data)*
4. Click **Deploy**.
5. Grant permissions if prompted by Google (click *Advanced* > *Go to Untitled project (unsafe)* > *Allow*).
6. Copy the generated **Web App URL** (looks like `https://script.google.com/macros/s/AKfycb.../exec`).

### Step 4: Add the URL to Preparation Desk
Open `/js/app-data.js` and paste your URL into `SITE_CONFIG.googleSheetsWebhookUrl`:
```javascript
const SITE_CONFIG = {
  ...
  googleSheetsWebhookUrl: "https://script.google.com/macros/s/YOUR_ACTUAL_SCRIPT_ID/exec",
  ...
};
```
Alternatively, set the environment variable `GOOGLE_SHEETS_WEBHOOK_URL` in your hosting provider (Vercel, Netlify, or server).

---

## 2. Testing Your Integration
1. Go to your live contact page at [http://localhost:3000/contact.html](http://localhost:3000/contact.html).
2. Fill out a test inquiry and hit **Send Message**.
3. You will immediately see the submission appear in real time in your Google Sheet!