"use client";

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

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="expand-hover"
        defaultTextAnimation="background-highlight"
        borderRadius="soft"
        contentWidth="small"
        sizing="mediumLargeSizeLargeTitles"
        background="circleGradient"
        cardStyle="solid"
        primaryButtonStyle="gradient"
        secondaryButtonStyle="glass"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleCentered
      navItems={[
        {
          name: "Home",
          id: "/",
        },
        {
          name: "Menu",
          id: "/menu",
        },
        {
          name: "Catering",
          id: "/catering",
        },
        {
          name: "About",
          id: "/about",
        },
        {
          name: "Careers",
          id: "/careers",
        },
        {
          name: "Contact",
          id: "/contact",
        },
      ]}
      brandName="Rooster Roo"
    />
  </div>

  <div id="careers-intro" data-section="careers-intro">
      <TextAbout
      useInvertedBackground={false}
      title="Join the Rooster Roo Family!"
    />
  </div>

  <div id="apply-now" data-section="apply-now">
      <ContactText
      useInvertedBackground={true}
      background={{
        variant: "plain",
      }}
      text="Explore our current job openings and take the first step towards joining a team that values hard work, passion, and community. We're always looking for friendly, dedicated team members to contribute to the Rooster Roo experience."
      buttons={[
        {
          text: "View Open Positions",
          href: "#",
        },
        {
          text: "Submit Resume",
          href: "#",
        },
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBase
      columns={[
        {
          title: "Navigation",
          items: [
            {
              label: "Home",
              href: "/",
            },
            {
              label: "Menu",
              href: "/menu",
            },
            {
              label: "Catering",
              href: "/catering",
            },
            {
              label: "About Us",
              href: "/about",
            },
            {
              label: "Careers",
              href: "/careers",
            },
            {
              label: "Contact",
              href: "/contact",
            },
          ],
        },
        {
          title: "Services",
          items: [
            {
              label: "Order Online",
              href: "/menu#online-order",
            },
            {
              label: "Catering Options",
              href: "/catering#inquiry",
            },
            {
              label: "Reservations",
              href: "/contact#faqs",
            },
          ],
        },
        {
          title: "Legal",
          items: [
            {
              label: "Privacy Policy",
              href: "#",
            },
            {
              label: "Terms of Service",
              href: "#",
            },
          ],
        },
      ]}
      logoText="Rooster Roo"
      copyrightText="© 2024 Rooster Roo. All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
