import { Link } from '@inertiajs/react';
import { ButtonHTMLAttributes, PropsWithChildren } from 'react';

type Variant = 'primary' | 'secondary' | 'action' | 'ghost';

const variantClasses: Record<Variant, string> = {
    primary: 'bg-jgcp-navy text-white hover:bg-primary-container border border-jgcp-navy',
    secondary: 'bg-transparent text-jgcp-navy border border-jgcp-navy hover:bg-jgcp-navy/5',
    action: 'bg-accent-gold text-jgcp-navy border border-accent-gold hover:brightness-95',
    ghost: 'bg-transparent text-on-surface-variant border border-transparent hover:bg-surface-container',
};

type ButtonProps = PropsWithChildren<
    ButtonHTMLAttributes<HTMLButtonElement> & {
        variant?: Variant;
        href?: string;
        method?: 'get' | 'post' | 'put' | 'patch' | 'delete';
    }
>;

export default function Button({
    variant = 'primary',
    className = '',
    href,
    method,
    children,
    ...props
}: ButtonProps) {
    const classes = `inline-flex items-center justify-center gap-2 rounded px-5 py-2.5 text-sm font-medium transition duration-150 ease-in-out ${variantClasses[variant]} ${className}`;

    if (href) {
        return (
            <Link href={href} method={method} as={method && method !== 'get' ? 'button' : 'a'} className={classes}>
                {children}
            </Link>
        );
    }

    return (
        <button className={classes} {...props}>
            {children}
        </button>
    );
}