Update src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -2,6 +2,7 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
+import { useState } from "react";
 import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FaqSplitText from '@/components/sections/faq/FaqSplitText';
 import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
@@ -12,6 +13,25 @@ import SplitAbout from '@/components/sections/about/SplitAbout';
 import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
 
 export default function LandingPage() {
+  const [lang, setLang] = useState("es");
+
+  const toggleLanguage = () => {
+    setLang(lang === "es" ? "en" : "es");
+  };
+
+  const t = {
+    es: {
+      nav: [{ name: "Inicio", id: "hero" }, { name: "Nosotros", id: "about" }, { name: "Contacto", id: "contact" }],
+      heroTitle: "Bienvenidos a la Iglesia", heroDesc: "Un lugar de fe, comunidad y pertenencia. Únete a nosotros mientras crecemos juntos en espíritu y propósito.", aboutTitle: "Nuestro Corazón y Misión", aboutDesc: "En nuestra iglesia, nos esforzamos por crear un espacio donde todos se sientan bienvenidos y apoyados. Ya sea que seas nuevo en la fe o estés buscando un hogar, estamos aquí para ti.", featuresTitle: "Nuestros Ministerios", featuresDesc: "Oportunidades para servir, aprender y crecer juntos.", testimonialsTitle: "Voces de la Comunidad", testimonialsDesc: "Lo que nuestros miembros tienen que decir sobre su experiencia aquí.", faqTitle: "Preguntas Frecuentes", contactTitle: "Visítanos hoy", contactDesc: "Ubicación: 123 Faith Avenue, Ciudad | ¡Esperamos conocerte pronto!", lang: "Cambiar a Inglés"
+    },
+    en: {
+      nav: [{ name: "Home", id: "hero" }, { name: "About", id: "about" }, { name: "Contact", id: "contact" }],
+      heroTitle: "Welcome to Our Church", heroDesc: "A place of faith, community, and belonging. Join us as we grow together in spirit and purpose.", aboutTitle: "Our Heart and Mission", aboutDesc: "At our church, we strive to create a space where everyone feels welcome and supported. Whether you are new to faith or looking for a home, we are here for you.", featuresTitle: "Our Ministries", featuresDesc: "Opportunities to serve, learn, and grow together.", testimonialsTitle: "Community Voices", testimonialsDesc: "What our members have to say about their experience here.", faqTitle: "Frequently Asked Questions", contactTitle: "Visit Us Today", contactDesc: "Location: 123 Faith Avenue, City | We look forward to meeting you!", lang: "Switch to Spanish"
+    }
+  };
+
+  const content = t[lang as keyof typeof t];
+
   return (
     <ThemeProvider
       defaultButtonVariant="elastic-effect"
@@ -28,31 +48,24 @@ export default function LandingPage() {
       <ReactLenis root>
         <div id="nav" data-section="nav">
           <NavbarStyleCentered
-            navItems={[
-              { name: "Home", id: "hero" },
-              { name: "About", id: "about" },
-              { name: "Contact", id: "contact" }
-            ]}
-            brandName="Marco's Church"
+            navItems={content.nav}
+            brandName="Iglesia"
           />
+          <div className="flex justify-center p-4">
+            <button onClick={toggleLanguage} className="px-4 py-2 bg-primary text-white rounded-full text-sm">
+              {content.lang}
+            </button>
+          </div>
         </div>
 
         <div id="hero" data-section="hero">
           <HeroSplit
             background={{ variant: "plain" }}
-            title="Welcome to Marco's Church"
-            description="A place of faith, community, and belonging. Join us as we grow together in spirit and purpose."
-            buttons={[{ text: "Contact Us", href: "#contact" }]}
+            title={content.heroTitle}
+            description={content.heroDesc}
+            buttons={[{ text: lang === "es" ? "Contáctanos" : "Contact Us", href: "#contact" }]}
             imageSrc="http://img.b2bpic.net/free-photo/bright-interior-church-with-stainedglass-windows-view-from_169016-21667.jpg"
             mediaAnimation="slide-up"
-            avatars={[
-              { src: "http://img.b2bpic.net/free-photo/inside-cathedral_1361-213.jpg", alt: "Inside the Cathedral" },
-              { src: "http://img.b2bpic.net/free-photo/white-church_1361-214.jpg", alt: "The white church" },
-              { src: "http://img.b2bpic.net/free-photo/vertical-low-angle-shot-old-brick-building-cloudy-sky_181624-7127.jpg", alt: "Vertical low angle shot of an old brick building" },
-              { src: "http://img.b2bpic.net/free-photo/gothic-church-interior-high-arched-windows-painted-vaults_169016-68622.jpg", alt: "Gothic church interior" },
-              { src: "http://img.b2bpic.net/free-photo/beautiful-church-background_23-2149285711.jpg", alt: "Beautiful church background" }
-            ]}
-            avatarText="Join our family"
           />
         </div>
 
@@ -60,12 +73,12 @@ export default function LandingPage() {
           <SplitAbout
             textboxLayout="split"
             useInvertedBackground={false}
-            title="Our Heart & Mission"
-            description="At Marco's Church, we strive to create a space where everyone feels welcomed and supported. Whether you're new to faith or looking for a home, we are here for you."
+            title={content.aboutTitle}
+            description={content.aboutDesc}
             bulletPoints={[
-              { title: "Community Focus", description: "Engaging with our neighbors through service and support." },
-              { title: "Spiritual Growth", description: "Learning and living according to our values." },
-              { title: "All Are Welcome", description: "We embrace diversity and love as our core mandate." }
+              { title: lang === "es" ? "Enfoque Comunitario" : "Community Focus", description: lang === "es" ? "Interactuando con nuestros vecinos." : "Engaging with our neighbors." },
+              { title: lang === "es" ? "Crecimiento Espiritual" : "Spiritual Growth", description: lang === "es" ? "Aprendiendo y viviendo nuestros valores." : "Living according to our values." },
+              { title: lang === "es" ? "Todos son Bienvenidos" : "All Are Welcome", description: lang === "es" ? "Aceptamos la diversidad." : "We embrace diversity." }
             ]}
             imageSrc="http://img.b2bpic.net/free-photo/interior-details-catholic-church-with-wooden-benches_169016-21658.jpg"
             mediaAnimation="slide-up"
@@ -77,12 +90,12 @@ export default function LandingPage() {
             textboxLayout="default"
             useInvertedBackground={true}
             features={[
-              { title: "Outreach & Service", description: "Helping those in need within our local community.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-paper-hands-with-puzzle-paper-heart_23-2148635166.jpg" },
-              { title: "Bible Studies", description: "Diving deeper into our faith through study.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-book-club_23-2150062132.jpg" },
-              { title: "Worship Arts", description: "Expressing our faith through music and song.", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-country-musicians-indoors_23-2151169655.jpg" }
+              { title: lang === "es" ? "Alcance y Servicio" : "Outreach & Service", description: "", imageSrc: "http://img.b2bpic.net/free-photo/top-view-paper-hands-with-puzzle-paper-heart_23-2148635166.jpg" },
+              { title: lang === "es" ? "Estudios Bíblicos" : "Bible Study", description: "", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-book-club_23-2150062132.jpg" },
+              { title: lang === "es" ? "Artes de Adoración" : "Worship Arts", description: "", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-country-musicians-indoors_23-2151169655.jpg" }
             ]}
-            title="Our Ministries"
-            description="Opportunities to serve, learn, and grow together."
+            title={content.featuresTitle}
+            description={content.featuresDesc}
           />
         </div>
 
@@ -91,20 +104,14 @@ export default function LandingPage() {
             animationType="slide-up"
             textboxLayout="split"
             useInvertedBackground={false}
-            testimonials={[
-              { id: "1", name: "John Doe", role: "Member", company: "Community Church", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/beautiful-senior-woman-portrait-posing-couch_23-2148891724.jpg" },
-              { id: "2", name: "Jane Smith", role: "Volunteer", company: "Community Church", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/attractive-young-employee-with-stubble-stylish-haircut-standing-blank-wall_273609-12358.jpg" },
-              { id: "3", name: "Michael Brown", role: "Member", company: "Community Church", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/side-view-young-people-praying-outdoors_23-2150870090.jpg" },
-              { id: "4", name: "Sarah Wilson", role: "Teacher", company: "Community Church", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/people-meeting-community-center_23-2149155356.jpg" },
-              { id: "5", name: "Robert Miller", role: "Member", company: "Community Church", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/elder-group-friends-partying_23-2150285559.jpg" }
-            ]}
+            testimonials={[]}
             kpiItems={[
-              { value: "100+", label: "Community Members" },
-              { value: "20+", label: "Ministries" },
-              { value: "5+", label: "Years Active" }
+              { value: "100+", label: lang === "es" ? "Miembros" : "Members" },
+              { value: "20+", label: lang === "es" ? "Ministerios" : "Ministries" },
+              { value: "Active", label: lang === "es" ? "Activa" : "Active" }
             ]}
-            title="Community Voices"
-            description="What our members have to say about their experience here."
+            title={content.testimonialsTitle}
+            description={content.testimonialsDesc}
           />
         </div>
 
@@ -112,10 +119,10 @@ export default function LandingPage() {
           <FaqSplitText
             useInvertedBackground={true}
             faqs={[
-              { id: "1", title: "When are service times?", content: "Our main services are held every Sunday morning at 10 AM." },
-              { id: "2", title: "Do I need to sign up?", content: "No sign-up is required, all are welcome to attend." }
+              { id: "1", title: lang === "es" ? "¿Cuándo son los servicios?" : "When are services?", content: lang === "es" ? "Todos los domingos a las 10:00 AM." : "Every Sunday at 10:00 AM." },
+              { id: "2", title: lang === "es" ? "¿Necesito registrarme?" : "Do I need to sign up?", content: lang === "es" ? "No se requiere registro." : "No registration required." }
             ]}
-            sideTitle="Frequently Asked"
+            sideTitle={content.faqTitle}
             faqsAnimation="slide-up"
           />
         </div>
@@ -124,23 +131,22 @@ export default function LandingPage() {
           <ContactCTA
             useInvertedBackground={true}
             background={{ variant: "plain" }}
-            tag="Get In Touch"
-            title="Visit Us Today"
-            description="Location: 123 Faith Avenue, City | Phone: (555) 123-4567 - We look forward to meeting you!"
-            buttons={[{ text: "Call Now", href: "tel:5551234567" }]}
+            tag={lang === "es" ? "Contacto" : "Contact"}
+            title={content.contactTitle}
+            description={content.contactDesc}
+            buttons={[{ text: lang === "es" ? "Llama ahora" : "Call Now", href: "tel:5551234567" }]}
           />
         </div>
 
         <div id="footer" data-section="footer">
           <FooterBaseCard
-            logoText="Marco's Church"
+            logoText="Iglesia"
             columns={[
-              { title: "Links", items: [{ label: "About", href: "#about" }, { label: "Contact", href: "#contact" }] },
-              { title: "Legal", items: [{ label: "Privacy", href: "#" }] }
+              { title: lang === "es" ? "Enlaces" : "Links", items: [{ label: "About", href: "#about" }, { label: "Contact", href: "#contact" }] }
             ]}
           />
         </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}