Commit 0993b845 authored by Ramaxx's avatar Ramaxx
Browse files

Merge branch 'feature/wallet_page/cash_in' into 'master'

Feature/wallet page/cash in

Closes #6

See merge request faircoop/BankOfTheCommons/wallet-frontend!2
parents e323a836 793bd076
......@@ -29,7 +29,7 @@ const getMonthEarnings = () =>
path: MONTH_EARNINGS_URL
}).then(response => {
let monthEarnings = response.data;
dispatch(success(monthEarnings.data));
dispatch(success(monthEarnings));
}).catch(error => {
console.error("ERROR");
});
......
import { createAction } from 'redux-actions';
import TRANSACTIONS from './constants';
import { getAuthToken } from 'utils';
import { fetchApi } from 'utils';
const TRANSACTIONS_URL = "user/v1/last";
......
......@@ -95,7 +95,7 @@ class Transactions extends Component {
simple
onClick={() => alert("You've pressed the edit button on colmun id: ")}
color="warning"
customClass="edit">
customclass="edit">
<Dvr />
</Button>{" "}
{ /* use this button to remove the data row */ }
......@@ -105,7 +105,7 @@ class Transactions extends Component {
simple
onClick={() => alert("You've pressed the delete button on colmun id: ")}
color="danger"
customClass="remove">
customclass="remove">
<Close />
</Button>{" "}
</div>
......
......@@ -3,6 +3,7 @@ import React from "react";
import withStyles from "@material-ui/core/styles/withStyles";
import { Card } from "@material-ui/core";
import CashInMethod from './methods';
const style = {
infoText: {
......@@ -35,12 +36,12 @@ class Cash extends React.Component {
}
let Component = ''
if(this.props.allStates.choice.selectedMethod) {
Component = this.props.allStates.choice.selectedMethod.Component
Component = this.props.allStates.choice.selectedMethod
}
return (
<Card>
<div>
{typeof(Component) === "string" ? Component : <Component />}
<div id="cash_in_method">
<CashInMethod method={Component} />
</div>
</Card>
);
......
import React from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import { withStyles } from '@material-ui/core/styles';
import List from '@material-ui/core/List';
import ListItem from '@material-ui/core/ListItem';
import Grid from '@material-ui/core/Grid';
import methods from './methods'
const styles = theme => ({
root: {
width: '100%',
......@@ -33,16 +32,17 @@ class SelectMethod extends React.Component {
}
render() {
const { methods } = this.props;
var items = methods.map(method => {
return (
<ListItem
button
disabled={method.disabled}
disabled={method.status === "unavailable"}
selected={this.state.selectedMethod === method}
onClick={event => this.handleListItemClick(event, method)}
key={method.name}
>
<img height={40} width={120} alt='' src={require(`assets/img/${method.name}.png`)} />
<img height={40} width={120} alt='' src={method.image} />
</ListItem>
)
})
......@@ -63,4 +63,8 @@ SelectMethod.propTypes = {
classes: PropTypes.object.isRequired,
};
export default withStyles(styles)(SelectMethod);
\ No newline at end of file
const mapStateToProps = (state) => ({
methods: state.wallet_actions.cash_in
})
export default connect(mapStateToProps, {})(withStyles(styles)(SelectMethod));
......@@ -31,9 +31,10 @@ class CashIn extends Component {
}
}
render() {
const { disabled } = this.props;
return (
<div>
<Button onClick={this.handleOpen}>Cash In</Button>
<Button onClick={this.handleOpen} disabled={disabled}>Cash In</Button>
<Dialog
fullScreen
onClose={this.handleClose}
......@@ -71,4 +72,4 @@ class CashIn extends Component {
)
}
}
export default CashIn;
\ No newline at end of file
export default CashIn;
import { createAction } from 'redux-actions';
import BTC_IN_LIST from './constants';
import { getAuthToken } from 'utils';
import axios from 'axios'
const reset = createAction(BTC_IN_LIST, () => ({
status: 'initial',
}));
const begin = createAction(BTC_IN_LIST, () => ({
status: 'pending',
}));
const fail = createAction(BTC_IN_LIST, error => ({
error,
status: 'error',
}));
const success = createAction(BTC_IN_LIST, list=> ({
list,
status: 'success'
}));
const getBtcInList = () =>
(dispatch) => {
dispatch(begin);
axios({
method: 'GET',
headers: {
Authorization: `Bearer ${getAuthToken()}`
},
url: 'https://api.bankofthecommons.coop/company/v1/wallet/cash_in_token/btc-in'
}).then(response => {
let btc_in_list = response.data
dispatch(success(btc_in_list.data))
}).catch(error => {
console.error("ERROR");
});
}
const actions = {
reset,
begin,
fail,
success,
getBtcInList
}
export default actions;
\ No newline at end of file
const BTC_IN_LIST = "BTC_IN_LIST"
export default BTC_IN_LIST;
\ No newline at end of file
import React, { Component } from 'react'
import BtcList from './BtcList';
export default class BtcIn extends Component {
render() {
return (
<div>
<BtcList />
</div>
)
}
}
import BTC_IN_LIST from './constants';
export default function btc_in_list(state = { status: 'initial', list: {} }, action) {
switch (action.type) {
case BTC_IN_LIST : {
const {
list = state.list,
error = state.error,
list_status = state.status
} = action.payload
return {
list,
error,
list_status,
};
}
default:
return state;
}
}
\ No newline at end of file
import React, { Component } from 'react';
import { connect } from 'react-redux';
import actions from './actions';
import { Paper } from '@material-ui/core';
import { Paper, Card } from '@material-ui/core';
import Table from "components/atoms/Table/Table.jsx";
import Close from "@material-ui/icons/Close";
import Button from "components/atoms/CustomButtons/Button.jsx";
import SweetAlert from "react-bootstrap-sweetalert";
import QRCode from 'qrcode.react'
import TextField from '@material-ui/core/TextField';
class BtcInList extends Component {
class Coin extends Component {
constructor(){
super();
this.state = {
loading: true,
showQr: null
showQr: null,
label: ''
};
}
componentWillMount() {
this.props.getBtcInList();
}
componentWillReceiveProps(nextProps){
if(nextProps.status === "success") {
this.setState({loading: false});
}
}
hideQr() {
this.setState({showQr: null})
this.setState({showQr: null});
}
showQr(element) {
const {token, label} = element
const {token, label} = element;
const text = "bitcoin:"+ token.replace(/[^a-zA-Z 0-9.]+/g,' ') + "?amount=0&label=" + label.replace(/[^a-zA-Z 0-9.]+/g,' ');
this.setState({
showQr: (
......@@ -45,9 +36,16 @@ class BtcInList extends Component {
)
});
}
removeToken(id) {
this.props.removeCashInToken(this.props.method, id);
}
createCashInToken() {
this.props.createCashInToken(this.props.method, this.state.label)
this.setState({label: ''})
}
render() {
const { list } = this.props;
const { list, status } = this.props;
let elements = []
if(list.elements){
elements = list.elements.map(element => ([
......@@ -56,27 +54,41 @@ class BtcInList extends Component {
element.token,
<div>
<Button onClick={() => this.showQr(element)}> Show Qr</Button>
<Button color="danger" key={element.id}>
<Button onClick={() => this.removeToken(element.id)} color="danger" key={element.id}>
<Close />
</Button>
</Button >
</div>
]))
}
return (
let createToken = ''
if(elements.length < 5 && status !== 'pending') {
createToken = (
<div>
<TextField label="label" value={this.state.label} onChange={(event) => this.setState({label: event.target.value})} />
<Button
onClick={() => this.createCashInToken()}
color="success"
> Generate new {this.props.method.cname} address </Button>
</div>
)
} else {
if (elements.length === 5)
createToken = 'if you want to generate a new address, you have to delete a old address'
}
return (
<Paper>
<Card>
{createToken}
</Card>
{this.state.showQr}
<Table
tableHead={["id","Label","Token", "Actions"]}
tableData={elements}
/>
{elements.length === 0 && status !== "pending" ? 'No data found':''}
</Paper>
)
}
}
const mapStateToProps = (state) => ({
list: state.btc_in.list,
status: state.btc_in.list_status
})
export default connect(mapStateToProps, actions)(BtcInList);
export default Coin;
const FAC_IN = "FAC_IN"
export default FAC_IN;
\ No newline at end of file
import React, { Component } from 'react';
import { connect } from 'react-redux';
import actions from './actions';
import { Paper } from '@material-ui/core';
import Table from "components/atoms/Table/Table.jsx";
import Close from "@material-ui/icons/Close";
import Button from "components/atoms/CustomButtons/Button.jsx";
import SweetAlert from "react-bootstrap-sweetalert";
import QRCode from 'qrcode.react'
class FacIn extends Component {
constructor(){
super();
this.state = {
loading: true,
showQr: null
};
}
componentWillMount() {
this.props.getFacIn();
}
componentWillReceiveProps(nextProps){
if(nextProps.status === "success") {
this.setState({loading: false});
}
}
hideQr() {
this.setState({showQr: null})
}
showQr(element) {
const {token, label} = element
const text = "faircoin:"+ token.replace(/[^a-zA-Z 0-9.]+/g,' ') + "?amount=0&label=" + label.replace(/[^a-zA-Z 0-9.]+/g,' ');
this.setState({
showQr: (
<SweetAlert
style={{ display: "block", marginTop: "-200px" }}
title={label ? label: 'Unlabeled'}
onConfirm={() => this.hideQr()}
onCancel={() => this.hideQr()}
>
<QRCode level='H' size={200} value={text} />
</SweetAlert>
)
});
}
render() {
const { fac_in } = this.props;
let elements = []
if(fac_in.elements){
elements = fac_in.elements.map(element => ([
element.id,
element.label,
element.token,
<div>
<Button onClick={() => this.showQr(element)}> Show Qr</Button>
<Button color="danger" key={element.id}>
<Close />
</Button>
</div>
]))
}
return (
<Paper>
{this.state.showQr}
<Table
tableHead={["id","Label","Token", "Actions"]}
tableData={elements}
/>
</Paper>
)
}
}
const mapStateToProps = (state) => ({
fac_in: state.fac_in.fac_in,
status: state.fac_in.status
})
export default connect(mapStateToProps, actions)(FacIn);
import FAC_IN from './constants';
export default function fac_in(state = { status: 'initial', fac_in: {} }, action) {
switch (action.type) {
case FAC_IN : {
const {
fac_in = state.fac_in,
error = state.error,
status = state.status
} = action.payload
return {
fac_in,
error,
status,
};
}
default:
return state;
}
}
\ No newline at end of file
import React, { Component } from 'react';
import Button from "components/atoms/CustomButtons/Button.jsx";
class Sepa extends Component {
createCashInToken() {
this.props.createCashInToken(this.props.method, 'default')
}
render(){
const { list, status } = this.props
let bank_info;
let element;
if(list.elements){
element = list.elements[0];
}
if(list.bank_info){
bank_info = list.bank_info[0];
}
if(status === "pending"){
return <div></div>;
}
if(!(bank_info && element)){
return (
<div>
Please generate your reference.
<Button
onClick={() => this.createCashInToken()}
color="success"
> Generate Reference </Button>
</div>
)
}
return (
<div>
<p>
In order to deposit <b>EUR</b> into our BotC account you must send a bank transfer to one of the following account\'s details:
</p>
<div>
<div>
<p>
<b>BENEFICIARY:</b>
{ bank_info.beneficiary }
</p>
<p><b>IBAN:</b> { bank_info.iban } </p>
<p><b>BIC/SWIFT:</b> { bank_info.bic_swift } </p>
<p><b>BANK:</b> { bank_info.bank } </p>
<p><b>REFERENCE:</b> { element.token } </p>
<p><b>IMPORTANT:</b></p>
<p><b>* ENSURE</b> the reference <b>MATCHES EXACTLY</b> with the given above, otherwise you will need to contact us to make it manually - which will take more time. </p>
<p>EXTRA NOTES:</p>
<p>* The trasfer can take up to two-three working days to appear in your wallet (from the moment the transfer was done). </p>
</div>
</div>
</div>
)
}
}
export default Sepa;
import { createAction } from 'redux-actions';
import { getAuthToken } from 'utils';
import axios from 'axios';
import { CASH_IN_TOKENS, CASH_IN_TOKEN_CREATE, CASH_IN_TOKEN_REMOVE } from './constants';
const reset = createAction(CASH_IN_TOKENS, (method) => ({
method,
status: 'initial',
}));
const begin = createAction(CASH_IN_TOKENS, (method) => ({
method,
status: 'pending',
}));
const fail = createAction(CASH_IN_TOKENS, (method, error) => ({
method,
error,
status: 'error',
}));
const success = createAction(CASH_IN_TOKENS, (method, list)=> ({
method,
list,
status: 'success'
}));
const create = createAction(CASH_IN_TOKEN_CREATE, (method, token) => ({
method,
token,
status: 'created'
}));
const remove = createAction(CASH_IN_TOKEN_REMOVE, (method, id) => ({
method,
id,
status: 'removed'
}))
const createCashInToken = (method, label) =>
(dispatch) => {
var body = new FormData();
body.set('method', `${method.cname}-in`);
body.set('label', label);
axios({
method: 'POST',
data: body,
headers: {
Authorization: `Bearer ${getAuthToken()}`,
},
url: `https://api.bankofthecommons.coop/company/v1/wallet/cash_in_token`
}).then(response => {
let cash_in_token = response.data;
dispatch(create(method, cash_in_token.data));
}).catch(error => {
console.error("ERROR");
});
};
const removeCashInToken = (method, id) =>
(dispatch) => {
let body = new FormData();
body.set('disable', true);
axios({
method: 'PUT',
data: "disable=true",
headers: {
Authorization: `Bearer ${getAuthToken()}`,
"Content-Type": 'application/x-www-form-urlencoded; charset=UTF-8'
},
url: `https://api.bankofthecommons.coop/company/v1/wallet/cash_in_token/${id}?`
}).then((response) => {
dispatch(remove(method, id));
// getCashInList(method);