import React from 'react';
import {API_BASE_URL} from '../config';

export default class Coins extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            lists: [],
            error: null,
        };
    }

    componentDidMount() {
        this.loadCoins();
    }

    loadCoins() {
        this.setState({
            error: null,
            loading: true
        });
        return fetch(`${API_BASE_URL}?limit=10&tsym=USD`)
            .then(res => {
                if(!res.ok) {
                    return Promise.reject(res.statusText);
                }
                return res.json();
            })
            .then(coins =>
                this.setState({
                    lists: coins.data,
                    loading: false
                })
            )
            .catch(err => {
                this.setState({
                    error: 'Could not load coins',
                    loading: false
                })
            });
    }

    render() {
        const coins = this.state.lists.map((coin, index) => (
            <li>{coin}</li>
        )
        return (<div></div>);
    }

}