Let me check the WaitlistForm component to debug the submission issue:
I found the issue. The API route is missing CORS headers for the fetch request to Google Forms. Google Forms requires a specific approach. Let me update the API route to properly handle the Google Forms submission:
Now let me also add debug logging to the WaitlistForm to see what's being sent:
I've added comprehensive debug logging to both the form component and the API route. This will help us see exactly what data is being sent and if the environment variables are properly loaded. Try submitting the form again and check the browser console (F12 → Console tab) and your server logs to see if the data is being sent to Google Forms. The logs will show the form ID, entry fields, and API response status.
I see there's an HMR error that's preventing the page from loading. Let me restart the dev server by checking the .env.local file and the API route to ensure everything is set up correctly:
I see the issue - Google Forms submissions need to bypass CORS and use a no-cors mode. Let me also add better error handling with a direct submission approach:
Now let me also create a simple test endpoint to verify the environment variables are loaded correctly:
I've improved the Google Forms submission with better error handling and detailed logging. The issue was likely that environment variables weren't being read properly.
To debug:
http://localhost:3000/api/debug-env to check if all environment variables are loaded.env.local changes require a restart)The updated API now includes detailed console logs that will show you the exact form URL, entry IDs, and HTTP response status from Google Forms.
You can send messages while the preview loads