"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import FooterBase from "@/components/sections/footer/FooterBase";
import FeatureCardSeven from "@/components/sections/feature/FeatureCardSeven";

export default function BulletinEventsPage() {
  const navItems = [
    { name: "Home", id: "/" },
    { name: "Bulletin & Events", id: "/bulletin-and-events" },
    { name: "Ministries", id: "/ministries" },
  ];

  return (
    <ThemeProvider defaultButtonVariant="icon-arrow" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="none" cardStyle="glass-elevated" primaryButtonStyle="shadow" secondaryButtonStyle="solid" headingFontWeight="medium">
      <ReactLenis root>
        <NavbarLayoutFloatingInline navItems={navItems} button={{ text: "Book", href: "/contact" }} />
        <main className="pt-24">
          <FeatureCardSeven
            title="Upcoming Events"
            description="Join us for our community gatherings and spiritual growth opportunities."
            features={[
              { title: "Sunday Mass", description: "Weekly community worship at 10:00 AM.", imageSrc: "https://images.unsplash.com/photo-1542816417-0983c9c9ad53?w=800&h=600&fit=crop&_wi=1" },
              { title: "Youth Bible Study", description: "Engaging sessions for teens every Wednesday.", imageSrc: "https://images.unsplash.com/photo-1542816417-0983c9c9ad53?w=800&h=600&fit=crop&_wi=2" }
            ]}
            animationType="slide-up"
            textboxLayout="default"
            useInvertedBackground={false}
          />
        </main>
        <FooterBase
          logoText="Coach"
          columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]}
        />
      </ReactLenis>
    </ThemeProvider>
  );
}