Skip to content

Commit

Permalink
Merge pull request #25 from protofire/feature/#5-token-holder-account…
Browse files Browse the repository at this point in the history
…-summary

(Feature) Token holder account summary
  • Loading branch information
mariano-aguero committed Jan 14, 2019
2 parents 9a10951 + 2577621 commit b84a9c3
Show file tree
Hide file tree
Showing 32 changed files with 575 additions and 317 deletions.
48 changes: 20 additions & 28 deletions src/App.css
100755 → 100644
Original file line number Diff line number Diff line change
@@ -1,32 +1,24 @@
.App {
text-align: center;
.AccountSummaryGridContainer {
margin: 0!important;
position: relative;
width: 100%!important;
z-index: 12;
}

.App-logo {
animation: App-logo-spin infinite 20s linear;
height: 40vmin;
.AccountSummaryCard {
align-items: center;
box-sizing: border-box;
justify-content: center;
margin: 0!important;
max-height: 200px;
max-width: 200px!important;
min-height: 200px;
min-width: 200px!important;
padding: 10px;
}

.App-header {
background-color: #282c34;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
}

.App-link {
color: #61dafb;
}

@keyframes App-logo-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.AccountSummaryCard h3 {
font-size: 20px;
line-height: 1.2;
margin: 0 0 15px;
}
21 changes: 8 additions & 13 deletions src/App.js
Original file line number Diff line number Diff line change
@@ -1,26 +1,21 @@
import React, { Component } from 'react'
import './App.css'
import { BrowserRouter as Router, Route, Switch, withRouter } from 'react-router-dom'
import { HomeComponent, AccountSummaryComponent } from './Components'
import PrivateRoute from './Components/Common/Hoc/PrivateRoute/PrivateRoute'
import React, { Component } from 'react'
import Spinner from './Components/Common/UI/Spinner/Spinner'
import logger from './utils'
import { AccountSummarySubscriptionForm } from './Components/AccountSummary/AccSummarySubscriptionForm/AccountSummarySubscriptionForm'
import { BrowserRouter as Router, Route, Switch, withRouter } from 'react-router-dom'
import { HomeComponent, AccountSummaryComponent } from './Components'
import { Redirect } from 'react-router'
import Web3Provider, {
Web3ContextConsumer
} from './Components/Common/Hoc/Web3Provider/Web3Provider'

// @material-ui/core components
import withStyles from '@material-ui/core/styles/withStyles'
import PropTypes from 'prop-types'

// core components
import PagesHeader from './Components/Common/Header/PagesHeader.js'
import Footer from './Components/Common/Footer/Footer.js'
import pagesStyle from './assets/jss/dashboard/layouts/pagesStyle.js'
import bgImage from './assets/img/register.jpeg'
import PagesHeader from './Components/Common/Header/PagesHeader.js'
import PropTypes from 'prop-types'
import TermsAndConditionsComponent from './Components/TermsAndConditions/TermsAndConditions'
import bgImage from './assets/img/register.jpeg'
import pagesStyle from './assets/jss/dashboard/layouts/pagesStyle.js'
import withStyles from '@material-ui/core/styles/withStyles'

export class App extends Component {
state = {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import React, { Component } from 'react'
import * as displayTexts from '../AccountSummaryTexts'
import AccountSummarySubscriptionFormDisplay from './AccSummaryFormDisplay/AccSummarySubscriptionFormDisplay'
import React, { Component } from 'react'
import Spinner from '../../Common/UI/Spinner/Spinner'
import axios from 'axios'
import { toast, ToastContainer } from 'react-toastify'
import validator from 'validator'
import Spinner from '../../Common/UI/Spinner/Spinner'
import AccountSummarySubscriptionFormDisplay from './AccSummaryFormDisplay/AccSummarySubscriptionFormDisplay'
import { toast, ToastContainer } from 'react-toastify'

export class AccountSummarySubscriptionForm extends Component {
state = {
Expand Down
35 changes: 26 additions & 9 deletions src/Components/AccountSummary/AccountSummary.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,14 @@
import React, { Component } from 'react'
import axios from 'axios'
import Spinner from '../Common/UI/Spinner/Spinner'
import * as displayTexts from './AccountSummaryTexts'
import AccountSummaryHome from './AccountSummaryHome/AccountSummaryHome'
import { toast, ToastContainer } from 'react-toastify'
import Card from '../Common/UI/Card/Card.js'
import GridContainer from '../Common/UI/Grid/GridContainer.js'
import GridItem from '../Common/UI/Grid/GridItem.js'
import React, { Component } from 'react'
import Spinner from '../Common/UI/Spinner/Spinner'
import axios from 'axios'
import logger from '../../utils'
import { toast, ToastContainer } from 'react-toastify'

export class AccountSummaryComponent extends Component {
state = {
userData: {
Expand All @@ -19,6 +23,8 @@ export class AccountSummaryComponent extends Component {
},
summary: {
bondedAmount: '',
delegateAddress: '',
delegatedAmount: '',
fees: '',
lastClaimRound: '',
startRound: '',
Expand Down Expand Up @@ -87,6 +93,7 @@ export class AccountSummaryComponent extends Component {
callback
)
}

componentDidMount = async () => {
logger.log('[AccountSummaryComponent.js] componentDidMount')
let userDataPromise, summaryPromise
Expand Down Expand Up @@ -167,12 +174,14 @@ export class AccountSummaryComponent extends Component {
{
summary: {
bondedAmount: summaryData.data.summary.bondedAmount,
delegateAddress: summaryData.data.summary.delegateAddress,
delegatedAmount: summaryData.data.summary.delegatedAmount,
fees: summaryData.data.summary.fees,
lastClaimRound: summaryData.data.summary.lastClaimRound,
startRound: summaryData.data.summary.startRound,
status: summaryData.data.summary.status,
withdrawRound: summaryData.data.summary.withdrawRound,
stake: summaryData.data.summary.totalStake
stake: summaryData.data.summary.totalStake,
withdrawRound: summaryData.data.summary.withdrawRound
},
lpBalance: summaryData.data.balance
},
Expand Down Expand Up @@ -272,7 +281,15 @@ export class AccountSummaryComponent extends Component {
}

render() {
let content = <Spinner displayMsg={this.state.displayMsg} />
let content = (
<GridContainer className="AccountSummaryGridContainer" justify="center" align="center">
<GridItem>
<Card className="AccountSummaryCard">
<Spinner displayMsg={this.state.displayMsg} />
</Card>
</GridItem>
</GridContainer>
)
if (this.state.render) {
if (!this.state.error) {
content = (
Expand All @@ -292,10 +309,10 @@ export class AccountSummaryComponent extends Component {
}
}
return (
<div>
<>
{content}
<ToastContainer autoClose={2000} />
</div>
</>
)
}
}
38 changes: 0 additions & 38 deletions src/Components/AccountSummary/AccountSummary.test.js

This file was deleted.

This file was deleted.

153 changes: 112 additions & 41 deletions src/Components/AccountSummary/AccountSummaryData/AccountSummaryData.js
Original file line number Diff line number Diff line change
@@ -1,46 +1,117 @@
import AccountSummaryStyle from '../AccountSummaryHome/AccountSummaryStyle'
import React from 'react'
import './AccountSummaryData.css'
import Table from '@material-ui/core/Table'
import TableBody from '@material-ui/core/TableBody'
import TableCell from '@material-ui/core/TableCell'
import TableHead from '@material-ui/core/TableHead'
import TableRow from '@material-ui/core/TableRow'
import tableStyle from '../../../assets/jss/dashboard/components/tableStyle'
import { withStyles } from '@material-ui/core/styles'

const AccountSummaryData = props => {
let statusMsg = getStatusMsg(props)
const tableData = [
{ title: 'BondedAmount', data: props.summary.bondedAmount },
{
title: 'Earned from delegate fees',
data: props.summary.fees
},
{
title: 'Status',
data: props.summary.status + ', ' + statusMsg
},
{
title: 'Stake',
data: props.summary.stake + ' LPT'
}
]
const { classes } = props

return (
<>
<table className="accountSummaryDataTable">
<thead>
<tr>
<th colSpan="2">Summary Information</th>
</tr>
</thead>
<tbody>
<tr>
<td>BondedAmount</td>
<td>{props.summary.bondedAmount} </td>
</tr>
<tr>
<td>Fees</td>
<td>{props.summary.fees}</td>
</tr>
<tr>
<td>Status</td>
<td>{props.summary.status}</td>
</tr>
<tr>
<td>LastClaimRound</td>
<td>{props.summary.lastClaimRound}</td>
</tr>
<tr>
<td>StartRound</td>
<td>{props.summary.startRound}</td>
</tr>
<tr>
<td>WithdrawRound</td>
<td>{props.summary.withdrawRound}</td>
</tr>
<tr>
<td>Stake</td>
<td>{props.summary.totalStake}</td>
</tr>
</tbody>
</table>
</>
<Table className={classes.table}>
<TableHead>
<TableRow>
<TableCell
colSpan="2"
className={`${classes.tableHeadCel} ${classes.noWrap} ${classes.pL0} ${classes.pR0} ${
classes.tableTitle
}`}
>
Summary Information
</TableCell>
</TableRow>
</TableHead>
<TableBody>
{tableData.map((item, index) => {
return (
<TableRow key={index}>
<TableCell className={`${classes.tableCell} ${classes.noWrap}`}>
{item.title}
</TableCell>
<TableCell
className={`${classes.tableCell} ${classes.textRight} ${classes.wordBreak}`}
>
{item.data}
</TableCell>
</TableRow>
)
})}
</TableBody>
</Table>
)
}
export default AccountSummaryData

const getStatusMsg = props => {
let msg
switch (props.summary && props.summary.status) {
case 'Pending': {
msg = (
<td>
your LPT is getting deluded by the protocol's token inflation. Add value to the network,
bond to a transcoder here.
</td>
)
msg =
" your LPT is getting deluded by the protocol's token inflation. Add value to the network,\n" +
' bond to a transcoder here.'
break
}
case 'Bonded': {
msg = (
<td>
bonded to transcoder {props.summary.delegateAddress} at round {props.summary.startRound}
</td>
)
msg =
'bonded to transcoder ' +
props.summary.delegateAddress +
'at round {props.summary.startRound}'
break
}
case 'Unbonding': {
msg = <td>your still have to wait a few moments to get finally unbonded.</td>
msg = 'your still have to wait a few moments to get finally unbonded.'
break
}
case 'Unbonded': {
msg = (
<td>
your LPT is getting deluded by the protocol's token inflation. Add value to the network,
bond to a transcoder here.
</td>
)
msg =
"your LPT is getting deluded by the protocol's token inflation. Add value to the network,\n" +
' bond to a transcoder here.'
break
}
default:
msg = null
}
return msg
}

export default withStyles(theme => ({
...AccountSummaryStyle,
...tableStyle(theme)
}))(AccountSummaryData)
Loading

0 comments on commit b84a9c3

Please sign in to comment.