Bounty metatags

bountyMetatags.js

import React from 'react';
import { Helmet } from 'react-helmet';
import { EXPIRED } from 'public-modules/Bounty/constants';
import moment from 'moment';

const SEOHeader = props => {
  const { bounty } = props;

  if (!bounty) {
    return null;
  }

  const description = bounty.description
    .replace('# Description', '')
    .substring(0, 199);
  const fulfillmentAmount = Number(bounty.calculated_fulfillmentAmount).toFixed(
    2
  );
  const usdPrice = Number(bounty.usd_price).toFixed(2);
  const value = `${fulfillmentAmount} ${bounty.tokenSymbol} ($${usdPrice} USD)`;
  const deadline = moment
    .utc(bounty.deadline, 'YYYY-MM-DDThh:mm:ssZ')
    .fromNow(true);
  const deadlineDescription =
    bounty.bountyStage === EXPIRED ? 'expired' : 'remaining';
  const deadlineText = `${deadline} ${deadlineDescription}`;

  return (
    <Helmet>
      <title>{bounty.title}</title>
      <meta name="description" content={description} />
      <meta name="twitter:card" value="summary_large_image" />
      <meta name="twitter:site" content="@ethbounties" />
      <meta name="twitter:title" content={bounty.title} />
      <meta name="twitter:description" content={description} />
      <meta name="twitter:creator" content="@ethbounties" />
      <meta name="twitter:image:src" content={bounty.image_preview} />
      <meta name="twitter:label1" value="Bounty Payout" />
      <meta name="twitter:data1" value={value} />
      <meta name="twitter:label2" value="Deadline to Submit" />
      <meta name="twitter:data2" value={deadlineText} />
      <meta property="og:title" content={bounty.title} />
      <meta property="og:type" content="article" />
      <meta property="og:url" content={window.location.href} />
      <meta property="og:image:secure_url" content={bounty.image_preview} />
      <meta property="og:description" content={description} />
    </Helmet>
  );
};

export default SEOHeader;