import * as React from 'react';

import { cn } from '@workspace/ui/lib/utils';
import { Button } from '@workspace/ui/components/ui/button';

export interface FinalCTASectionProps extends React.HTMLAttributes<HTMLDivElement> {
  title: string;
  description: string;
  primaryCtaText: string;
  primaryCtaHref: string;
  secondaryCtaText?: string;
  secondaryCtaHref?: string;
}

export function FinalCTASection({
  title,
  description,
  primaryCtaText,
  primaryCtaHref,
  secondaryCtaText,
  secondaryCtaHref,
  className,
  ...props
}: FinalCTASectionProps) {
  return (
    <div
      className={cn(
        "flex flex-col items-center justify-center text-center py-20 px-6 rounded-lg w-full",
        className
      )}
      {...props}
    >
      <div className="max-w-3xl">
        <h2 className="text-4xl font-bold mb-16">{title}</h2>
        <p className="text-xl text-muted-foreground mb-10 max-w-2xl mx-auto">
          {description}
        </p>
        <div className="flex flex-col sm:flex-row gap-6 justify-center">
          <Button asChild size="lg" className="px-10 py-6 text-lg">
            <a href={primaryCtaHref}>{primaryCtaText}</a>
          </Button>
          {secondaryCtaText && secondaryCtaHref && (
            <Button asChild variant="outline" size="lg" className="px-10 py-6 text-lg">
              <a href={secondaryCtaHref}>{secondaryCtaText}</a>
            </Button>
          )}
        </div>
      </div>
    </div>
  );
}