import React, {Component} from "react" import {Container, Table} from "react-bootstrap" import {NewTickData, PositionState, socket} from '../'; export class PositionTable extends Component<{}, { positions: Array }> { state = { positions: [] } constructor(props) { super(props) } componentDidMount() { socket.on('new_tick', (data: NewTickData) => { this.setState({ positions: data.positions }) }) } tableData() { return this.state.positions.map((position: PositionState) => { return ( {position.id} {position.symbol} {position.base_price.toFixed(2)} {position.profit_loss.toFixed(2)} {position.profit_loss_percentage.toFixed(2)} % ) }) } render() { return (

Open positions

{this.tableData()}
ID Symbol Base price P/L P/L %
) } }