/* eslint-disable jsx-a11y/no-static-element-interactions */ /* eslint-disable jsx-a11y/click-events-have-key-events */ /* eslint-disable no-plusplus */ /* eslint-disable react/prop-types */ // @flow import React, { Component } from 'react'; import { AccordionItemButton, AccordionItem, AccordionItemHeading, AccordionItemPanel, Accordion } from 'react-accessible-accordion'; import styles from './Dashboard.module.css'; import cstyles from './Common.module.css'; import { TotalBalance, Info, AddressBalance } from './AppState'; import Utils from '../utils/utils'; import ScrollPane from './ScrollPane'; import { BalanceBlockHighlight, BalanceBlock } from './BalanceBlocks'; const AddressBalanceItem = ({ currencyName, zecPrice, item }) => { const { bigPart, smallPart } = Utils.splitZecAmountIntoBigSmall(Math.abs(item.balance)); return ( {Utils.splitStringIntoChunks(item.address, 6).join(' ')} {item.containsPending && ( Some transactions are pending. Balances may change. )} {currencyName} {bigPart} {smallPart} {Utils.getZecToUsdString(zecPrice, Math.abs(item.balance))} ); }; type Props = { totalBalance: TotalBalance, info: Info, addressesWithBalance: AddressBalance[] }; export default class Home extends Component { render() { const { totalBalance, info, addressesWithBalance } = this.props; const anyPending = addressesWithBalance && addressesWithBalance.find(i => i.containsPending); return ( {anyPending && ( Some transactions are pending. Balances may change. )} Address Balance {addressesWithBalance && (addressesWithBalance.length === 0 ? ( No Addresses with a balance ) : ( {addressesWithBalance .filter(ab => ab.balance > 0) .map(ab => ( ))} ))} ); } }