"use client";
export default function ShareButtons({ title, slug }: { title: string; slug: string }) {
  const url = `https://ravneetbrar.in/blog/${slug}`;
  return (
    <div className="mt-8 flex gap-2 text-[12px] flex-wrap">
      <button onClick={() => navigator.clipboard.writeText(url)} className="px-3 py-1.5 rounded-full border border-white/10 text-white/60 hover:text-white">Copy link</button>
      <a href={`https://twitter.com/intent/tweet?text=${encodeURIComponent(title)}&url=${url}`} target="_blank" rel="noopener noreferrer" className="px-3 py-1.5 rounded-full border border-white/10 text-white/60 hover:text-white">X/Twitter</a>
      <a href={`https://www.linkedin.com/sharing/share-offsite/?url=${url}`} target="_blank" rel="noopener noreferrer" className="px-3 py-1.5 rounded-full border border-white/10 text-white/60 hover:text-white">LinkedIn</a>
      <a href={`https://wa.me/?text=${encodeURIComponent(title + " " + url)}`} target="_blank" rel="noopener noreferrer" className="px-3 py-1.5 rounded-full border border-white/10 text-white/60 hover:text-white">WhatsApp</a>
    </div>
  );
}