/* eslint-disable react/no-danger */
import { useEffect, useRef, useMemo } from 'react';
const Tweet = function Tweet({
  tweet,
  className
}) {
  const self = useRef();
  const tweetId = useMemo(() => {
    const match = /twitter.com\/.*\/status\/(.*)/.exec(tweet);
    if (match) {
      return match[1];
    }
    return null;
  }, [tweet]);
  useEffect(() => {
    if (tweetId && window.twttr) {
      window.twttr.ready().then(({
        widgets
      }) => {
        if (self.current) {
          self.current.innerHTML = '';
          widgets.createTweetEmbed(tweetId, self.current, {
            conversation: 'none',
            align: 'center'
          });
        }
      });
    }
  }, [tweetId]);
  if (!tweetId) {
    return null;
  }
  return <div ref={self} className={className} />;
};
export default Tweet;