"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ContactText from '@/components/sections/contact/ContactText';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';

export default function LocationPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
        defaultTextAnimation="entrance-slide"
        borderRadius="pill"
        contentWidth="compact"
        sizing="medium"
        background="circleGradient"
        cardStyle="layered-gradient"
        primaryButtonStyle="primary-glow"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="extrabold"
    >
      <ReactLenis root>
        <div id="nav" data-section="nav">
          <NavbarStyleCentered
            navItems={[
              {
                name: "Home",                id: "/"},
              {
                name: "About",                id: "#about"},
              {
                name: "Services",                id: "#services"},
              {
                name: "Reviews",                id: "#reviews"},
              {
                name: "Location",                id: "/location"},
              {
                name: "Contact",                id: "#contact"},
            ]}
            button={{
              text: "Book Now",              href: "#contact"}}
            brandName="Dicky's Barber"
          />
        </div>

        <div id="location-content" data-section="location-content">
          <ContactText
            useInvertedBackground={false}
            background={{
              variant: "plain"}}
            text="Find Dicky's Barber at:\n241 Arundel Dr, Belhar 19, Cape Town, 7493"
            buttons={[
              {
                text: "Call Us: 068 282 1189",                href: "tel:+27682821189"},
              {
                text: "Get Directions on Google Maps",                href: "https://www.google.com/maps/dir/?api=1&destination=241 Arundel Dr, Belhar 19, Cape Town, 7493"},
            ]}
          />
        </div>

        <div id="footer" data-section="footer">
          <FooterBaseCard
            logoText="Dicky's Barber"
            columns={[
              {
                title: "Company",                items: [
                  {
                    label: "About Us",                    href: "#about"},
                  {
                    label: "Services",                    href: "#services"},
                  {
                    label: "Reviews",                    href: "#reviews"},
                ],
              },
              {
                title: "Support",                items: [
                  {
                    label: "FAQ",                    href: "#faq"},
                  {
                    label: "Contact Us",                    href: "#contact"},
                  {
                    label: "Location",                    href: "/location"},
                ],
              },
              {
                title: "Legal",                items: [
                  {
                    label: "Privacy Policy",                    href: "#"},
                  {
                    label: "Terms of Service",                    href: "#"},
                ],
              },
            ]}
            copyrightText="© 2024 Dicky's Barber. All rights reserved."
          />
        </div>
      </ReactLenis>
    </ThemeProvider>
  );
}