"use client";
import React from "react";
import {
  EmailIcon,
  EmailShareButton,
  FacebookIcon,
  FacebookMessengerIcon,
  FacebookMessengerShareButton,
  FacebookShareButton,
  FacebookShareCount,
  GabIcon,
  GabShareButton,
  HatenaIcon,
  HatenaShareButton,
  HatenaShareCount,
  InstapaperIcon,
  InstapaperShareButton,
  LineIcon,
  LineShareButton,
  LinkedinIcon,
  LinkedinShareButton,
  LivejournalIcon,
  LivejournalShareButton,
  MailruIcon,
  MailruShareButton,
  OKIcon,
  OKShareButton,
  OKShareCount,
  PinterestIcon,
  PinterestShareButton,
  PinterestShareCount,
  PocketIcon,
  PocketShareButton,
  RedditIcon,
  RedditShareButton,
  RedditShareCount,
  TelegramIcon,
  TelegramShareButton,
  TumblrIcon,
  TumblrShareButton,
  TumblrShareCount,
  TwitterShareButton,
  ViberIcon,
  ViberShareButton,
  VKIcon,
  VKShareButton,
  VKShareCount,
  WeiboIcon,
  WeiboShareButton,
  WhatsappIcon,
  WhatsappShareButton,
  WorkplaceIcon,
  WorkplaceShareButton,
  XIcon,
} from "react-share";
function ShareNew({ newsDetails }) {
  const title = newsDetails.title || "News";
  const shareUrl = "https://updatebharat.com/news/" + newsDetails.slug;
  return (
   <div className="row">
  <div className="col-auto">
    <FacebookShareButton url={shareUrl}>
      <FacebookIcon size={32} round />
    </FacebookShareButton>
  </div>

  <div className="col-auto">
    <TwitterShareButton url={shareUrl} title={title}>
      <XIcon size={32} round />
    </TwitterShareButton>
  </div>

  <div className="col-auto">
    <TelegramShareButton url={shareUrl} title={title}>
      <TelegramIcon size={32} round />
    </TelegramShareButton>
  </div>

  <div className="col-auto">
    <WhatsappShareButton url={shareUrl} title={title} separator=":: ">
      <WhatsappIcon size={32} round />
    </WhatsappShareButton>
  </div>

  <div className="col-auto">
    <LinkedinShareButton url={shareUrl}>
      <LinkedinIcon size={32} round />
    </LinkedinShareButton>
  </div>
</div>

  );
}

export default ShareNew;
