"use client"

import * as React from "react"

import { Button } from "./ui/button"
import { cn } from '../lib/utils'
import { icons } from "../lib/icons"
import {
    Tooltip,
    TooltipContent,
    TooltipProvider,
    TooltipTrigger,
} from "./ui/tooltip"

export function ContactButton({ variant, link, tooltip }) {
    return (
        <TooltipProvider>
            <Tooltip>
                <TooltipTrigger>
                    <a href={link} target="_blank">
                        <Button id={`${variant}Btn`} variant="outline" size="icon" className={cn("bg-inherit border-none text-content hover:text-bkg p-1 justify-center")} dangerouslySetInnerHTML={{ __html: icons[variant] }} />
                    </a>
                    </TooltipTrigger>
                <TooltipContent>
                    <p>{tooltip}</p>
                </TooltipContent>
            </Tooltip>
        </TooltipProvider>
    )
}