import React from 'react';
import { Glyphicon } from 'react-bootstrap';
import styles from './DOIBadge.module.css';

function DOIBadge(props) {
  const { doi } = props;

  if (!doi) {
    return <Glyphicon glyph="lock" />;
  }

  if (doi.trim() === '') {
    return null;
  }

  const doiUrl = `https://doi.esrf.fr/${doi}`;
  return (
    <a
      className={styles.badge}
      target="_blank"
      rel="noopener noreferrer"
      href={doiUrl}
    >
      DOI
      <span className={styles.doi}>{doi}</span>
    </a>
  );
}

export default DOIBadge;
