diff --git a/websrc/components/Cards.tsx b/websrc/components/Cards.tsx index 25b82ba..cc93a25 100644 --- a/websrc/components/Cards.tsx +++ b/websrc/components/Cards.tsx @@ -1,11 +1,6 @@ import React, {Component} from 'react'; -import {Currency} from "../types"; - -type CardProps = { - title: string, - content: string, - logo?: JSX.Element, -} +import {Balance, EventName, FirstConnectMessage, NewTickMessage} from "../types"; +import {socket} from "../index"; export type CoinBalanceProps = { name: string, @@ -58,52 +53,46 @@ class CoinBalance extends Component { } } -export class SidebarCard extends Component { - constructor(props: CardProps) { - super(props) - } - - render() { - return ( -
-
{this.props.logo} {this.props.title}
-
{this.props.content}
-
- ) - } +export type WalletCardProps = { + quote: string, } -export type WalletCardState = { - balances: Array, - total_balance: number, - quote: Currency, -} - - -export class WalletCard extends Component<{}, WalletCardState> { - state = { - balances: [], - total_balance: 0, - quote: {name: "USD", short_name: "$"} - } - +export class WalletCard extends Component<{}, { balances: Array }> { constructor(props) { super(props); } + state = { + balances: [] + } renderCoinBalances() { return ( - this.state.balances.map((balance) => { + this.state.balances.map((balance: Balance) => { return ( - + ) }) ) } + componentDidMount() { + socket.on(EventName.NewTick, (data: NewTickMessage) => { + this.setState({ + balances: data.balances + }) + }) + + socket.on(EventName.FirstConnect, (data: FirstConnectMessage) => { + this.setState({ + balances: data.balances + }) + }) + } + render() { return (
@@ -128,9 +117,9 @@ export class WalletCard extends Component<{}, WalletCardState> { {this.renderCoinBalances()}
-
- Total Balance ≈ {this.state.quote_symbol}{this.props.total_balance.toFixed(2)} -
+ {/*
*/} + {/* Total Balance ≈ {this.props}{this.state.total_balance.toFixed(2)}*/} + {/*
*/}
diff --git a/websrc/components/Navbars.tsx b/websrc/components/Navbars.tsx index fc78d48..98b8018 100644 --- a/websrc/components/Navbars.tsx +++ b/websrc/components/Navbars.tsx @@ -1,4 +1,5 @@ import React, {Component} from "react"; +import {WalletCard} from "./Cards"; export class Navbar extends Component { constructor(props) { @@ -25,8 +26,10 @@ export class Navbar extends Component {
  • - - + + Reports @@ -35,9 +38,12 @@ export class Navbar extends Component {