'use client';

import { Share2 } from 'lucide-react';
import { Button } from '@/app/components/ui/button';
import { Article } from '@/lib/types';

interface ShareButtonProps {
    article: Article;
}

export default function ShareButton({ article }: ShareButtonProps) {
    // 分享文章
    const handleShare = async () => {
        if (navigator.share && article) {
            try {
                await navigator.share({
                    title: article.metadata.title,
                    text: article.metadata.description,
                    url: typeof window !== 'undefined' ? window.location.href : '',
                });
            } catch (err) {
                console.error('Error sharing article:', err);
            }
        } else {
            // 复制链接到剪贴板
            try {
                await navigator.clipboard.writeText(typeof window !== 'undefined' ? window.location.href : '');
                alert('链接已复制到剪贴板');
            } catch (err) {
                console.error('Error copying link:', err);
            }
        }
    };

    return (
        <Button
            variant="outline"
            onClick={handleShare}
            className="flex items-center gap-2 hover:bg-blue-50"
        >
            <Share2 size={16} />
            分享文章
        </Button>
    );
}