"use client"

import { useState } from "react"
import { Share2 } from "lucide-react"
import type { DocumentShareType } from "@garage/api"
import { Button } from "@/shared/components/ui/button"
import { ShareDocumentDialog } from "@/shared/components/share-document-dialog"

interface ShareDocumentButtonProps {
    type: DocumentShareType
    id: string | number
    label?: string
    variant?: "default" | "outline" | "ghost" | "secondary"
}

export function ShareDocumentButton({ type, id, label = "Share", variant = "outline" }: ShareDocumentButtonProps) {
    const [open, setOpen] = useState(false)

    return (
        <>
            <Button variant={variant} onClick={() => setOpen(true)}>
                <Share2 className="size-4" />
                {label}
            </Button>
            <ShareDocumentDialog type={type} id={id} open={open} onOpenChange={setOpen} />
        </>
    )
}
