Update src/app/page.tsx

Add src/app/apartment/[id]/page.tsx
Merge version_1 into main
2026-03-05 17:08:10 +00:00 · 2026-03-05 17:08:09 +00:00 · 2026-03-05 16:57:36 +00:00 · 2026-03-05 16:55:27 +00:00 · 2026-03-05 16:53:10 +00:00 · 2026-03-05 16:37:22 +00:00
2 changed files with 228 additions and 3 deletions
--- a/src/app/apartment/[id]/page.tsx
+++ b/src/app/apartment/[id]/page.tsx
@@ -0,0 +1,225 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
+import HeroBillboardRotatedCarousel from "@/components/sections/hero/HeroBillboardRotatedCarousel";
+import MediaAbout from "@/components/sections/about/MediaAbout";
+import FeatureBorderGlow from "@/components/sections/feature/featureBorderGlow/FeatureBorderGlow";
+import ProductCardFour from "@/components/sections/product/ProductCardFour";
+import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
+import FooterCard from "@/components/sections/footer/FooterCard";
+import { MapPin, Wifi, Utensils, Waves, Wind, Tv, Instagram, Facebook, Phone, Home, DoorOpen, Sofa, Droplets } from "lucide-react";
+import { useParams } from "next/navigation";
+
+// Sample apartment data - in a real app, this would come from a database or API
+const apartmentDatabase: Record<string, any> = {
+  "apt1": {
+    name: "Largo Sant'Antonio",    price: "70 eur/noc",    description: "Spacious and fully equipped apartment in the heart of Agrigento",    fullDescription: "Our flagship apartment Largo Sant'Antonio offers a perfect blend of comfort and authentic Sicilian charm. Located in the historic center of Agrigento, this apartment is ideal for families and small groups. The fully equipped modern kitchen, comfortable bedrooms, and bright living areas make it the perfect home away from home.",    capacity: "5 osób",    features: "W pełni wyposażony",    gallery: [
+      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772729829229-jo0kwpyi.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772728322270-i8b4polo.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772728631816-9afwb5o6.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772727637321-4bj5mbbw.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772727548071-bca1pdj2.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772727586302-s4wcrms6.jpg"],
+    amenities: [
+      { icon: Wifi, title: "High-Speed WiFi", description: "Stay connected with fast internet throughout the apartment" },
+      { icon: Utensils, title: "Fully Equipped Kitchen", description: "Modern appliances and cookware for your culinary needs" },
+      { icon: Waves, title: "Beach Access", description: "Walking distance to beautiful Sicilian beaches" },
+      { icon: Wind, title: "Air Conditioning", description: "Stay cool during hot Mediterranean summers" },
+      { icon: Tv, title: "Smart TV", description: "Entertainment system with streaming services" },
+      { icon: Home, title: "Spacious Living Area", description: "Comfortable common spaces for relaxation" },
+    ],
+  },
+  "apt2": {
+    name: "Porto Empedocle",    price: "70 eur/noc",    description: "Premium apartment with stunning sea views",    fullDescription: "Porto Empedocle is our premium offering, featuring breathtaking views of the Mediterranean Sea. This carefully designed apartment combines modern comfort with traditional Sicilian aesthetics. Perfect for couples or small families seeking a romantic getaway with beach proximity.",    capacity: "4 osoby",    features: "blisko plaży",    gallery: [
+      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772729841141-o33h2wus.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772728322270-i8b4polo.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772728631816-9afwb5o6.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772727637321-4bj5mbbw.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772727548071-bca1pdj2.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772728337634-ga6soch3.jpg"],
+    amenities: [
+      { icon: Waves, title: "Sea View Balcony", description: "Private balcony overlooking the Mediterranean" },
+      { icon: Utensils, title: "Chef's Kitchen", description: "Premium appliances and complete kitchenware" },
+      { icon: Wifi, title: "High-Speed WiFi", description: "Fast and reliable internet connection" },
+      { icon: Droplets, title: "Luxury Bathroom", description: "Modern bathroom with premium amenities" },
+      { icon: Wind, title: "Air Conditioning", description: "Climate control for year-round comfort" },
+      { icon: Sofa, title: "Premium Furnishings", description: "Comfortable and stylish furniture" },
+    ],
+  },
+  "apt3": {
+    name: "Via Garibaldi",    price: "50 eur/noc",    description: "Charming apartment in the heart of Agrigento",    fullDescription: "Via Garibaldi offers a budget-friendly option without compromising on comfort. Located in the bustling center of Agrigento, this cozy apartment is surrounded by historic sites, restaurants, and local culture. Ideal for budget-conscious travelers who want to experience authentic Sicilian living.",    capacity: "4 osoby",    features: "W centrum Agrigento",    gallery: [
+      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772729717575-eicb2kqb.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772728322270-i8b4polo.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772728631816-9afwb5o6.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772727637321-4bj5mbbw.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772728337634-ga6soch3.jpg",      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772727586302-s4wcrms6.jpg"],
+    amenities: [
+      { icon: Home, title: "Cozy Living Space", description: "Comfortable and well-designed interior" },
+      { icon: Utensils, title: "Complete Kitchen", description: "All essentials for home cooking" },
+      { icon: Wifi, title: "WiFi Internet", description: "Stay connected during your stay" },
+      { icon: Wind, title: "Air Conditioning", description: "Cool comfort in warm weather" },
+      { icon: DoorOpen, title: "Central Location", description: "Walking distance to attractions and dining" },
+      { icon: Tv, title: "Entertainment", description: "TV with local and international channels" },
+    ],
+  },
+};
+
+const navItems = [
+  { name: "Apartamenty", id: "/" },
+  { name: "O nas", id: "about" },
+  { name: "Oferta", id: "offer" },
+  { name: "Atrakcje", id: "attractions" },
+  { name: "Kontakt", id: "contact" },
+];
+
+const socialLinks = [
+  { icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
+  { icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" },
+  { icon: Phone, href: "tel:+48123456789", ariaLabel: "Phone" },
+];
+
+export default function ApartmentPage() {
+  const params = useParams();
+  const apartmentId = params.id as string;
+  const apartment = apartmentDatabase[apartmentId];
+
+  if (!apartment) {
+    return (
+      <ThemeProvider
+        defaultButtonVariant="text-stagger"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="pill"
+        contentWidth="smallMedium"
+        sizing="medium"
+        background="aurora"
+        cardStyle="glass-depth"
+        primaryButtonStyle="primary-glow"
+        secondaryButtonStyle="solid"
+        headingFontWeight="light"
+      >
+        <div id="nav" data-section="nav">
+          <NavbarStyleApple brandName="Buongiorno Sicily" navItems={navItems} />
+        </div>
+        <div className="flex items-center justify-center min-h-screen">
+          <p className="text-2xl">Apartment not found</p>
+        </div>
+      </ThemeProvider>
+    );
+  }
+
+  const galleryProducts = apartment.gallery.map((src: string, idx: number) => ({
+    id: `gallery-${idx}`,
+    name: `${apartment.name} - Photo ${idx + 1}`,
+    price: apartment.price,
+    variant: apartment.features,
+    imageSrc: src,
+    imageAlt: `${apartment.name} - Photo ${idx + 1}`,
+  }));
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="text-stagger"
+      defaultTextAnimation="reveal-blur"
+      borderRadius="pill"
+      contentWidth="smallMedium"
+      sizing="medium"
+      background="aurora"
+      cardStyle="glass-depth"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="solid"
+      headingFontWeight="light"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple brandName="Buongiorno Sicily" navItems={navItems} />
+      </div>
+
+      <div id="hero" data-section="hero">
+        <HeroBillboardRotatedCarousel
+          title={apartment.name}
+          description={apartment.fullDescription}
+          tag="Apartment Details"
+          tagIcon={MapPin}
+          tagAnimation="slide-up"
+          buttons={[
+            { text: "Back to Apartments", href: "/" },
+            { text: "Book Now", href: "#contact" },
+          ]}
+          buttonAnimation="slide-up"
+          carouselItems={apartment.gallery.map((src: string, idx: number) => ({
+            id: `slide-${idx}`,
+            imageSrc: src,
+            imageAlt: `${apartment.name} - Image ${idx + 1}`,
+          }))}
+          autoPlay={true}
+          autoPlayInterval={5000}
+          background={{ variant: "radial-gradient" }}
+        />
+      </div>
+
+      <div id="about" data-section="about">
+        <MediaAbout
+          title={apartment.name}
+          description={apartment.fullDescription}
+          tag="Details"
+          tagIcon={Home}
+          tagAnimation="slide-up"
+          buttons={[{ text: "View Gallery", href: "#gallery" }]}
+          imageSrc={apartment.gallery[0]}
+          imageAlt={apartment.name}
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="gallery" data-section="gallery">
+        <ProductCardFour
+          title="Photo Gallery"
+          description="Explore our apartment through these beautiful photos"
+          tag="Gallery"
+          tagIcon={MapPin}
+          tagAnimation="slide-up"
+          buttons={[{ text: "Reserve Now", href: "#contact" }]}
+          textboxLayout="default"
+          animationType="slide-up"
+          useInvertedBackground={true}
+          gridVariant="three-columns-all-equal-width"
+          carouselMode="buttons"
+          products={galleryProducts}
+        />
+      </div>
+
+      <div id="offer" data-section="offer">
+        <FeatureBorderGlow
+          title="Amenities & Features"
+          description={`Everything you need for a comfortable stay at ${apartment.name}`}
+          tag="What's Included"
+          tagIcon={Home}
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          animationType="slide-up"
+          useInvertedBackground={false}
+          features={apartment.amenities}
+        />
+      </div>
+
+      <div id="contact" data-section="contact">
+        <ContactSplitForm
+          title="Make Your Reservation"
+          description={`Ready to book ${apartment.name}? Contact us today to reserve your dates. Our team will help you with availability, pricing, and any special requests you may have.`}
+          inputs={[
+            {
+              name: "name",              type: "text",              placeholder: "Your name",              required: true,
+            },
+            {
+              name: "email",              type: "email",              placeholder: "Your email",              required: true,
+            },
+          ]}
+          textarea={{
+            name: "message",            placeholder: "Tell us your dates and special requests...",            rows: 5,
+            required: true,
+          }}
+          useInvertedBackground={true}
+          imageSrc={apartment.gallery[1] || apartment.gallery[0]}
+          imageAlt="Booking reservation"
+          mediaAnimation="slide-up"
+          mediaPosition="right"
+          buttonText="Send Booking Request"
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterCard
+          logoText="Buongiorno Sicily"
+          copyrightText="© 2025 Buongiorno Sicily. All rights reserved."
+          socialLinks={socialLinks}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -37,11 +37,11 @@ const heroCarouselItems = [

 const apartmentProducts = [
  {
-    id: "apt1",    name: "Largo Sant’Antonio",    price: "od 70 eur/noc",    variant: "5 osób • W pełni wyposażony",    imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772729829229-jo0kwpyi.jpg",    imageAlt: "Classic apartment"},
+    id: "apt1",    name: "Largo Sant'Antonio",    price: "od 70 eur/noc",    variant: "5 osób • W pełni wyposażony",    imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772729829229-jo0kwpyi.jpg",    imageAlt: "Classic apartment",    onProductClick: () => window.location.href = '/apartment/apt1'},
  {
-    id: "apt2",    name: "Porto Empedocle ",    price: "od 70 eur/noc",    variant: "4 osoby • blisko plaży",    imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772729841141-o33h2wus.jpg",    imageAlt: "Premium apartment with sea view"},
+    id: "apt2",    name: "Porto Empedocle ",    price: "od 70 eur/noc",    variant: "4 osoby • blisko plaży",    imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772729841141-o33h2wus.jpg",    imageAlt: "Premium apartment with sea view",    onProductClick: () => window.location.href = '/apartment/apt2'},
  {
-    id: "apt3",    name: "Via Garibaldi",    price: "od 50 eur/noc",    variant: "4 osoby • W centrum Agrigento",    imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772729717575-eicb2kqb.jpg",    imageAlt: "Deluxe apartment with terrace"},
+    id: "apt3",    name: "Via Garibaldi",    price: "od 50 eur/noc",    variant: "4 osoby • W centrum Agrigento",    imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUmUSVZpEZXvuP6mzJyNvtL19A/uploaded-1772729717575-eicb2kqb.jpg",    imageAlt: "Deluxe apartment with terrace",    onProductClick: () => window.location.href = '/apartment/apt3'},
 ];

 const features = [
Author	SHA1	Message	Date
bender	08c5f07be3	Update src/app/page.tsx	2026-03-05 17:08:10 +00:00
bender	8d8b3b9090	Add src/app/apartment/[id]/page.tsx	2026-03-05 17:08:09 +00:00
bender	a0a312c7b0	Merge version_1 into main Merge version_1 into main	2026-03-05 16:57:36 +00:00
bender	36b251456f	Merge version_1 into main Merge version_1 into main	2026-03-05 16:55:27 +00:00
bender	795546ef27	Merge version_1 into main Merge version_1 into main	2026-03-05 16:53:10 +00:00
bender	8bf2336f3c	Merge version_1 into main Merge version_1 into main	2026-03-05 16:37:22 +00:00
bender	f82411b3ac	Merge version_1 into main Merge version_1 into main	2026-03-05 16:36:32 +00:00
bender	438c75fd54	Merge version_1 into main Merge version_1 into main	2026-03-05 16:20:46 +00:00
bender	21b9442a5b	Merge version_1 into main Merge version_1 into main	2026-03-05 16:20:05 +00:00
bender	36f47b4b99	Merge version_1 into main Merge version_1 into main	2026-03-04 21:57:39 +00:00