🚦 Production Gap Analysis Report

Status: High-Fidelity Prototype (Mock-Driven) Goal: Production SaaS (Data-Driven)

This document audits the specific technical gaps between the current "Mouth Ship™" engine and a live, money-making application.

---

1. Authentication & User Identity

• Current State (src/hooks/useAuth.ts):
  • Uses setTimeout to simulate login delay.
  • Stores a fake token in localStorage.
  • User profile is a static object imported from src/mocks/user.ts.
• Production Gap:
  • Real users cannot sign up or log in.
  • No password recovery flows.
  • No Row Level Security (RLS) enforcement.
• Target Implementation:
  • Replace logic with supabase.auth.signInWithOAuth() or signInWithPassword().
  • Use onAuthStateChange listener for session persistence.

2. Data Persistence (Content)

• Current State (src/hooks/useDocsDB.ts):
  • Loads content from static TypeScript arrays (src/mocks/content/*.ts).
  • Search is performed in-memory using JavaScript Array.filter.
• Production Gap:
  • Content updates require a code commit and redeploy.
  • Non-technical users cannot edit content via a CMS.
• Decision Point:
  • Stay Static? If you are the only editor, the current Git-based workflow (GitOps) is actually production-ready and preferred for performance.
  • Go Dynamic? If you need a team CMS, migrate data to Supabase resources table and update hooks to fetch via API.

3. Data Persistence (User Data)

• Current State (src/hooks/useDashboardStats.ts):
  • Returns randomized numbers to demonstrate UI states.
• Production Gap:
  • User actions (saving settings, creating projects) are not saved to a cloud database.
  • Data is lost on browser cache clear (if using local storage).
• Target Implementation:
  • Connect to Supabase user_data tables.

4. Payments & Monetization

• Current State (src/hooks/usePricing.ts):
  • Checks a mock user.tier field.
  • "Upgrade" buttons link to documentation or dead ends.
• Production Gap:
  • No integration with Stripe/Creem payment gateways.
  • No webhook listener to update user status after payment.
• Target Implementation:
  • Generate Stripe Checkout URL.
  • Deploy Supabase Edge Function for webhooks.

5. Form Handling (Input/Output)

• Current State (useContact.ts, useNewsletter.ts):
  • Logs input to console.log.
  • Returns a mock "Success" message after 1 second.
• Production Gap:
  • Emails are not actually sent.
  • Leads are not stored in a CRM or database.
• Target Implementation:
  • Post data to an API route (e.g., Formspree, Supabase Edge Function) or save to a leads table.

6. Infrastructure & Environment

• Current State:
  • .env variables may be empty or placeholders.
  • Analytics IDs might be set to G-XXXXXXXXXX.
• Production Gap:
  • Need real API keys configured in Cloudflare Pages dashboard.
  • Need to verify domain ownership for Google Search Console.

---

✅ Summary Checklist

To go live, you must "Color in the green lines":

• Auth: Mock Hook -> Supabase Auth
• DB: Mock Arrays -> Supabase Tables (Optional for Docs, Required for App)
• API: Mock Responses -> Edge Functions
• Env: Placeholders -> Real Keys