Update src/app/page.tsx

Merge version_2 into main

src/app/layout.tsx

@@ -6,43 +6,26 @@ import { ServiceWrapper } from "@/components/ServiceWrapper";
 import Tag from "@/tag/Tag";
 
 const mulish = Mulish({
-  variable: "--font-mulish",
-  subsets: ["latin"],
+  variable: "--font-mulish",  subsets: ["latin"],
 });
 
 const inter = Inter({
-  variable: "--font-inter",
-  subsets: ["latin"],
+  variable: "--font-inter",  subsets: ["latin"],
 });
 
 export const metadata: Metadata = {
-  title: "Kalkan Villa Rentals - Lüks Villa Kiralama",
-  description: "Kalkan'da özel havuzlu ve deniz manzaralı lüks villalar kiralayın. 50+ villa, güvenli ödeme, 24/7 destek. Akdeniz tatili için ideal seçim.",
-  keywords: "Kalkan villa, villa kiralama, lüks konak, Türkiye deniz kenarı, tatil evi",
-  metadataBase: new URL("https://kalkanvillarentals.com"),
+  title: "Kalkan Villa Rentals - Lüks Villa Kiralama",  description: "Kalkan'da özel havuzlu ve deniz manzaralı lüks villalar kiralayın. 50+ villa, güvenli ödeme, 24/7 destek. Akdeniz tatili için ideal seçim.",  keywords: "Kalkan villa, villa kiralama, lüks konak, Türkiye deniz kenarı, tatil evi",  metadataBase: new URL("https://kalkanvillarentals.com"),
   alternates: {
-    canonical: "https://kalkanvillarentals.com",
-  },
+    canonical: "https://kalkanvillarentals.com"},
   openGraph: {
-    title: "Kalkan Villa Rentals - Akdeniz'in En Seçkin Tatil Noktası",
-    description: "Kalkan'da konumlanan 50+ lüks villanın keyfini çıkartın. Özel havuz, deniz manzarası ve mükemmel hizmet.",
-    url: "https://kalkanvillarentals.com",
-    siteName: "Kalkan Villa Rentals",
-    type: "website",
-    images: [
+    title: "Kalkan Villa Rentals - Akdeniz'in En Seçkin Tatil Noktası",    description: "Kalkan'da konumlanan 50+ lüks villanın keyfini çıkartın. Özel havuz, deniz manzarası ve mükemmel hizmet.",    url: "https://kalkanvillarentals.com",    siteName: "Kalkan Villa Rentals",    type: "website",    images: [
       {
-        url: "http://img.b2bpic.net/free-photo/scenic-view-sandy-beach-beach-with-sun-beds-umbrellas-open-against-sea-mountains-hotel-resort-tekirova-kemer-turkey_146671-18880.jpg",
-        alt: "Kalkan Lüksüs Villa - Deniz Manzarası",
-      },
+        url: "http://img.b2bpic.net/free-photo/scenic-view-sandy-beach-beach-with-sun-beds-umbrellas-open-against-sea-mountains-hotel-resort-tekirova-kemer-turkey_146671-18880.jpg",        alt: "Kalkan Lüksüs Villa - Deniz Manzarası"},
     ],
   },
   twitter: {
-    card: "summary_large_image",
-    title: "Kalkan Villa Rentals - Lüks Konak Tatili",
-    description: "Akdeniz'in en güzel kıyısında villa tatili. Özel havuz, deniz manzarası, unlimited pleasure.",
-    images: [
-      "http://img.b2bpic.net/free-photo/scenic-view-sandy-beach-beach-with-sun-beds-umbrellas-open-against-sea-mountains-hotel-resort-tekirova-kemer-turkey_146671-18880.jpg",
-    ],
+    card: "summary_large_image",    title: "Kalkan Villa Rentals - Lüks Konak Tatili",    description: "Akdeniz'in en güzel kıyısında villa tatili. Özel havuz, deniz manzarası, unlimited pleasure.",    images: [
+      "http://img.b2bpic.net/free-photo/scenic-view-sandy-beach-beach-with-sun-beds-umbrellas-open-against-sea-mountains-hotel-resort-tekirova-kemer-turkey_146671-18880.jpg"],
   },
   robots: {
     index: true,
@@ -1434,4 +1417,4 @@ export default function RootLayout({
       </ServiceWrapper>
     </html>
   );
-}
+}

src/app/page.tsx

@@ -11,8 +11,11 @@ import FaqSplitText from "@/components/sections/faq/FaqSplitText";
 import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
 import FooterBase from "@/components/sections/footer/FooterBase";
 import { Home, Users, Star, Globe } from "lucide-react";
