Fix: Add header to contact page

src/components/contact/ContactForm.tsx

@@ -244,11 +244,11 @@ export function ContactForm() {
 
       {/* Message */}
       <div className="space-y-2">
-        <Label htmlFor="message">Message *</Label>
+        <Label htmlFor="message">Message * (minimum 20 characters)</Label>
         <Textarea
           id="message"
           {...register('message')}
-          placeholder="Please provide details about your inquiry..."
+          placeholder="Please provide details about your inquiry (minimum 20 characters)..."
           rows={6}
           disabled={isSubmitting}
           className={errors.message ? 'border-destructive' : ''}
@@ -257,8 +257,15 @@ export function ContactForm() {
           {errors.message && (
             <p className="text-sm text-destructive">{errors.message.message}</p>
           )}
-          <p className="text-sm text-muted-foreground ml-auto">
+          <p className={`text-sm ml-auto ${
+            (watch('message')?.length || 0) < 20 
+              ? 'text-destructive font-medium' 
+              : 'text-muted-foreground'
+          }`}>
             {watch('message')?.length || 0} / 2000
+            {(watch('message')?.length || 0) < 20 && 
+              ` (${20 - (watch('message')?.length || 0)} more needed)`
+            }
           </p>
         </div>
       </div>
@@ -284,8 +291,15 @@ export function ContactForm() {
       <Button
         type="submit"
         size="lg"
-        disabled={isSubmitting || !captchaToken}
+        disabled={isSubmitting || !captchaToken || (watch('message')?.length || 0) < 20}
         className="w-full"
+        title={
+          !captchaToken 
+            ? 'Please complete the CAPTCHA' 
+            : (watch('message')?.length || 0) < 20 
+            ? `Message must be at least 20 characters (currently ${watch('message')?.length || 0})`
+            : ''
+        }
       >
         {isSubmitting ? (
           <>

src/integrations/supabase/types.ts

@@ -538,7 +538,7 @@ export type Database = {
           response_count: number | null
           status: string
           subject: string
-          thread_id: string
+          thread_id: string | null
           updated_at: string
           user_agent: string | null
           user_id: string | null
@@ -559,7 +559,7 @@ export type Database = {
           response_count?: number | null
           status?: string
           subject: string
-          thread_id: string
+          thread_id?: string | null
           updated_at?: string
           user_agent?: string | null
           user_id?: string | null
@@ -580,7 +580,7 @@ export type Database = {
           response_count?: number | null
           status?: string
           subject?: string
-          thread_id?: string
+          thread_id?: string | null
           updated_at?: string
           user_agent?: string | null
           user_id?: string | null

src/pages/Contact.tsx

@@ -4,10 +4,13 @@ import { ContactInfoCard } from '@/components/contact/ContactInfoCard';
 import { ContactFAQ } from '@/components/contact/ContactFAQ';
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
 import { Link } from 'react-router-dom';
+import { Header } from '@/components/layout/Header';
 
 export default function Contact() {
   return (
-    <div className="container mx-auto px-4 py-8 max-w-7xl">
+    <div className="min-h-screen bg-background">
+      <Header />
+      <div className="container mx-auto px-4 py-8 max-w-7xl">
       {/* Hero Section */}
       <div className="text-center mb-12">
         <h1 className="text-4xl md:text-5xl font-bold mb-4">Get in Touch</h1>
@@ -110,5 +113,6 @@ export default function Contact() {
         <ContactFAQ />
       </div>
     </div>
+    </div>
   );
 }

supabase/migrations/20251028175956_53acc642-e1d9-4758-a576-0e6073901ea5.sql

@@ -0,0 +1,4 @@
+-- Make thread_id nullable in contact_submissions table
+-- Contact submissions don't have a thread until an admin replies
+ALTER TABLE public.contact_submissions 
+ALTER COLUMN thread_id DROP NOT NULL;