avcohen · January 24, 2022 18:39
diff --git a/ShareLinks.tsx b/ShareLinks.tsx
 import { Fragment } from "react";
 import { useRouter } from "next/router";

 function ShareLinks({
  rootDomain,
  title,
  platforms = ["facebook", "twitter"],
 }: {
  rootDomain: string;
  title: string;
  platforms?: Array<"facebook" | "twitter">;
 }) {
  const router = useRouter();
  const BASE_URL = rootDomain + router.asPath;
  const BASE_TITLE = title;

  function handleClick(e, p) {
    e.preventDefault();
    let window_size = "width=585,height=511";
    const url = e.target.href;
    switch (p) {
      case "facebook":
        window_size = "width=585,height=368";
        break;
      case "twitter":
        window_size = "width=585,height=261";
        break;
      default:
        window_size = "width=517,height=511";
        break;
    }
    window.open(
      url,
      "",
      "menubar=no,toolbar=no,resizable=yes,scrollbars=yes," + window_size
    );
    return false;
  }

  return (
    <div className="social-links t-h4">
      <span>SHARE:&nbsp;</span>
      {platforms.map((p, idx) => {
        if (p === "facebook") {
          return (
            <Fragment key={p}>
              <a
                className={"t-h4"}
                key={p}
                href={`https://www.facebook.com/sharer/sharer.php?u=${BASE_URL}&t=${BASE_TITLE}`}
                target="_blank"
                rel="noopener"
                title="Share on Facebook"
                onClick={(e) => handleClick(e, p)}
              >
                FACEBOOK
              </a>
              {idx !== platforms.length - 1 ? <span>,</span> : null}
            </Fragment>
          );
        }

        if (p === "twitter") {
          return (
            <Fragment key={p}>
              <a
                className={"t-h4"}
                key={p}
                href={`https://www.twitter.com/intent/tweet?url=${BASE_URL}&via=luakabop&text=${BASE_TITLE}`}
                target="_blank"
                rel="noopener"
                title="Share on Twitter"
                onClick={(e) => handleClick(e, p)}
              >
                TWITTER
              </a>
              {idx !== platforms.length - 1 ? <span>,</span> : null}
            </Fragment>
          );
        }
      })}
    </div>
  );
 }

 export default ShareLinks;
	import { Fragment } from "react";
	import { useRouter } from "next/router";

	function ShareLinks({
	rootDomain,
	title,
	platforms = ["facebook", "twitter"],
	}: {
	rootDomain: string;
	title: string;
	platforms?: Array<"facebook" \| "twitter">;
	}) {
	const router = useRouter();
	const BASE_URL = rootDomain + router.asPath;
	const BASE_TITLE = title;

	function handleClick(e, p) {
	e.preventDefault();
	let window_size = "width=585,height=511";
	const url = e.target.href;
	switch (p) {
	case "facebook":
	window_size = "width=585,height=368";
	break;
	case "twitter":
	window_size = "width=585,height=261";
	break;
	default:
	window_size = "width=517,height=511";
	break;
	}
	window.open(
	url,
	"",
	"menubar=no,toolbar=no,resizable=yes,scrollbars=yes," + window_size
	);
	return false;
	}

	return (
	<div className="social-links t-h4">
	<span>SHARE: </span>
	{platforms.map((p, idx) => {
	if (p === "facebook") {
	return (
	<Fragment key={p}>
	<a
	className={"t-h4"}
	key={p}
	href={`https://www.facebook.com/sharer/sharer.php?u=${BASE_URL}&t=${BASE_TITLE}`}
	target="_blank"
	rel="noopener"
	title="Share on Facebook"
	onClick={(e) => handleClick(e, p)}
	>
	FACEBOOK
	</a>
	{idx !== platforms.length - 1 ? <span>,</span> : null}
	</Fragment>
	);
	}

	if (p === "twitter") {
	return (
	<Fragment key={p}>
	<a
	className={"t-h4"}
	key={p}
	href={`https://www.twitter.com/intent/tweet?url=${BASE_URL}&via=luakabop&text=${BASE_TITLE}`}
	target="_blank"
	rel="noopener"
	title="Share on Twitter"
	onClick={(e) => handleClick(e, p)}
	>
	TWITTER
	</a>
	{idx !== platforms.length - 1 ? <span>,</span> : null}
	</Fragment>
	);
	}
	})}
	</div>
	);
	}

	export default ShareLinks;