Your commit message

frontend/app/page.tsx

@@ -2,8 +2,8 @@
 
 import { useEffect, useState } from 'react'
 import Link from 'next/link'
-import { isAuthenticated } from '@/lib/auth'
 import { Button } from '@/components/ui/button'
+import { ThemeToggle } from '@/components/ui/ThemeToggle'
 import { HeroSection, UseCaseShowcase, HowItWorks, Differentiators, SocialProof, FinalCTA } from '@/components/landing/LandingSections'
 import { LiveStatsBar } from '@/components/landing/LiveStatsBar'
 import { PricingComparison } from '@/components/landing/PricingComparison'
@@ -12,20 +12,11 @@ import { motion, AnimatePresence } from 'framer-motion'
 import { Check, ChevronDown, Monitor, Globe, Shield, Clock, Zap, Menu } from 'lucide-react'
 
 export default function Home() {
-  const [loading, setLoading] = useState(true)
-  const [isAuth, setIsAuth] = useState(false)
   const [openFaq, setOpenFaq] = useState<number | null>(null)
   const [billingPeriod, setBillingPeriod] = useState<'monthly' | 'yearly'>('monthly')
   const [mobileMenuOpen, setMobileMenuOpen] = useState(false)
   const [scrollProgress, setScrollProgress] = useState(0)
 
-  useEffect(() => {
-    // Check auth status but DO NOT redirect
-    const auth = isAuthenticated()
-    setIsAuth(auth)
-    setLoading(false)
-  }, [])
-
   // Scroll progress tracking
   useEffect(() => {
     const handleScroll = () => {
@@ -38,16 +29,6 @@ export default function Home() {
     return () => window.removeEventListener('scroll', handleScroll)
   }, [])
 
-  if (loading) {
-    return (
-      <div className="flex min-h-screen items-center justify-center bg-background">
-        <div className="flex flex-col items-center gap-4">
-          <div className="h-8 w-8 animate-spin rounded-full border-2 border-primary border-t-transparent" />
-        </div>
-      </div>
-    )
-  }
-
   const faqs = [
     {
       question: 'What is website monitoring?',
@@ -85,19 +66,14 @@ export default function Home() {
             </nav>
           </div>
           <div className="flex items-center gap-3">
-            {isAuth ? (
-              <Link href="/dashboard">
-                <Button size="sm" className="bg-primary hover:bg-primary/90 text-primary-foreground rounded-full px-5 transition-transform hover:scale-105 active:scale-95 shadow-md shadow-primary/20">
-                  Dashboard
-                </Button>
-              </Link>
-            ) : (
-              <Link href="/register">
-                <Button size="sm" className="bg-primary hover:bg-primary/90 text-primary-foreground rounded-full px-5 transition-transform hover:scale-105 active:scale-95 shadow-md shadow-primary/20">
-                  Get Started
-                </Button>
-              </Link>
-            )}
+            <ThemeToggle />
+            <Button
+              size="sm"
+              className="bg-primary hover:bg-primary/90 text-primary-foreground rounded-full px-5 transition-transform hover:scale-105 active:scale-95 shadow-md shadow-primary/20"
+              onClick={() => document.getElementById('hero')?.scrollIntoView({ behavior: 'smooth' })}
+            >
+              Join Waitlist
+            </Button>
 
             {/* Mobile Menu Button */}
             <button
@@ -121,11 +97,15 @@ export default function Home() {
               <div className="flex flex-col gap-4">
                 <Link href="#features" onClick={() => setMobileMenuOpen(false)} className="text-sm font-medium text-muted-foreground hover:text-foreground">Features</Link>
                 <Link href="#pricing" onClick={() => setMobileMenuOpen(false)} className="text-sm font-medium text-muted-foreground hover:text-foreground">Pricing</Link>
-                {!isAuth && (
-                  <>
-                    <Link href="/register" onClick={() => setMobileMenuOpen(false)} className="text-sm font-medium text-primary font-bold">Get Started</Link>
-                  </>
-                )}
+                <button
+                  onClick={() => {
+                    setMobileMenuOpen(false)
+                    document.getElementById('hero')?.scrollIntoView({ behavior: 'smooth' })
+                  }}
+                  className="text-sm font-medium text-primary font-bold text-left"
+                >
+                  Join Waitlist
+                </button>
               </div>
             </motion.div>
           )}
@@ -140,7 +120,7 @@ export default function Home() {
       />
 
       {/* Hero Section */}
-      <HeroSection isAuthenticated={isAuth} />
+      <HeroSection />
 
       {/* Live Stats Bar */}
       <LiveStatsBar />
@@ -365,7 +345,7 @@ export default function Home() {
       </section >
 
       {/* Final CTA */}
-      <FinalCTA isAuthenticated={isAuth} />
+      <FinalCTA />
 
       {/* Footer */}
       < footer className="border-t border-border bg-background py-12 text-sm" >