"use client";

import ReactLenis from "lenis/react";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
import FooterCard from "@/components/sections/footer/FooterCard";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Instagram, Facebook, Linkedin } from "lucide-react";

export default function ReservationsPage() {
    return (
        <ThemeProvider
            defaultButtonVariant="icon-arrow"
            defaultTextAnimation="entrance-slide"
            borderRadius="rounded"
            contentWidth="medium"
            sizing="medium"
            background="none"
            cardStyle="solid"
            primaryButtonStyle="shadow"
            secondaryButtonStyle="solid"
            headingFontWeight="medium"
        >
            <ReactLenis root>
                <NavbarLayoutFloatingInline
                    navItems={[
                        { name: "Overview", id: "/" },
                        { name: "Gallery", id: "/gallery" },
                        { name: "Reservations", id: "/reservations" },
                        { name: "Contact", id: "/contact" },
                    ]}
                    brandName="FEDERICO"
                    button={{ text: "Book Table", href: "/reservations" }}
                />
                <ContactSplitForm
                    title="Reserve Your Table"
                    description="Select your date, time, and party size to confirm your reservation."
                    imageSrc="http://img.b2bpic.net/free-photo/view-table-arrangement-by-wedding-planner_23-2150167204.jpg"
                    imageAlt="Booking"
                    useInvertedBackground={false}
                    inputs={[
                        { name: "date", type: "date", placeholder: "Date" },
                        { name: "time", type: "time", placeholder: "Time" },
                        { name: "guests", type: "number", placeholder: "Guests" },
                    ]}
                    textarea={{ name: "requests", placeholder: "Any special requests?" }}
                    buttonText="Submit Booking"
                />
                <FooterCard
                    logoText="FEDERICO"
                    copyrightText="© 2025 FEDERICO Restaurant. 1 Rue du Lac de Constance, Tunis."
                    socialLinks={[
                        { icon: Instagram, href: "#", ariaLabel: "Instagram" },
                        { icon: Facebook, href: "#", ariaLabel: "Facebook" },
                        { icon: Linkedin, href: "#", ariaLabel: "LinkedIn" },
                    ]}
                />
            </ReactLenis>
        </ThemeProvider>
    );
}