import React, { useContext } from 'react';

import { AppContext } from './ContextProvider';
import { ToCoins, ToDate, ToHashes } from '../helpers/utils';


const Pool = () => {
  const { state } = useContext(AppContext);
  const { pool } = state;
  const { config, networkStats, stats } = pool;
  const { pool_statistics: poolStats } = stats;

  const networkHashRate = Math.floor(networkStats.difficulty / 300);
  const poolPercentage = poolStats.hashRate / networkHashRate * 100;

  return (
    <div>
      <h1>wow!</h1>

      <hr />

      <p>welcome good friend &lt;3 thank so much for mining!</p>
      <p>very mining with you from <strong>blocke 62</strong></p>
      <p>such good pool:</p>
      <ul>
        <li>PPLNS fee for miner: {config.pplns_fee}%</li>
        <li>SOLO fee for miner: {config.solo_fee}%</li>
        <li>min payout for miner: <ToCoins coins={config.min_wallet_payout} /></li>
        <li>min payout for miner on exchange: <ToCoins coins={config.min_exchange_payout} /></li>
      </ul>

      <hr />

      <p>all wow miners: <ToHashes hashes={networkHashRate} /></p>
      <p>this pool miners: {poolStats.miners} miners digging <ToHashes hashes={poolStats.hashRate} /> (only {poolPercentage.toFixed(2)}%)</p>
      <p>world blocke: {networkStats.height} with <ToCoins coins={networkStats.value} /> discovered {<ToDate timeStamp={networkStats.ts} />}</p>
      <p>pool blocke: {poolStats.lastBlockFound} discovered {<ToDate timeStamp={poolStats.lastBlockFoundTime} />}</p>
    </div>
  )
};

export default Pool;