import React from 'react' ; import PropTypes from 'prop-types' ; import { Chip , Grid , TableCell , TableRow } from '@material-ui/core' ; import { PENDING_ADDITION , PENDING_REMOVAL , FAIL_ADDITION , FAIL_REMOVAL } from '../../constants/transactions' ; import TextWithTooltip from './TextWithTooltip' ; import styles from './styles.module.scss' ; type AccountRow = { address : string ; status : string ; isAdmin : boolean ; deleteTransaction : ( address : string ) => void ; openRemoveModal : ( address : string ) => void ; } ; const AccountRow = ( { address , status , isAdmin , deleteTransaction , openRemoveModal } ) => ( < TableRow className = { styles . row } > < TableCell > < TextWithTooltip status = { status } text = { address } isAdmin = { isAdmin } / > < /TableCell> < TableCell > < Grid container justifyContent = "space-between" alignItems = "center" > { status === 'active' ? ( < Chip color = "primary" className = { styles . pill } label = "Active" / > ) : status === PENDING_ADDITION ? ( < Chip color = "secondary" className = { styles . pill } label = "Pending Addition" / > ) : status === PENDING_REMOVAL ? ( < Chip color = "secondary" className = { styles . pill } label = "Pending Removal" / > ) : status === FAIL_ADDITION ? ( < Grid > < Chip className = { styles . pill } label = "Addition Failed" / > < Chip color = "secondary" className = { styles . pill } onClick = { ( ) => deleteTransaction ( address ) } label = "Clear" / > < /Grid>) : status === FAIL_REMOVAL ? (<Grid> < Chip className = { styles . pill } label = "Removal Failed" / > < Chip color = "secondary" className = { styles . pill } onClick = { ( ) => deleteTransaction ( address ) } label = "Clear" / > < /Grid>) : (<div / > ) } { isAdmin && status === 'active' && ( < Chip className = { styles . removeIcon } onDelete = { ( ) => openRemoveModal ( address ) } />)} < /Grid> < /TableCell> < /TableRow>); AccountRow . propTypes = { address : PropTypes . string . isRequired , status : PropTypes . string . isRequired , isAdmin : PropTypes . bool . isRequired , deleteTransaction : PropTypes . func . isRequired , openRemoveModal : PropTypes . func . isRequired } ; export default AccountRow ;