'use client';

import React from 'react';
import { usePathname } from 'next/navigation';

export const PDFDownloadBlock: React.FC<{ label: string; style: string; url?: string }> = ({
  label,
  style,
  url,
}) => {
  const pathname = usePathname();

  // Extract slug from pathname
  const segments = pathname.split('/').filter(Boolean);
  // Pathname is usually /[locale]/[slug] or /[locale]/products/[slug]
  // We want the page slug.
  const slug = segments[segments.length - 1] || 'home';

  const href = url || `/api/pages/${slug}/pdf`;

  return (
    <div className="my-8">
      <a
        href={href}
        className={`inline-flex items-center px-8 py-3.5 font-bold rounded-full transition-all duration-300 shadow-lg hover:shadow-xl group ${
          style === 'primary'
            ? 'bg-primary text-white hover:bg-primary-dark'
            : style === 'secondary'
              ? 'bg-accent text-primary-dark hover:bg-neutral-light'
              : 'border-2 border-primary text-primary hover:bg-primary hover:text-white'
        }`}
      >
        <span className="mr-3 transition-transform group-hover:scale-12 bit-bounce">📄</span>
        {label}
      </a>
    </div>
  );
};