+import { useState } from "react";
 
 export default function HomePage() {
+  const [selectedVillaId, setSelectedVillaId] = useState<string | null>(null);
+
   const navItems = [
     { name: "Anasayfa", id: "home" },
     { name: "Villalar", id: "villas" },
@@ -22,14 +25,12 @@ export default function HomePage() {
   ];
 
   const navButton = {
-    text: "Rezervasyon Yap",
-    href: "/villas",
+    text: "Rezervasyon Yap",    href: "/villas"
   };
 
   const footerColumns = [
     {
-      title: "Villalar",
-      items: [
+      title: "Villalar",      items: [
         { label: "Tüm Villalar", href: "/villas" },
         { label: "Öne Çıkanlar", href: "#featured-villas" },
         { label: "Kalkan Center", href: "/villas" },
@@ -37,8 +38,7 @@ export default function HomePage() {
       ],
     },
     {
-      title: "Şirket",
-      items: [
+      title: "Şirket",      items: [
         { label: "Hakkımızda", href: "/about" },
         { label: "İletişim", href: "/contact" },
         { label: "Sık Sorulan Sorular", href: "/faq" },
@@ -46,8 +46,7 @@ export default function HomePage() {
       ],
     },
     {
-      title: "Yasal",
-      items: [
+      title: "Yasal",      items: [
         { label: "Gizlilik Politikası", href: "#" },
         { label: "Kullanım Şartları", href: "#" },
         { label: "İptal Politikası", href: "#" },
@@ -56,6 +55,15 @@ export default function HomePage() {
     },
   ];
 
+  const handleVillaClick = (villaId: string) => {
+    setSelectedVillaId(villaId);
+    // Scroll to contact section to show reservation activation
+    const contactSection = document.getElementById("contact");
+    if (contactSection) {
+      contactSection.scrollIntoView({ behavior: "smooth" });
+    }
+  };
+
   return (
     <ThemeProvider
       defaultButtonVariant="bounce-effect"
@@ -87,7 +95,7 @@ export default function HomePage() {
           imageSrc="http://img.b2bpic.net/free-photo/scenic-view-sandy-beach-beach-with-sun-beds-umbrellas-open-against-sea-mountains-hotel-resort-tekirova-kemer-turkey_146671-18880.jpg?_wi=1"
           imageAlt="Kalkan'da Lüksüs Villa ve Deniz Manzarası"
           buttons={[
-            { text: "Villalara Göz At", href: "/villas" },
+            { text: "Şimdi Rezervasyon Yap", href: "/villas" },
             { text: "Daha Fazla Bilgi", href: "/about" },
           ]}
           buttonAnimation="slide-up"
@@ -102,25 +110,13 @@ export default function HomePage() {
           tagAnimation="slide-up"
           products={[
             {
-              id: "villa-001",
-              name: "Azure Dreams Villa",
-              price: "₺12.500 / gün",
-              imageSrc: "http://img.b2bpic.net/free-photo/luxury-poolside-experience-where-guests-bask-opulence-cabanas_1268-31113.jpg?_wi=1",
-              imageAlt: "Azure Dreams Villa - Özel Havuzlu Lüks Konak",
+              id: "villa-001",              name: "Azure Dreams Villa",              price: "₺12.500 / gün",              imageSrc: "http://img.b2bpic.net/free-photo/luxury-poolside-experience-where-guests-bask-opulence-cabanas_1268-31113.jpg?_wi=1",              imageAlt: "Azure Dreams Villa - Özel Havuzlu Lüks Konak",              onProductClick: () => handleVillaClick("villa-001"),
             },
             {
-              id: "villa-002",
-              name: "Mediterranean Pearl",
-              price: "₺15.000 / gün",
-              imageSrc: "http://img.b2bpic.net/free-photo/scenic-view-sandy-beach-beach-with-sun-beds-umbrellas-open-against-sea-mountains-hotel-resort-tekirova-kemer-turkey_146671-18877.jpg?_wi=1",
-              imageAlt: "Mediterranean Pearl - Sunset Terrace Villa",
+              id: "villa-002",              name: "Mediterranean Pearl",              price: "₺15.000 / gün",              imageSrc: "http://img.b2bpic.net/free-photo/scenic-view-sandy-beach-beach-with-sun-beds-umbrellas-open-against-sea-mountains-hotel-resort-tekirova-kemer-turkey_146671-18877.jpg?_wi=1",              imageAlt: "Mediterranean Pearl - Sunset Terrace Villa",              onProductClick: () => handleVillaClick("villa-002"),
             },
             {
-              id: "villa-003",
-              name: "Aegean Sunset",
-              price: "₺18.500 / gün",
-              imageSrc: "http://img.b2bpic.net/free-photo/modern-infinity-pool-perched-edge-cliff-overlooking-breathtaking-landscape_1268-31154.jpg?_wi=1",
-              imageAlt: "Aegean Sunset - Private Pool & Sea View",
+              id: "villa-003",              name: "Aegean Sunset",              price: "₺18.500 / gün",              imageSrc: "http://img.b2bpic.net/free-photo/modern-infinity-pool-perched-edge-cliff-overlooking-breathtaking-landscape_1268-31154.jpg?_wi=1",              imageAlt: "Aegean Sunset - Private Pool & Sea View",              onProductClick: () => handleVillaClick("villa-003"),
             },
           ]}
           gridVariant="three-columns-all-equal-width"
@@ -148,29 +144,13 @@ export default function HomePage() {
         <TestimonialCardTwelve
           testimonials={[
             {
-              id: "1",
-              name: "Sarah Johnson",
-              imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg?_wi=1",
-              imageAlt: "Sarah Johnson",
-            },
+              id: "1",              name: "Sarah Johnson",              imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg?_wi=1",              imageAlt: "Sarah Johnson"},
             {
-              id: "2",
-              name: "Michael Chen",
-              imageSrc: "http://img.b2bpic.net/free-photo/portrait-optimistic-businessman-formalwear_1262-3600.jpg?_wi=1",
-              imageAlt: "Michael Chen",
-            },
+              id: "2",              name: "Michael Chen",              imageSrc: "http://img.b2bpic.net/free-photo/portrait-optimistic-businessman-formalwear_1262-3600.jpg?_wi=1",              imageAlt: "Michael Chen"},
             {
-              id: "3",
-              name: "Emma Rodriguez",
-              imageSrc: "http://img.b2bpic.net/free-photo/happy-tourist-has-glad-expression-wears-fashionable-headgear_273609-25749.jpg?_wi=1",
-              imageAlt: "Emma Rodriguez",
-            },
+              id: "3",              name: "Emma Rodriguez",              imageSrc: "http://img.b2bpic.net/free-photo/happy-tourist-has-glad-expression-wears-fashionable-headgear_273609-25749.jpg?_wi=1",              imageAlt: "Emma Rodriguez"},
             {
-              id: "4",
-              name: "David Kim",
-              imageSrc: "http://img.b2bpic.net/free-photo/happy-young-surfer-snapback-looking-smiling-cheerfully-after-winning-sports-contest-surfers-holding-his-white-surfboard-his-arm_273609-1551.jpg?_wi=1",
-              imageAlt: "David Kim",
-            },
+              id: "4",              name: "David Kim",              imageSrc: "http://img.b2bpic.net/free-photo/happy-young-surfer-snapback-looking-smiling-cheerfully-after-winning-sports-contest-surfers-holding-his-white-surfboard-his-arm_273609-1551.jpg?_wi=1",              imageAlt: "David Kim"},
           ]}
           cardTitle="10.000'den fazla müşteri Kalkan Villa Rentals'ı tercih ediyor"
           cardTag="Müşteri Memnuniyeti"
@@ -185,35 +165,17 @@ export default function HomePage() {
           sideDescription="Kalkan villa kiralama hakkında bilmeniz gerekenler, rezervasyon sürecinden iptal politikasına kadar."
           faqs={[
             {
-              id: "1",
-              title: "Rezervasyon nasıl yapılır?",
-              content: "Web sitemizde villa seçin, tarihleri belirleyin ve fiyat tahmini alın. Daha sonra WhatsApp, telefon veya e-mail yoluyla rezervasyonunuzu tamamlayın. Ödeme yöntemi olarak havale, EFT veya Wise kullanabilirsiniz.",
-            },
+              id: "1",              title: "Rezervasyon nasıl yapılır?",              content: "Web sitemizde villa seçin, tarihleri belirleyin ve fiyat tahmini alın. Daha sonra WhatsApp, telefon veya e-mail yoluyla rezervasyonunuzu tamamlayın. Ödeme yöntemi olarak havale, EFT veya Wise kullanabilirsiniz."},
             {
-              id: "2",
-              title: "İptal politikası nedir?",
-              content: "Check-in tarihinden 30 gün öncesine kadar tam iade yapılır. 30-14 gün arası %50 iade, 14 gün içinde iade yapılmaz. Özel durumlarda lütfen iletişim kurunuz.",
-            },
+              id: "2",              title: "İptal politikası nedir?",              content: "Check-in tarihinden 30 gün öncesine kadar tam iade yapılır. 30-14 gün arası %50 iade, 14 gün içinde iade yapılmaz. Özel durumlarda lütfen iletişim kurunuz."},
             {
-              id: "3",
-              title: "Fiyata neler dâhil?",
-              content: "Günlük fiyata konaklama, temizlik, havuz bakım ve temel ekipmanlar dâhildir. Elektrik, su ve doğalgaz ücretleri ayrıca hesaplanır. Ek hizmetler (kook, halkı temizlik) ücretli sunulmaktadır.",
-            },
+              id: "3",              title: "Fiyata neler dâhil?",              content: "Günlük fiyata konaklama, temizlik, havuz bakım ve temel ekipmanlar dâhildir. Elektrik, su ve doğalgaz ücretleri ayrıca hesaplanır. Ek hizmetler (kook, halkı temizlik) ücretli sunulmaktadır."},
             {
-              id: "4",
-              title: "Çocuklara special ücret var mı?",
-              content: "3 yaşından küçük çocuklar konaklamada bahçıvanız, 3-12 yaş arası çocuklar için %20 indirim uygulanır. 12 yaş üstü misafirler tam fiyat ödenmektedir.",
-            },
+              id: "4",              title: "Çocuklara special ücret var mı?",              content: "3 yaşından küçük çocuklar konaklamada bahçıvanız, 3-12 yaş arası çocuklar için %20 indirim uygulanır. 12 yaş üstü misafirler tam fiyat ödenmektedir."},
             {
-              id: "5",
-              title: "Check-in saati ne zaman?",
-              content: "Standart check-in saati 15:00, check-out saati 11:00'dir. Erken check-in veya geç check-out için ücret tarifesine bakınız. Uygun olduğu durumlarda %25-50 indirimli ek saatler sunulur.",
-            },
+              id: "5",              title: "Check-in saati ne zaman?",              content: "Standart check-in saati 15:00, check-out saati 11:00'dir. Erken check-in veya geç check-out için ücret tarifesine bakınız. Uygun olduğu durumlarda %25-50 indirimli ek saatler sunulur."},
             {
-              id: "6",
-              title: "Pet (hayvan) getirilebilir mi?",
-              content: "Seçili villalarda evcil hayvanlar kabul edilir. Hayvan sahibi olan misafirlarımız, lütfen rezervasyon sırasında bilgi veriniz. Ek temizlik ücreti uygulanabilir.",
-            },
+              id: "6",              title: "Pet (hayvan) getirilebilir mi?",              content: "Seçili villalarda evcil hayvanlar kabul edilir. Hayvan sahibi olan misafirlarımız, lütfen rezervasyon sırasında bilgi veriniz. Ek temizlik ücreti uygulanabilir."},
           ]}
           faqsAnimation="slide-up"
           textPosition="left"
@@ -223,25 +185,26 @@ export default function HomePage() {
 
       <div id="contact" data-section="contact">
         <ContactSplitForm
-          title="Bizimle İletişime Geçin"
-          description="Kalkan villa kiralama hakkında sorularınız mı var? Bize e-mail gönderin veya doğrudan WhatsApp ile bağlantı kurun. 24 saat içinde yanıt alacaksınız."
+          title={selectedVillaId ? `${selectedVillaId} için Rezervasyon` : "Bizimle İletişime Geçin"}
+          description={selectedVillaId ? "Seçtiğiniz villa için reservasyon bilgilerini giriniz. 24 saat içinde sizinle iletişime geçeceğiz." : "Kalkan villa kiralama hakkında sorularınız mı var? Bize e-mail gönderin veya doğrudan WhatsApp ile bağlantı kurun. 24 saat içinde yanıt alacaksınız."}
           inputs={[
             { name: "name", type: "text", placeholder: "Adınız" },
             { name: "email", type: "email", placeholder: "E-mail Adresiniz" },
             { name: "phone", type: "tel", placeholder: "Telefon Numaranız (Opsiyonel)" },
           ]}
           textarea={{
-            name: "message",
-            placeholder: "Sorunuz veya talebiniz...",
-            rows: 5,
+            name: "message",            placeholder: selectedVillaId ? "Rezervasyon talebiniz ve sorularınız..." : "Sorunuz veya talebiniz...",            rows: 5,
           }}
           useInvertedBackground={false}
           imageSrc="http://img.b2bpic.net/free-photo/scenic-view-sandy-beach-beach-with-sun-beds-umbrellas-open-against-sea-mountains-hotel-resort-tekirova-kemer-turkey_146671-18880.jpg?_wi=2"
           imageAlt="Kalkan Villa Manzarası"
           mediaAnimation="slide-up"
           mediaPosition="right"
-          buttonText="Mesaj Gönder"
-          onSubmit={(data) => console.log("Form submitted:", data)}
+          buttonText={selectedVillaId ? "Rezervasyon Talebi Gönder" : "Mesaj Gönder"}
+          onSubmit={(data) => {
+            console.log("Form submitted:", { ...data, selectedVilla: selectedVillaId });
+            setSelectedVillaId(null);
+          }}
         />
       </div>
 
@@ -255,4 +218,4 @@ export default function HomePage() {
       </div>
     </ThemeProvider>
   );
-}
+}