import React from "react"
import { Link } from "@onegeo-suite/gatsby-theme-onegeo"
import cx from "classix"

interface Props {
    children?: React.ReactNode
    name?: string
    url?: string
    className?: string
    style?: "outline" | undefined
    color?: "primary" | "secondary" | undefined
    options?: any
}

const Button = (props: Props) => {
    const {
        children,
        name = "",
        url = "#",
        className,
        style,
        color,
        options,
    } = props

    const isPrimary = color === "primary"
    const isSecondary = color === "secondary"
    const isOutline = style === "outline"

    return (
        <Link
            to={url}
            className={cx(
                "btn font-bold",
                isPrimary && "btn-primary",
                isSecondary && "btn-secondary",
                isOutline && "btn-outline",
                className,
                options?.action
            )}
        >
            {name}
            {children}
        </Link>
    )
}

export default Button