Skip to content

Commit 7debce8

Browse files
mertakdutmertakdut
committed
refactoring, redux, and... something with 'r'... revisions!
1 parent e331449 commit 7debce8

File tree

21 files changed

+414
-358
lines changed

21 files changed

+414
-358
lines changed

‎BankApplicationBackend/src/main/java/com/demo/bankapp/request/FindAllByUserRequest.java

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
package com.demo.bankapp.request;
2+
3+
import lombok.Data;
4+
import lombok.EqualsAndHashCode;
5+
6+
@Data
7+
@EqualsAndHashCode(callSuper = false)
8+
public class FindAllByUserRequest extends BaseRequest {
9+
10+
private String username;
11+
12+
}

‎BankApplicationFrontend/src/actions/index.js

Lines changed: 21 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,30 @@
1-
21
// TODO: Soft-coded action types.
32
// export const ADD_TODO = 'ADD_TODO'
43

5-
export const showDialog = (title, message) => ({
4+
export const showDialog = (titleEnum, message, callback) => ({
65
type: 'SHOW_DIALOG',
7-
title,
8-
message
6+
titleEnum,
7+
message,
8+
callback
99
})
1010

1111
export const closeDialog = {
1212
type: 'HIDE_DIALOG'
13+
}
14+
15+
export const login = (username) => ({
16+
type: 'LOGIN',
17+
username
18+
})
19+
20+
export const logout = {
21+
type: 'LOGOUT'
22+
}
23+
24+
export const currenciesObsolete = {
25+
type: 'CURRENCIES_OBSOLETE'
26+
}
27+
28+
export const currenciesUptodate = {
29+
type: 'CURRENCIES_UPTODATE'
1330
}

‎BankApplicationFrontend/src/components/MoneyBar.js

Lines changed: 67 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,80 @@
11
import React from 'react';
22
import { Alert } from 'react-bootstrap'
3+
import { connect } from 'react-redux'
4+
5+
import Request from '../services/Request'
6+
import { showDialog, currenciesUptodate } from '../actions';
7+
8+
const mapStateToProps = state => ({
9+
loggedInUsername: state.login,
10+
isCurrenciesObsolete: state.currencies
11+
})
12+
13+
const mapDispatchToProps = dispatch => ({
14+
showPopup: (title, message) => dispatch(showDialog(title, message)),
15+
currenciesUptodate: () => dispatch(currenciesUptodate),
16+
})
317

418
class MoneyBar extends React.Component {
519

20+
constructor(props) {
21+
super(props);
22+
23+
this.state = {
24+
ownedCurrencies: null
25+
};
26+
27+
this.retrieveWealthAndUpdateState = this.retrieveWealthAndUpdateState.bind(this);
28+
}
29+
30+
componentDidMount() {
31+
if (this.props.loggedInUsername != null) {
32+
this.retrieveWealthAndUpdateState();
33+
}
34+
}
35+
36+
componentDidUpdate(prevProps) {
37+
if (this.props.loggedInUsername != null && (this.props.loggedInUsername != prevProps.loggedInUsername || this.props.isCurrenciesObsolete)) {
38+
this.retrieveWealthAndUpdateState();
39+
}
40+
}
41+
42+
retrieveWealthAndUpdateState() {
43+
if (!this.state.isProcessing) {
44+
this.setState({ isProcessing: true });
45+
46+
const request = new Request().getRequestInstance();
47+
request.post('wealth/retrieve', { username: this.props.loggedInUsername })
48+
.then((response) => {
49+
this.setState({ ownedCurrencies: [] });
50+
Object.keys(response.data.wealthMap).map((key) => {
51+
if (response.data.wealthMap[key] == 0) delete response.data.wealthMap[key];
52+
});
53+
this.setState({ ownedCurrencies: response.data.wealthMap });
54+
this.props.currenciesUptodate();
55+
}).catch((error) => {
56+
console.log(error);
57+
var errorMessage = 'Network error.';
58+
if (error != null && error.response != null && error.response.data != null && error.response.data.message != null) {
59+
errorMessage = error.response.data.message;
60+
}
61+
this.props.showPopup(0, errorMessage);
62+
}).finally(() => {
63+
this.setState({ isProcessing: false });
64+
});
65+
}
66+
}
67+
668
render() {
769

870
var barMessage = "";
9-
if (this.props.ownedCurrencies != null) {
10-
if (Object.keys(this.props.ownedCurrencies).length === 0) {
71+
if (this.state.ownedCurrencies != null) {
72+
if (Object.keys(this.state.ownedCurrencies).length === 0) {
1173
barMessage = "Possessions make you rich? Your richness is life, forever."
1274
} else {
1375
barMessage += "You have ";
14-
Object.keys(this.props.ownedCurrencies).forEach((key, index, array) => {
15-
barMessage += this.props.ownedCurrencies[key] + " " + key + ((array.length - 1) != index ? ", " : ".");
76+
Object.keys(this.state.ownedCurrencies).forEach((key, index, array) => {
77+
barMessage += this.state.ownedCurrencies[key] + " " + key + ((array.length - 1) != index ? ", " : ".");
1678
});
1779
}
1880
}
@@ -30,4 +92,4 @@ class MoneyBar extends React.Component {
3092
}
3193
}
3294

33-
export default MoneyBar;
95+
export default connect(mapStateToProps, mapDispatchToProps)(MoneyBar);

‎BankApplicationFrontend/src/components/NavigationBar.js renamed to ‎BankApplicationFrontend/src/components/NavigationBar/NavigationBar.js

Lines changed: 28 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,18 @@
11
import React from 'react';
22
import { Link, Redirect } from 'react-router-dom';
3-
import { Navbar, Nav, NavItem } from 'react-bootstrap'
4-
import PopupDialog from './PopupDialog';
3+
import { connect } from 'react-redux'
4+
import { Navbar, Nav, NavItem } from 'react-bootstrap';
5+
6+
import { showDialog, logout } from '../../actions';
7+
8+
const mapStateToProps = state => ({
9+
loggedInUsername: state.login
10+
})
11+
12+
const mapDispatchToProps = dispatch => ({
13+
showPopup: (title, message, callback) => dispatch(showDialog(title, message, callback)),
14+
logout: () => dispatch(logout)
15+
})
516

617
const navbarStyling = {
718
padding: '15px',
@@ -16,23 +27,30 @@ class NavBarTop extends React.Component {
1627
super(props);
1728

1829
this.state = {
19-
username: localStorage.getItem('username')
20-
};
21-
console.log(this.state.username);
30+
hasJustLoggedOut: false
31+
}
2232

2333
this.onLoggedOut = this.onLoggedOut.bind(this);
2434
}
2535

2636
onLoggedOut() {
2737
localStorage.removeItem('username');
28-
this.setState({ username: localStorage.getItem('username') });
38+
this.props.logout();
39+
this.setState({ hasJustLoggedOut: true });
2940
}
3041

3142
render() {
3243

33-
const loginLogout = this.state.username == null ?
44+
if (this.state.hasJustLoggedOut) {
45+
this.setState({ hasJustLoggedOut: false })
46+
return <Redirect to="/" />
47+
}
48+
49+
50+
const loginLogout = this.props.loggedInUsername == null ?
3451
<NavItem style={navbarStyling} componentclass="span"><Link to="/login">Login</Link></NavItem> :
35-
<LogoutDialog username={this.state.username} callback={this.onLoggedOut} />
52+
<NavItem style={navbarStyling} onClick={() =>
53+
this.props.showPopup(1, 'Are sure you want to logout ' + this.props.loggedInUsername + '?', this.onLoggedOut)}>Logout</NavItem>
3654

3755
return (
3856
<Navbar bg="light" expand="lg" >
@@ -46,7 +64,7 @@ class NavBarTop extends React.Component {
4664
<NavItem style={navbarStyling} componentclass="span"><Link to="/history">Transaction History</Link></NavItem>
4765
</Nav>
4866
<Nav className="ml-auto">
49-
<NavItem style={navbarStyling} componentclass="span"><Link to="/register">Register</Link></NavItem>
67+
{this.props.loggedInUsername == null ? <NavItem style={navbarStyling} componentclass="span"><Link to="/register">Register</Link></NavItem> : null}
5068
{loginLogout}
5169
</Nav>
5270
</Navbar.Collapse>
@@ -55,37 +73,4 @@ class NavBarTop extends React.Component {
5573
}
5674
}
5775

58-
class LogoutDialog extends React.Component {
59-
60-
constructor(props) {
61-
super(props);
62-
63-
this.state = {
64-
isShowingPopup: false
65-
}
66-
67-
this.onPopupClosed = this.onPopupClosed.bind(this);
68-
}
69-
70-
onPopupClosed(result) {
71-
if (result) {
72-
this.props.callback();
73-
}
74-
}
75-
76-
render() {
77-
78-
const popupDialog = this.state.isShowingPopup ?
79-
<PopupDialog callback={this.onPopupClosed} title='Logout' message={'Are you sure you want to logout ' + this.props.username + '?'} isAnswerable={true} /> : null;
80-
81-
return (
82-
<div>
83-
{popupDialog}
84-
<NavItem style={navbarStyling} onClick={() => this.setState({ isShowingPopup: true })}>Logout</NavItem>
85-
</div >
86-
)
87-
}
88-
89-
}
90-
91-
export default NavBarTop;
76+
export default connect(mapStateToProps, mapDispatchToProps)(NavBarTop);

‎BankApplicationFrontend/src/components/PopupDialog.js

Lines changed: 15 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -5,50 +5,41 @@ import { closeDialog } from '../actions';
55

66
const mapStateToProps = state => ({
77
show: state.dialog.isOpen,
8-
title: state.dialog.title,
9-
message: state.dialog.message
8+
titleEnum: state.dialog.titleEnum,
9+
message: state.dialog.message,
10+
callback: state.dialog.callback
1011
})
1112

1213
const mapDispatchToProps = dispatch => ({
1314
onClose: () => dispatch(closeDialog)
1415
})
1516

1617
class PopupDialog extends React.Component {
17-
constructor(props, context) {
18-
super(props, context);
1918

20-
// this.handlePositive = this.handlePositive.bind(this);
21-
// this.handleNegative = this.handleNegative.bind(this);
19+
constructor(props) {
20+
super(props);
21+
this.onCloseDialog = this.onCloseDialog.bind(this);
2222
}
2323

24-
componentDidMount() {
25-
console.log(this.props.store);
24+
onCloseDialog() {
25+
if (this.props.callback) {
26+
this.props.callback();
27+
}
28+
this.props.onClose();
2629
}
2730

28-
// handlePositive() {
29-
// this.setState({ show: false });
30-
// this.props.callback(true);
31-
// }
32-
33-
// handleNegative() {
34-
// this.setState({ show: false });
35-
// this.props.callback(false);
36-
// }
37-
3831
render() {
3932

40-
console.log(this.props.show);
41-
4233
return (
4334
<div>
44-
<Modal show={this.props.show} onHide={this.props.onClose}>
35+
<Modal show={this.props.usingAsWidget ? true : this.props.show} onHide={this.props.onClose}>
4536
<Modal.Header closeButton>
46-
<Modal.Title>{this.props.title}</Modal.Title>
37+
<Modal.Title>{this.props.titleEnum == 0 ? "Error" : this.props.titleEnum == 1 ? "Warning" : "Success"}</Modal.Title>
4738
</Modal.Header>
4839
<Modal.Body>{this.props.message}</Modal.Body>
4940
<Modal.Footer>
50-
{this.props.isAnswerable ? <Button variant="secondary" onClick={this.props.onClose}>No</Button> : null}
51-
<Button variant="primary" onClick={this.props.onClose}>{this.props.isAnswerable ? 'Yes' : 'Okay'}</Button>
41+
{this.props.callback ? <Button variant="secondary" onClick={this.props.onClose}>No</Button> : null}
42+
<Button variant="primary" onClick={this.onCloseDialog}>{this.props.callback ? 'Yes' : 'Okay'}</Button>
5243
</Modal.Footer>
5344
</Modal>
5445
</div>

‎BankApplicationFrontend/src/pages/CurrencyPage/CurrencyList/Currency/BuySellButton/BuySellButton.js

Lines changed: 0 additions & 58 deletions
This file was deleted.

0 commit comments

Comments
 (0)