Dashboard.js

import React from 'react';
import { Container, Row, Col, Button } from 'react-bootstrap';
import AuthContext from './AuthContext';
import Fetcher from './Fetcher';
import TransactionList from './TransactionList';
import { printMoney } from './util';

class Dashboard extends React.Component {
    static contextType = AuthContext;

    constructor(props) {
        super(props);
        this.state = {
            name: null,
            balance: null
        };
    }

    render() {
        return (
            <Fetcher
                    url={"/api/member/me"}
                    onFetch={member => this.setState({ balance: member.balance, name: member.name})} >
                <Container>
                    <Row>
                        <Col xs>
                            <div className="text-right">
                            <h6>{this.state.name}</h6>
                            <h1>{printMoney(this.state.balance)}€</h1>
                            </div>
                        </Col>
                        <Col xs={{ offset: 0 }} md={{ offset: 1 }}>
                            <br />
                            <Button variant="success" href="/purchase">Compra</Button>
                        </Col>
                    </Row>
                    <TransactionList />
                </Container>
            </Fetcher>
        );
    }
}

export default Dashboard;