"use client"; import { Button } from "@gmana/react/button"; import { Facebook, Linkedin, Send, Share, Twitter } from "lucide-react"; import React from "react"; export interface ShareProps { url?: string; title?: string; description?: string; className?: string; } interface ShareUrls { facebook: string; twitter: string; linkedin: string; telegram: string; } export const SocialShare: React.FC = ({ url = typeof window !== "undefined" ? window.location.href : "", title = "", description = "", className = "" }) => { const encodedUrl: string = encodeURIComponent(url); const encodedTitle: string = encodeURIComponent(title); const encodedDescription: string = encodeURIComponent(description); const shareUrls: ShareUrls = { facebook: `https://www.facebook.com/sharer/sharer.php?u=${encodedUrl}"e=${encodedTitle}&hashtag=${encodeURIComponent("#react-share-kit,#gmana")}`, twitter: `https://twitter.com/intent/tweet?url=${encodedUrl}&text=${encodedTitle}`, linkedin: `https://www.linkedin.com/sharing/share-offsite/?url=${encodedUrl}`, telegram: `https://telegram.me/share/url?url=${encodedUrl}&text=${encodedTitle}`, }; const handleShare = (platform: keyof ShareUrls): void => { const shareUrl = shareUrls[platform]; window.open(shareUrl, "share-dialog", "width=600,height=400,toolbar=0,status=0,location=0,menubar=0"); }; const handleNativeShare = async (): Promise => { if (navigator.share) { try { await navigator.share({ title, text: description, url, }); } catch (error) { console.error("Error sharing:", error); } } else { console.log("Native sharing not supported"); } }; return (

Share this article

{/* Facebook */} {/* Twitter */} {/* LinkedIn */} {/* Telegram */} {/* Native Share Button (Mobile) */} {typeof navigator !== "undefined" && navigator.share !== null && ( )}

); };

Social sharing component in nextjs

Create a social sharing component with buttons to share content across different social media platforms.