diff --git a/src/containers/AuthWrapperContainer.js b/src/containers/AuthWrapperContainer.js
deleted file mode 100644
index ce2ad11..0000000
--- a/src/containers/AuthWrapperContainer.js
+++ /dev/null
@@ -1,48 +0,0 @@
-import { drizzleConnect } from 'drizzle-react'
-import React, { Component } from 'react'
-import PropTypes from 'prop-types'
-
-const contract = "Forum";
-const method = "hasUserSignedUp";
-
-class AuthWrapperContainer extends Component {
- constructor(props, context) {
- super(props);
-
- this.contracts = context.drizzle.contracts;
-
- this.dataKey = this.contracts[contract].methods[method].cacheCall(...[this.props.accounts[0]]);
- }
-
- render() {
- // Contract is not yet intialized.
- if(!this.props.contracts[contract].initialized)
- return (null);
-
- // If the cache key we received earlier isn't in the store yet; the initial value is still being fetched.
- if(!(this.dataKey in this.props.contracts[contract][method]))
- return (null);
-
- let userHasSignedUp = this.props.contracts[contract][method][this.dataKey].value;
- const authRender = this.props.authRender;
- const guestRender = this.props.guestRender;
-
- if (userHasSignedUp)
- return(
{authRender}
);
-
- return({guestRender}
);
- }
-}
-
-AuthWrapperContainer.contextTypes = {
- drizzle: PropTypes.object
-};
-
-const mapStateToProps = state => {
- return {
- accounts: state.accounts,
- contracts: state.contracts,
- }
-};
-
-export default drizzleConnect(AuthWrapperContainer, mapStateToProps)
\ No newline at end of file
diff --git a/src/containers/UsernameFormContainer.js b/src/containers/UsernameFormContainer.js
index 8b299cb..9b9d59d 100644
--- a/src/containers/UsernameFormContainer.js
+++ b/src/containers/UsernameFormContainer.js
@@ -1,7 +1,6 @@
import { drizzleConnect } from 'drizzle-react'
import React, { Component } from 'react'
import PropTypes from 'prop-types'
-import AuthWrapperContainer from './AuthWrapperContainer'
const contract = "Forum";
const signUpMethod = "signUp";
@@ -11,81 +10,42 @@ class UsernameFormContainer extends Component {
constructor(props, context) {
super(props);
- this.handleSignUp = this.handleSignUp.bind(this);
- this.handleSignUpInputChange = this.handleSignUpInputChange.bind(this);
-
- this.handleUsernameUpdate = this.handleUsernameUpdate.bind(this);
- this.handleUpdateUsernameInputChange = this.handleUpdateUsernameInputChange.bind(this);
+ this.handleInputChange = this.handleInputChange.bind(this);
+ this.handleSubmit = this.handleSubmit.bind(this);
this.contracts = context.drizzle.contracts;
-
- // Get the contract ABI
- const abi = this.contracts[contract].abi;
-
-
- this.inputs = {signUp:[], updateUsername:[]};
- let initialState = {signUp:{}, updateUsername:{}};
-
- // Iterate over abi for correct function.
- for (let i = 0; i < abi.length; i++) {
- if ((abi[i].name === signUpMethod)) {
- this.inputs.signUp = abi[i].inputs;
-
- for (let i = 0; i < this.inputs.signUp.length; i++) {
- initialState.signUp[this.inputs.signUp[i].name] = '';
- }
-
- }
- else if ((abi[i].name === updateUsernameMethod)) {
- this.inputs.updateUsername = abi[i].inputs;
-
- for (let i = 0; i < this.inputs.updateUsername.length; i++) {
- initialState.updateUsername[this.inputs.updateUsername[i].name] = '';
- }
-
- }
- }
- this.state = initialState;
- }
-
- handleSignUp() {
- this.contracts[contract].methods[signUpMethod].cacheSend(...Object.values(this.state.signUp));
+ this.state = {usernameInput:''};
}
- handleUsernameUpdate() {
- this.contracts[contract].methods[updateUsernameMethod].cacheSend(...Object.values(this.state.updateUsername));
+ handleSubmit() {
+ this.setState({usernameInput:''});
+ if(this.props.user.hasSignedUp)
+ this.contracts[contract].methods[updateUsernameMethod].cacheSend(...[this.state.usernameInput]);
+ else
+ this.contracts[contract].methods[signUpMethod].cacheSend(...[this.state.usernameInput]);
}
- handleSignUpInputChange(event) {
- this.setState({ signUp: { ...this.state.signUp, [event.target.name]: event.target.value} });
- }
- handleUpdateUsernameInputChange(event) {
- this.setState({ updateUsername: { ...this.state.updateUsername, [event.target.name]: event.target.value} });
+ handleInputChange(event) {
+ this.setState({[event.target.name]: event.target.value});
}
-
render() {
- let signUp = this.inputs.signUp[0].name; //username
- let updateUsername = this.inputs.updateUsername[0].name; //newUsername
- return (
-
-
-
-
- }
- guestRender={
-
- }
- />
-
+ const hasSignedUp = this.props.user.hasSignedUp;
+
+ if(hasSignedUp!==null) {
+ const buttonText = hasSignedUp ? "Update" : "Sign Up";
+ const placeholderText = hasSignedUp ? this.props.user.username : "Username";
+
+ return(
+
+ );
+ }
- )
+ return(null);
}
}
@@ -95,7 +55,8 @@ UsernameFormContainer.contextTypes = {
const mapStateToProps = state => {
return {
- contracts: state.contracts
+ contracts: state.contracts,
+ user: state.user
}
};
diff --git a/src/layouts/home/Home.js b/src/layouts/home/Home.js
deleted file mode 100644
index 974deae..0000000
--- a/src/layouts/home/Home.js
+++ /dev/null
@@ -1,26 +0,0 @@
-import React, { Component } from 'react'
-import { ContractData } from 'drizzle-react-components'
-import UsernameFormContainer from '../../containers/UsernameFormContainer'
-
-class Home extends Component {
- render() {
- return (
-
-
-
-
Apella
-
-
-
-
Account
-
Username:
-
-
-
-
-
- )
- }
-}
-
-export default Home
diff --git a/src/layouts/home/HomeContainer.js b/src/layouts/home/HomeContainer.js
index 1eb73eb..44ed953 100644
--- a/src/layouts/home/HomeContainer.js
+++ b/src/layouts/home/HomeContainer.js
@@ -1,11 +1,34 @@
-import Home from './Home'
import { drizzleConnect } from 'drizzle-react'
+import React, { Component } from 'react'
+import UsernameFormContainer from '../../containers/UsernameFormContainer'
+
+class Home extends Component {
+ render() {
+ return (
+
+
+
+
Apella
+
+
+
+
Account
+
Username: {this.props.user.username}
+
+
+
+
+
+ )
+ }
+}
// May still need this even with data function to refresh component on updates for this contract.
const mapStateToProps = state => {
return {
accounts: state.accounts,
Forum: state.contracts.Forum,
+ user: state.user,
drizzleStatus: state.drizzleStatus
}
};
diff --git a/src/userReducer.js b/src/userReducer.js
index 17b893d..ea8c016 100644
--- a/src/userReducer.js
+++ b/src/userReducer.js
@@ -1,7 +1,7 @@
const initialState = {
- username: "Guest",
+ username: "",
address: "0x0",
- hasSignedUp: false
+ hasSignedUp: null
};
const userReducer = (state = initialState, action) => {
@@ -14,7 +14,7 @@ const userReducer = (state = initialState, action) => {
};
case 'USER_IS_GUEST':
return {
- username: "Guest",
+ username: "",
address: action.address,
hasSignedUp: false
};
diff --git a/src/userSaga.js b/src/userSaga.js
index 9fd562c..0ac00a3 100644
--- a/src/userSaga.js
+++ b/src/userSaga.js
@@ -39,23 +39,24 @@ function* updateUserData() {
function* getUserData() {
account = (yield select(accounts))[0];
forumContract.methods["hasUserSignedUp"].cacheCall(...[account]);
- const txObject = yield call(forumContract.methods["hasUserSignedUp"], ...[account]);
+ const txObj1 = yield call(forumContract.methods["hasUserSignedUp"], ...[account]);
try {
- const callResult = yield call(txObject.call, {address:account});
+ const callResult = yield call(txObj1.call, {address:account});
if(callResult)
{
- const username = yield call(forumContract.methods["getUsername"], ...[account]);
+ const txObj2 = yield call(forumContract.methods["getUsername"], ...[account]);
+ const username = yield call(txObj2.call, {address:account});
const dispatchArgs = {
address: account,
username: username
};
- yield put({type: 'USER_HAS_SIGNED_UP', ...dispatchArgs}); //TODO: only dispatch if needed
+ yield put({type: 'USER_HAS_SIGNED_UP', ...dispatchArgs});
}
else{
const dispatchArgs = {
address: account,
};
- yield put({type: 'USER_IS_GUEST', ...dispatchArgs}); //TODO: only dispatch if needed
+ yield put({type: 'USER_IS_GUEST', ...dispatchArgs});
}
}
catch (error) {