"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
import { Award, Calendar, CheckSquare, Search, Share2, Sparkles, FolderKanban, BellDot, BarChart3 } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="hover-magnetic"
        defaultTextAnimation="entrance-slide"
        borderRadius="soft"
        contentWidth="smallMedium"
        sizing="largeSizeMediumTitles"
        background="none"
        cardStyle="subtle-shadow"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="glass"
        headingFontWeight="light"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleFullscreen
      navItems={[
        {
          name: "Home",          id: "/"},
        {
          name: "Plan",          id: "/plan"},
        {
          name: "Settings",          id: "/settings"},
        {
          name: "Account",          id: "/account"},
      ]}
      logoSrc="http://img.b2bpic.net/free-vector/education-business-logo-template-branding-design-vector-learning-institution-text_53876-151216.jpg"
      logoAlt="StudyBalance Logo"
      brandName="StudyBalance"
      bottomLeftText="💰 Streaks"
      bottomRightText="❓ Help"
      button={{
        text: "Log In",        href: "/account"}}
    />
  </div>

  <div id="pricing-plans" data-section="pricing-plans">
      <PricingCardNine
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      plans={[
        {
          id: "free",          title: "Free",          price: "$0",          period: "per month",          features: [
            "Organized Notes",            "To-Do List",            "3 Free Study Plans",            "20 Free Revision Materials"],
          button: {
            text: "Get Started Free",            href: "/account"},
          imageSrc: "http://img.b2bpic.net/free-photo/top-view-desk-concept-with-copy-space_23-2148459770.jpg",          imageAlt: "Free Plan"},
        {
          id: "premium",          title: "Premium",          price: "$9.99",          period: "per month",          features: [
            "Unlimited Organized Notes",            "5 To-Do Lists",            "20 Study Plans",            "Unlimited Revision Materials",            "No Ads"],
          button: {
            text: "Go Premium",            href: "/account"},
          imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-credit-card-black-background_23-2148317907.jpg",          imageAlt: "Premium Plan"},
        {
          id: "unlimited",          title: "Unlimited",          price: "$19.99",          period: "per month",          features: [
            "No Ads",            "Unlimited Organized Notes",            "Unlimited To-Do Lists",            "Unlimited Revision Materials",            "Unlimited Study Plans"],
          button: {
            text: "Unlock Unlimited",            href: "/account"},
          imageSrc: "http://img.b2bpic.net/free-photo/flay-lay-back-school-elements-with-clipboard-template_23-2148198132.jpg",          imageAlt: "Unlimited Plan"},
      ]}
      title="StudyBalance Plans"
      description="Choose the perfect plan to boost your academic performance. From free essentials to unlimited power, we have you covered."
    />
  </div>

  <div id="plan-benefits" data-section="plan-benefits">
      <FeatureCardTen
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      features={[
        {
          title: "Organized Notes",          description: "Keep all your study materials neatly categorized and easily accessible.",          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/city-committed-education-collage-concept_23-2150062193.jpg",            imageAlt: "Organized Notes"},
          items: [
            {
              icon: FolderKanban,
              text: "Categorize by subject"},
            {
              icon: Search,
              text: "Quick search functionality"},
            {
              icon: Share2,
              text: "Share with study groups"},
          ],
          reverse: false
        },
        {
          title: "Effective To-Do Lists",          description: "Manage your tasks and deadlines efficiently to stay on track with your studies.",          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/colorful-overloaded-bullet-journal_23-2150248156.jpg",            imageAlt: "To-Do Lists"},
          items: [
            {
              icon: CheckSquare,
              text: "Track assignments"},
            {
              icon: Calendar,
              text: "Set due dates"},
            {
              icon: BellDot,
              text: "Receive reminders"},
          ],
          reverse: true
        },
        {
          title: "Custom Study Plans",          description: "Tailor your study schedules to fit your unique learning style and academic demands.",          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/view-network-concept-with-colorful-dots_23-2148999156.jpg",            imageAlt: "Custom Study Plans"},
          items: [
            {
              icon: Sparkles,
              text: "Personalized curriculum"},
            {
              icon: BarChart3,
              text: "Progress tracking"},
            {
              icon: Award,
              text: "Achievement badges"},
          ],
          reverse: false
        }
      ]}
      title="Benefits of a StudyBalance Plan"
      description="Discover how StudyBalance plans empower you to streamline your studies, boost productivity, and achieve better results."
    />
  </div>

  <div id="main-footer" data-section="main-footer">
      <FooterBaseReveal
      logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7zpdi0"
      logoAlt="StudyBalance Logo"
      logoText="StudyBalance"
      columns={[
        {
          title: "Platform",          items: [
            {
              label: "Home",              href: "/"},
            {
              label: "Plan",              href: "/plan"},
            {
              label: "Settings",              href: "/settings"},
            {
              label: "Account",              href: "/account"},
          ],
        },
        {
          title: "Resources",          items: [
            {
              label: "Upload Materials",              href: "/upload"},
            {
              label: "Educational Games",              href: "/#about-games"},
            {
              label: "Help & Support",              href: "#"},
            {
              label: "FAQ",              href: "/#faq-general"},
          ],
        },
        {
          title: "Company",          items: [
            {
              label: "About Us",              href: "#"},
            {
              label: "Careers",              href: "#"},
            {
              label: "Privacy Policy",              href: "#"},
            {
              label: "Terms of Service",              href: "#"},
          ],
        },
      ]}
      copyrightText="© 2024 StudyBalance. All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
