import React, {useEffect, useState} from 'react';
import { getSimplePrice } from './services/market';

export default function App() {
  const [prices, setPrices] = useState<any>({});
  useEffect(() => {
    (async () => {
      try {
        const data = await getSimplePrice(['bitcoin','ethereum']);
        setPrices(data);
      } catch (e) {
        console.error(e);
      }
    })();
  }, []);
  return (
    <div style={{padding:20}}>
      <h1>Ivano Crypto - Web</h1>
      <ul>
        {Object.keys(prices).map(k => (
          <li key={k}>
            <strong>{k.toUpperCase()}</strong>: ${prices[k].usd} ({prices[k].usd_24h_change.toFixed(2)}%)
          </li>
        ))}
      </ul>
    </div>
  );
}