"use client";

import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
import FooterBase from '@/components/sections/footer/FooterBase';
import { Briefcase, Award, Star } from "lucide-react";

export default function PortfolioPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="compact"
      sizing="mediumLargeSizeMediumTitles"
      background="floatingGradient"
      cardStyle="outline"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="layered"
      headingFontWeight="normal"
    >
      {/* Navigation */}
      <div id="nav" data-section="nav">
        <NavbarStyleCentered 
          navItems={[
            { name: "Home", id: "/" },
            { name: "About", id: "/about" },
            { name: "Portfolio", id: "/portfolio" },
            { name: "Contact", id: "/contact" }
          ]}
          button={{ text: "Start Investing", href: "/contact" }}
          brandName="CapitalVenture"
        />
      </div>

      {/* Portfolio Showcase */}
      <div id="portfolio" data-section="portfolio">
        <ProductCardOne 
          title="Our Investment Portfolio"
          description="Discover the innovative companies we've partnered with to transform industries and create lasting value in the technology landscape."
          tag="Portfolio Companies"
          tagIcon={Briefcase}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          gridVariant="three-columns-all-equal-width"
          products={[
            {
              id: "1",
              name: "CloudScale AI",
              price: "$450M Valuation",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/an-artificial-intelligence-or-machine-le-1771523993146-27603c95.png?_wi=2",
              imageAlt: "An artificial intelligence or machine learning platform visualization. Advanced technology interface"
            },
            {
              id: "2",
              name: "FinFlow Systems",
              price: "$320M Valuation",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/a-fintech-payment-or-banking-solution-in-1771524002125-a4110a1d.png?_wi=2",
              imageAlt: "A fintech payment or banking solution interface. Modern financial technology platform with secure tr"
            },
            {
              id: "3",
              name: "DataVault Pro",
              price: "$280M Valuation",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/a-modern-saas-application-interface-with-1771523986569-5fb42b75.png?_wi=3",
              imageAlt: "A modern SaaS application interface with clean UI, showing customer engagement dashboard, metrics, a"
            },
            {
              id: "4",
              name: "TechFlow Solutions",
              price: "$190M Valuation",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/a-stunning-technology-startup-office-env-1771523937719-7076c61a.png?_wi=3",
              imageAlt: "A stunning technology startup office environment with modern architecture, open spaces, and collabor"
            },
            {
              id: "5",
              name: "BlockChain Dynamics",
              price: "$380M Valuation",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/a-blockchain-or-cryptocurrency-innovatio-1771523971454-3ad211a3.png?_wi=2",
              imageAlt: "A blockchain or cryptocurrency innovation center with engineers working on distributed systems. Futu"
            },
            {
              id: "6",
              name: "SecureFlow Networks",
              price: "$250M Valuation",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/a-high-tech-startup-presentation-or-pitc-1771523944765-ac5aaf9a.png?_wi=2",
              imageAlt: "A high-tech startup presentation or pitch meeting environment with executives discussing innovations"
            }
          ]}
        />
      </div>

      {/* Portfolio Testimonials */}
      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFive 
          title="Success Stories from Our Portfolio"
          description="Hear from the founders and entrepreneurs who've transformed their visions into market-leading companies with our support."
          tag="Founder Stories"
          tagIcon={Award}
          textboxLayout="default"
          useInvertedBackground={true}
          testimonials={[
            {
              id: "1",
              name: "Sarah Chen, CEO of CloudScale AI",
              date: "Date: 15 November 2024",
              title: "The best investment partner we could ask for",
              quote: "CapitalVenture didn't just provide capital—they provided strategic guidance that accelerated our growth by three years. Their network connections opened doors we never knew existed.",
              tag: "Series B",
              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/professional-headshot-of-a-successful-fe-1771524022154-191d5db6.png",
              avatarAlt: "Professional headshot of a successful female entrepreneur or investor",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/an-artificial-intelligence-or-machine-le-1771523993146-27603c95.png?_wi=3",
              imageAlt: "An artificial intelligence or machine learning platform visualization"
            },
            {
              id: "2",
              name: "Michael Rodriguez, Founder of FinFlow Systems",
              date: "Date: 8 October 2024",
              title: "Exceptional execution and partnership",
              quote: "From day one, the team understood our vision and challenged us to think bigger. Their operational expertise helped us scale from 20 to 200 employees in 18 months.",
              tag: "Series A",
              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/professional-headshot-of-a-successful-ve-1771524008971-ab66de62.png",
              avatarAlt: "Professional headshot of a successful venture capital investor or tech entrepreneur",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/a-fintech-payment-or-banking-solution-in-1771524002125-a4110a1d.png?_wi=3",
              imageAlt: "A fintech payment or banking solution interface"
            },
            {
              id: "3",
              name: "Priya Sharma, CTO of DataVault Pro",
              date: "Date: 22 September 2024",
              title: "Transformational capital and counsel",
              quote: "Beyond funding, CapitalVenture provided the strategic clarity and technical expertise we needed to dominate our market. They're true partners in success.",
              tag: "Seed Round",
              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/professional-headshot-of-a-tech-ceo-or-f-1771524015765-5cbceb61.png",
              avatarAlt: "Professional headshot of a tech CEO or founder",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/a-modern-saas-application-interface-with-1771523986569-5fb42b75.png?_wi=4",
              imageAlt: "A modern SaaS application interface"
            }
          ]}
        />
      </div>

      {/* Investment Sectors */}
      <div id="sectors" data-section="sectors">
        <FeatureCardTwentyThree 
          title="Investment Focus Areas"
          description="We strategically invest across key technology sectors that are reshaping the global economy and creating transformative value."
          tag="Sectors"
          tagIcon={Star}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          features={[
            {
              id: "1",
              title: "Artificial Intelligence & Machine Learning",
              tags: ["AI/ML", "Deep Tech"],
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/an-artificial-intelligence-or-machine-le-1771523993146-27603c95.png?_wi=4",
              imageAlt: "An artificial intelligence or machine learning platform visualization"
            },
            {
              id: "2",
              title: "Financial Technology & Payments",
              tags: ["FinTech", "Payments"],
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/a-fintech-payment-or-banking-solution-in-1771524002125-a4110a1d.png?_wi=4",
              imageAlt: "A fintech payment or banking solution interface"
            },
            {
              id: "3",
              title: "Enterprise SaaS & Cloud Solutions",
              tags: ["SaaS", "Cloud"],
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/a-modern-saas-application-interface-with-1771523986569-5fb42b75.png?_wi=5",
              imageAlt: "A modern SaaS application interface"
            },
            {
              id: "4",
              title: "Blockchain & Distributed Systems",
              tags: ["Blockchain", "Web3"],
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/a-blockchain-or-cryptocurrency-innovatio-1771523971454-3ad211a3.png?_wi=3",
              imageAlt: "A blockchain or cryptocurrency innovation center"
            }
          ]}
        />
      </div>

      {/* Footer */}
      <FooterBase 
        logoText="CapitalVenture"
        copyrightText="© 2025 CapitalVenture Partners. All rights reserved."
        columns={[
          {
            title: "Company",
            items: [
              { label: "Home", href: "/" },
              { label: "About Us", href: "/about" },
              { label: "Our Portfolio", href: "/portfolio" },
              { label: "Contact", href: "/contact" }
            ]
          },
          {
            title: "Resources",
            items: [
              { label: "Investment Process", href: "#" },
              { label: "Market Insights", href: "#" },
              { label: "News & Updates", href: "#" },
              { label: "Careers", href: "#" }
            ]
          },
          {
            title: "Legal",
            items: [
              { label: "Privacy Policy", href: "#" },
              { label: "Terms of Service", href: "#" },
              { label: "SEC Disclosures", href: "#" },
              { label: "Contact Us", href: "/contact" }
            ]
          }
        ]}
      />
    </ThemeProvider>
  );
}