"use client";

import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import FeatureCardTwentyFour from "@/components/sections/feature/FeatureCardTwentyFour";
import MetricCardEleven from "@/components/sections/metrics/MetricCardEleven";
import ContactText from "@/components/sections/contact/ContactText";
import FooterBase from "@/components/sections/footer/FooterBase";
import { Lightbulb, TrendingUp } from "lucide-react";

export default function BlogPage() {
  const navItems = [
    { name: "Home", id: "home" },
    { name: "About", id: "about" },
    { name: "Solutions", id: "solutions" },
    { name: "Projects", id: "projects" },
    { name: "Blog", id: "blog" },
    { name: "Contact", id: "contact" },
  ];

  const footerColumns = [
    {
      title: "Solutions",
      items: [
        { label: "Industrial Automation", href: "/" },
        { label: "Robot & Cobot Systems", href: "/" },
        { label: "Packaging Machinery", href: "/" },
        { label: "Smart Gate Systems", href: "/" },
        { label: "Custom Engineering", href: "/" },
      ],
    },
    {
      title: "Company",
      items: [
        { label: "About Us", href: "/" },
        { label: "Projects & Portfolio", href: "/" },
        { label: "Blog & Articles", href: "/blog" },
        { label: "Careers", href: "/" },
        { label: "Contact", href: "/contact" },
      ],
    },
    {
      title: "Resources",
      items: [
        { label: "Case Studies", href: "/" },
        { label: "Technical Documentation", href: "/" },
        { label: "Support Portal", href: "/" },
        { label: "FAQ", href: "/" },
        { label: "Contact Support", href: "/contact" },
      ],
    },
    {
      title: "Contact",
      items: [
        { label: "Phone: +66 2 123 4567", href: "tel:+6621234567" },
        { label: "Email: info@milestones.co.th", href: "mailto:info@milestones.co.th" },
        { label: "LINE: @milestones-tech", href: "https://line.me" },
        { label: "Bangkok, Thailand", href: "/" },
        { label: "Mon-Fri 8:00-18:00 (GMT+7)", href: "/" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="reveal-blur"
      borderRadius="pill"
      contentWidth="medium"
      sizing="large"
      background="grid"
      cardStyle="solid"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="layered"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="Milestones Technologies"
          navItems={navItems}
          button={{
            text: "Request Quote",
            href: "/contact",
          }}
        />
      </div>

      <div id="blog-articles" data-section="blog-articles">
        <div className="mx-auto px-4 md:px-6">
          <FeatureCardTwentyFour
            tag="INDUSTRY INSIGHTS"
            tagIcon={Lightbulb}
            tagAnimation="slide-up"
            title="Latest Automation & Engineering Articles"
            description="Stay informed with in-depth articles, case studies, and insights on industrial automation trends, best practices, and technological advancements in manufacturing and smart systems."
            features={[
              {
                id: "article-1",
                title: "The ROI of Industrial Automation: What You Need to Know",
                author: "Engineering Team",
                description: "Explore how modern automation delivers measurable returns, productivity gains, and cost savings. Learn what timeline to expect for ROI achievement in your facility.",
                tags: ["ROI", "Financial Planning", "Automation Benefits"],
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BC5DoKtnbMRErIYJgmPK5zjs5w/industrial-robot-arm-performing-precise--1773981130354-3aca37a1.png?_wi=2",
                imageAlt: "Industrial automation ROI analysis",
              },
              {
                id: "article-2",
                title: "Collaborative Robots: The Future of Manufacturing Workforce",
                author: "Innovation Lab",
                description: "Discover how cobots are revolutionizing factories by working safely alongside human workers. Understand safety standards, training requirements, and real-world applications.",
                tags: ["Robotics", "Cobot Technology", "Workforce Evolution"],
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BC5DoKtnbMRErIYJgmPK5zjs5w/collaborative-robot-cobot-working-alongs-1773981130740-14a987e9.png?_wi=2",
                imageAlt: "Collaborative robot manufacturing",
              },
              {
                id: "article-3",
                title: "Smart Gate Systems: Security Meets Convenience in Modern Properties",
                author: "Smart Solutions",
                description: "Learn about the latest smart gate technologies including RFID, mobile app control, and advanced security features. Perfect for residential and commercial properties.",
                tags: ["Smart Gates", "Security", "Smart Living"],
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BC5DoKtnbMRErIYJgmPK5zjs5w/smart-gate-control-system-display-with-d-1773981131975-1ea8ba37.png?_wi=2",
                imageAlt: "Smart gate system interface",
              },
              {
                id: "article-4",
                title: "Packaging Automation: Meeting Consumer Demands with Speed & Quality",
                author: "Production Expert",
                description: "Examine how advanced packaging systems integrate with quality control, sustainability requirements, and high-speed production. Industry standards and best practices included.",
                tags: ["Packaging", "Quality Control", "Production Speed"],
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BC5DoKtnbMRErIYJgmPK5zjs5w/high-speed-packaging-machinery-in-operat-1773981132057-91de9d07.png?_wi=2",
                imageAlt: "Automated packaging machinery",
              },
              {
                id: "article-5",
                title: "Custom Automation Solutions: Building Systems for Your Unique Needs",
                author: "Engineering Services",
                description: "From concept to implementation, learn how custom engineering solves specific manufacturing challenges. Real case studies from diverse industries included.",
                tags: ["Custom Solutions", "Engineering", "Industry-Specific"],
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BC5DoKtnbMRErIYJgmPK5zjs5w/professional-engineering-team-working-on-1773981131698-7cf7cd5d.png?_wi=2",
                imageAlt: "Custom engineering project",
              },
            ]}
            animationType="slide-up"
            textboxLayout="default"
            useInvertedBackground={false}
          />
        </div>
      </div>

      <div id="blog-trends" data-section="blog-trends">
        <div className="mx-auto px-4 md:px-6">
          <MetricCardEleven
            tag="INDUSTRY TRENDS"
            tagIcon={TrendingUp}
            tagAnimation="slide-up"
            title="Automation Industry Growth & Adoption Metrics"
            description="Understand the market landscape and adoption rates driving industrial transformation across Southeast Asia and globally."
            metrics={[
              {
                id: "metric-adoption",
                value: "73%",
                title: "Factory Adoption Rate",
                description: "Manufacturing facilities in Thailand now utilizing some form of automation",
              },
              {
                id: "metric-growth",
                value: "28%",
                title: "Annual Industry Growth",
                description: "Industrial automation sector experiencing sustained double-digit growth",
              },
              {
                id: "metric-investment",
                value: "15B+",
                title: "Annual Investment",
                description: "Regional investment in automation technology and solutions",
              },
              {
                id: "metric-jobs",
                value: "42K+",
                title: "New Technical Jobs",
                description: "Skilled positions created in automation, robotics, and engineering",
              },
              {
                id: "metric-efficiency",
                value: "35%",
                title: "Average Efficiency Gain",
                description: "Reported productivity improvement from automation adoption",
              },
              {
                id: "metric-timeline",
                value: "2-3",
                title: "Year Implementation",
                description: "Typical timeline from planning to full system deployment",
              },
            ]}
            animationType="slide-up"
            textboxLayout="default"
            useInvertedBackground={false}
          />
        </div>
      </div>

      <div id="blog-cta" data-section="blog-cta">
        <div className="mx-auto px-4 md:px-6">
          <ContactText
            text="Ready to explore automation solutions for your business? Connect with our experts to discuss your industry-specific needs and opportunities."
            background={{ variant: "grid" }}
            buttons={[
              {
                text: "Schedule Consultation",
                href: "/contact",
              },
              {
                text: "Download Resources",
                href: "/contact",
              },
            ]}
            useInvertedBackground={false}
          />
        </div>
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          logoText="Milestones Technologies"
          copyrightText="© 2025 Milestones Technologies. All rights reserved."
          columns={footerColumns}
        />
      </div>
    </ThemeProvider>
  );
}