"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import TestimonialCardTen from "@/components/sections/testimonial/TestimonialCardTen";
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
import FeatureCardTwentySix from "@/components/sections/feature/FeatureCardTwentySix";
import FooterSimple from "@/components/sections/footer/FooterSimple";
import Link from "next/link";
import { Eye, TrendingUp, Target, Award, Share2, Move } from "lucide-react";

export default function AchievementsPage() {
  const navItems = [
    { name: "Goals", id: "goals" },
    { name: "Achievements", id: "achievements" },
  ];

  const footerColumns = [
    {
      title: "Product",
      items: [
        { label: "Dashboard", href: "/dashboard" },
        { label: "Features", href: "#features" },
        { label: "Pricing", href: "#" },
        { label: "Export", href: "#" },
      ],
    },
    {
      title: "Company",
      items: [
        { label: "About Us", href: "#" },
        { label: "Blog", href: "#" },
        { label: "Careers", href: "#" },
        { label: "Contact", href: "#contact" },
      ],
    },
    {
      title: "Legal",
      items: [
        { label: "Privacy Policy", href: "#" },
        { label: "Terms of Service", href: "#" },
        { label: "Cookie Policy", href: "#" },
        { label: "Security", href: "#" },
      ],
    },
    {
      title: "Connect",
      items: [
        { label: "Twitter", href: "https://twitter.com" },
        { label: "LinkedIn", href: "https://linkedin.com" },
        { label: "GitHub", href: "https://github.com" },
        { label: "Discord", href: "https://discord.com" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="compact"
      sizing="mediumLargeSizeLargeTitles"
      background="grid"
      cardStyle="solid"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={navItems}
          brandName="Trackfolio"
          bottomLeftText="Track Your Journey"
          bottomRightText="hello@trackfolio.io"
        />
      </div>

      <div id="achievements-testimonials" data-section="achievements-testimonials">
        <TestimonialCardTen
          title="Achievements & Success Stories"
          description="Discover how our users have achieved remarkable milestones and built impressive portfolios with Trackfolio."
          testimonials={[
            {
              id: "1",
              title: "Landed Dream Job",
              quote: "I tracked all my projects and achievements in Trackfolio. When it came time to interview, I had everything organized and ready to showcase. Got the job!",
              name: "Jessica Thompson",
              role: "Computer Science Student",
              imageSrc: "http://img.b2bpic.net/free-photo/business-lady-looking-copyspace-with-interest_1262-2957.jpg?_wi=4",
              imageAlt: "student woman professional portrait",
            },
            {
              id: "2",
              title: "Portfolio Showcase Success",
              quote: "My achievements section became my portfolio. Potential clients loved seeing my organized work history and skill progression. Trackfolio made it all possible.",
              name: "David Park",
              role: "Junior Developer",
              imageSrc: "http://img.b2bpic.net/free-photo/business-man-by-skyscraper_1303-13654.jpg?_wi=4",
              imageAlt: "junior developer man portrait",
            },
            {
              id: "3",
              title: "Certificate Organization",
              quote: "Trackfolio's achievement hub let me upload and organize all my certificates in one place. So much easier to track my professional development.",
              name: "Priya Kapoor",
              role: "UI/UX Designer",
              imageSrc: "http://img.b2bpic.net/free-photo/funny-smiling-woman-with-ringlets-wears-glasses-blue-jacket-poses-pink_291650-1102.jpg?_wi=4",
              imageAlt: "designer woman professional portrait",
            },
            {
              id: "4",
              title: "Award Recognition",
              quote: "I won a hackathon and documented it in Trackfolio. Having all my achievements in one professional dashboard really impressed employers.",
              name: "Michael Chen",
              role: "Full Stack Developer",
              imageSrc: "http://img.b2bpic.net/free-photo/young-it-engineer_1098-18393.jpg?_wi=3",
              imageAlt: "developer man professional portrait",
            },
            {
              id: "5",
              title: "Career Growth Visible",
              quote: "Trackfolio's achievements feature helped me visualize my career growth. I could see how far I'd come, which motivated me to achieve even more.",
              name: "Aisha Patel",
              role: "Product Manager",
              imageSrc: "http://img.b2bpic.net/free-photo/business-woman-working-home_23-2148162643.jpg?_wi=3",
              imageAlt: "product manager woman professional",
            },
            {
              id: "6",
              title: "Portfolio Differentiation",
              quote: "My well-documented achievements in Trackfolio made me stand out from other candidates. The organized showcase was the deciding factor.",
              name: "James Wilson",
              role: "Data Analyst",
              imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-young-man-listening-music_23-2147839945.jpg?_wi=3",
              imageAlt: "data analyst man professional",
            },
          ]}
          textboxLayout="default"
          useInvertedBackground={false}
          tag="User Achievements"
          tagIcon={Award}
          tagAnimation="slide-up"
          buttons={[
            {
              text: "Start Your Free Account",
              href: "#",
            },
          ]}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="achievements-metrics" data-section="achievements-metrics">
        <MetricCardOne
          title="Achievement Statistics"
          description="See the impact of tracking achievements on your portfolio growth."
          tag="Achievement Metrics"
          tagIcon={Award}
          tagAnimation="slide-up"
          metrics={[
            {
              id: "total-achievements",
              value: "2,500+",
              title: "Achievements Tracked",
              description: "Across all users",
              icon: Award,
            },
            {
              id: "user-success",
              value: "92%",
              title: "User Success Rate",
              description: "Achieved their goals",
              icon: TrendingUp,
            },
            {
              id: "job-placements",
              value: "450+",
              title: "Job Placements",
              description: "Through Trackfolio",
              icon: Target,
            },
            {
              id: "certificates",
              value: "1,200+",
              title: "Certificates Uploaded",
              description: "Professional credentials",
              icon: Award,
            },
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          buttons={[
            {
              text: "View Full Analytics",
              href: "/dashboard",
            },
          ]}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="achievements-features" data-section="achievements-features">
        <FeatureCardTwentySix
          title="Achievement Management Features"
          description="Showcase and manage your accomplishments with powerful tools designed for success."
          tag="Achievement Tools"
          tagIcon={Award}
          tagAnimation="slide-up"
          features={[
            {
              title: "Certificate Upload",
              description: "Upload and organize your professional certificates, licenses, and credentials with easy categorization.",
              buttonIcon: Share2,
              imageSrc: "http://img.b2bpic.net/free-vector/set-flat-vintage-badges-ribbons_23-2147549154.jpg?_wi=4",
              imageAlt: "achievement badges awards showcase",
            },
            {
              title: "Award Showcase",
              description: "Display your awards, recognitions, and honors in an impressive gallery format.",
              buttonIcon: Award,
              imageSrc: "http://img.b2bpic.net/free-vector/dashboard-user-panel-gradient-template_23-2148376261.jpg?_wi=4",
              imageAlt: "dashboard overview analytics statistics",
            },
            {
              title: "Milestone Tracking",
              description: "Record important milestones in your career journey and watch your growth unfold.",
              buttonIcon: TrendingUp,
              imageSrc: "http://img.b2bpic.net/free-vector/collection-gradient-infographic-elements_23-2148215458.jpg?_wi=4",
              imageAlt: "skill progression bar chart graph",
            },
            {
              title: "Achievement Dates",
              description: "Automatically record achievement dates and create a timeline of your success.",
              buttonIcon: Target,
              imageSrc: "http://img.b2bpic.net/free-vector/flat-mobile-application-set-business-startup_81522-4048.jpg?_wi=4",
              imageAlt: "goal tracking checklist interface",
            },
            {
              title: "Achievement Sharing",
              description: "Share specific achievements on social media or send them to potential employers.",
              buttonIcon: Share2,
              imageSrc: "http://img.b2bpic.net/free-photo/close-up-code-laptop-screen-server-hub-employees-reading-paperwork_482257-122503.jpg?_wi=5",
              imageAlt: "document export download interface",
            },
            {
              title: "Achievement Export",
              description: "Include achievements in your exported portfolio document or web profile.",
              buttonIcon: Eye,
              imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-business-card-desk-high-angle_23-2149343436.jpg?_wi=4",
              imageAlt: "drag drop interface cards reordering",
            },
          ]}
          textboxLayout="default"
          useInvertedBackground={false}
          buttons={[
            {
              text: "Explore Achievement Features",
              href: "#",
            },
          ]}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSimple
          columns={footerColumns}
          bottomLeftText="© 2024 Trackfolio. All rights reserved."
          bottomRightText="Made with ❤️ for portfolio builders"
        />
      </div>
    </ThemeProvider>
  );
}