"use client"

import { Share2 } from "lucide-react"
import { Button } from "@/components/ui/button"
import { useStore } from "@/lib/store"

interface ReferralShareProps {
  sectionTitle: string
  fullBookPrice: number
  distributorShare: number
}

export function ReferralShare({ sectionTitle, fullBookPrice, distributorShare }: ReferralShareProps) {
  const { user } = useStore()

  const handleShare = async () => {
    const url = user?.referralCode ? `${window.location.href}?ref=${user.referralCode}` : window.location.href
    const shareData = {
      title: sectionTitle,
      text: `来自Soul派对房的真实商业故事: ${sectionTitle}`,
      url: url,
    }

    try {
      if (navigator.share && navigator.canShare && navigator.canShare(shareData)) {
        await navigator.share(shareData)
      } else {
        navigator.clipboard.writeText(url)
        alert(
          `链接已复制!分享后他人购买,你可获得${distributorShare}%返利 (¥${((fullBookPrice * distributorShare) / 100).toFixed(1)})`,
        )
      }
    } catch (error) {
      console.error("Error sharing:", error)
    }
  }

  return (
    <Button
      variant="ghost"
      size="icon"
      className="text-gray-400 hover:text-white"
      onClick={handleShare}
    >
      <Share2 className="w-5 h-5" />
    </Button>
  )
}