Browse Source

Initial attempt

develop
Ezerous 7 years ago
parent
commit
9134f07fec
  1. 12
      .gitignore
  2. 7
      contracts/Forum.sol
  3. 2
      contracts/Migrations.sol
  4. 4
      package.json
  5. 42
      src/index.js
  6. 14
      src/layouts/home/HomeContainer.js
  7. 4
      src/reducer.js
  8. 26
      src/store.js
  9. 18
      src/util/drizzle/drizzleOptions.js
  10. 8
      src/util/drizzle/rootSaga.js
  11. 51
      src/util/web3/getWeb3.js
  12. 16
      src/util/web3/web3Reducer.js

12
.gitignore

@ -4,6 +4,9 @@
/node_modules /node_modules
package-lock.json package-lock.json
# Yarn
yarn.lock
# Testing # Testing
/coverage /coverage
@ -11,6 +14,11 @@ package-lock.json
/build /build
/src/build /src/build
# Logs
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Misc # Misc
.DS_Store .DS_Store
.env.local .env.local
@ -18,9 +26,5 @@ package-lock.json
.env.test.local .env.test.local
.env.production.local .env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Jetbrains # Jetbrains
.idea .idea

7
contracts/Forum.sol

@ -1,4 +1,4 @@
pragma solidity ^0.4.17; pragma solidity ^0.4.21;
contract Forum { contract Forum {
@ -13,10 +13,15 @@ contract Forum {
mapping (address => User) users; mapping (address => User) users;
mapping (string => address) userAddresses; mapping (string => address) userAddresses;
event UserSignedUp(
string userName
);
function signUp(string userName) public returns (bool) { // Also allows user to update his name - TODO: his previous name will appear as taken function signUp(string userName) public returns (bool) { // Also allows user to update his name - TODO: his previous name will appear as taken
require(!isUserNameTaken(userName)); require(!isUserNameTaken(userName));
users[msg.sender] = User(userName, new uint[](0), new uint[](0)); users[msg.sender] = User(userName, new uint[](0), new uint[](0));
userAddresses[userName] = msg.sender; userAddresses[userName] = msg.sender;
emit UserSignedUp(userName);
return true; return true;
} }

2
contracts/Migrations.sol

@ -1,4 +1,4 @@
pragma solidity ^0.4.19; pragma solidity ^0.4.21;
contract Migrations { contract Migrations {
address public owner; address public owner;

4
package.json

@ -10,6 +10,9 @@
"truffle-contract": "^3.0.4" "truffle-contract": "^3.0.4"
}, },
"dependencies": { "dependencies": {
"drizzle": "^1.1.4",
"drizzle-react": "^1.1.1",
"drizzle-react-components": "^1.1.0",
"react": "^16.3.0", "react": "^16.3.0",
"react-dom": "^16.3.0", "react-dom": "^16.3.0",
"react-scripts": "1.1.1", "react-scripts": "1.1.1",
@ -18,6 +21,7 @@
"react-router-redux": "^4.0.8", "react-router-redux": "^4.0.8",
"redux": "^3.7.2", "redux": "^3.7.2",
"redux-auth-wrapper": "1.1.0", "redux-auth-wrapper": "1.1.0",
"redux-saga": "0.16.0",
"redux-thunk": "^2.2.0" "redux-thunk": "^2.2.0"
}, },
"scripts": { "scripts": {

42
src/index.js

@ -1,22 +1,23 @@
import React from 'react'; import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import { Router, Route, IndexRoute, browserHistory } from 'react-router' import { Router, Route, IndexRoute, browserHistory } from 'react-router'
import { Provider } from 'react-redux' import { DrizzleProvider } from 'drizzle-react'
import { syncHistoryWithStore } from 'react-router-redux' import { syncHistoryWithStore } from 'react-router-redux'
import { UserIsAuthenticated, UserIsNotAuthenticated } from './util/wrappers.js' import { UserIsAuthenticated, UserIsNotAuthenticated } from './util/wrappers.js'
import getWeb3 from "./util/web3/getWeb3";
// Layouts // Layouts
import App from './App' import App from './App'
import Home from './layouts/home/Home' import HomeContainer from './layouts/home/HomeContainer'
import Dashboard from './layouts/dashboard/Dashboard' import Dashboard from './layouts/dashboard/Dashboard'
import SignUp from './user/layouts/signup/SignUp' import SignUp from './user/layouts/signup/SignUp'
import Profile from './user/layouts/profile/Profile' import Profile from './user/layouts/profile/Profile'
import {LoadingContainer} from 'drizzle-react-components'
import './index.css'; //??? import './index.css'; //???
// Redux Store // Redux Store
import store from './store' import store from './store'
import drizzleOptions from './util/drizzle/drizzleOptions'
// ServiceWorker // ServiceWorker
import registerServiceWorker from './registerServiceWorker'; import registerServiceWorker from './registerServiceWorker';
@ -24,28 +25,19 @@ import registerServiceWorker from './registerServiceWorker';
// Initialize react-router-redux. // Initialize react-router-redux.
const history = syncHistoryWithStore(browserHistory, store); const history = syncHistoryWithStore(browserHistory, store);
// Initialize web3 and set in Redux.
getWeb3
.then(results => {
console.log('Web3 initialized!')
})
.catch(() => {
console.log('Error in web3 initialization.')
});
ReactDOM.render(( ReactDOM.render((
<Provider store={store}> <DrizzleProvider options={drizzleOptions} store={store}>
<Router history={history}> <LoadingContainer>
<Route path="/" component={App}> <Router history={history}>
<IndexRoute component={Home} /> <Route path="/" component={App}>
<Route path="dashboard" component={UserIsAuthenticated(Dashboard)} /> <IndexRoute component={HomeContainer} />
<Route path="signup" component={UserIsNotAuthenticated(SignUp)} /> <Route path="dashboard" component={UserIsAuthenticated(Dashboard)} />
<Route path="profile" component={UserIsAuthenticated(Profile)} /> <Route path="signup" component={UserIsNotAuthenticated(SignUp)} />
</Route> <Route path="profile" component={UserIsAuthenticated(Profile)} />
</Router> </Route>
</Provider> </Router>
</LoadingContainer>
</DrizzleProvider>
), ),
document.getElementById('root') document.getElementById('root')
); );

14
src/layouts/home/HomeContainer.js

@ -0,0 +1,14 @@
import Home from './Home'
import { drizzleConnect } from 'drizzle-react'
// May still need this even with data function to refresh component on updates for this contract.
const mapStateToProps = state => {
return {
Forum: state.contracts.Forum,
drizzleStatus: state.drizzleStatus
}
};
const HomeContainer = drizzleConnect(Home, mapStateToProps);
export default HomeContainer

4
src/reducer.js

@ -1,12 +1,12 @@
import { combineReducers } from 'redux' import { combineReducers } from 'redux'
import { routerReducer } from 'react-router-redux' import { routerReducer } from 'react-router-redux'
import userReducer from './user/userReducer' import userReducer from './user/userReducer'
import web3Reducer from './util/web3/web3Reducer' import { drizzleReducers } from 'drizzle'
const reducer = combineReducers({ const reducer = combineReducers({
routing: routerReducer, routing: routerReducer,
user: userReducer, user: userReducer,
web3: web3Reducer ...drizzleReducers
}); });
export default reducer export default reducer

26
src/store.js

@ -1,22 +1,34 @@
import { browserHistory } from 'react-router' import {browserHistory} from 'react-router'
import { createStore, applyMiddleware, compose } from 'redux' import {createStore, applyMiddleware, compose} from 'redux'
import thunkMiddleware from 'redux-thunk' import thunkMiddleware from 'redux-thunk'
import { routerMiddleware } from 'react-router-redux' import {routerMiddleware} from 'react-router-redux'
import reducer from './reducer' import reducer from './reducer'
import rootSaga from './util/drizzle/rootSaga'
import createSagaMiddleware from 'redux-saga'
import {generateContractsInitialState} from 'drizzle'
import drizzleOptions from './util/drizzle/drizzleOptions'
// Redux DevTools (see also https://github.com/zalmoxisus/redux-devtools-extension#12-advanced-store-setup) // Redux DevTools (see also https://github.com/zalmoxisus/redux-devtools-extension#12-advanced-store-setup)
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const routingMiddleware = routerMiddleware(browserHistory); const routingMiddleware = routerMiddleware(browserHistory);
const sagaMiddleware = createSagaMiddleware();
const initialState = {
contracts: generateContractsInitialState(drizzleOptions)
};
const store = createStore( const store = createStore(
reducer, reducer,
composeEnhancers( initialState,
composeEnhancers(
applyMiddleware( applyMiddleware(
thunkMiddleware, thunkMiddleware,
routingMiddleware routingMiddleware,
sagaMiddleware
) )
) )
); );
sagaMiddleware.run(rootSaga);
export default store export default store

18
src/util/drizzle/drizzleOptions.js

@ -0,0 +1,18 @@
import Forum from './../../build/contracts/Forum.json'
const drizzleOptions = {
web3: {
fallback: {
type: 'ws',
url: 'ws://127.0.0.1:8545'
}
},
contracts: [
Forum
],
events: {
Forum: ['UserSignedUp']
}
};
export default drizzleOptions

8
src/util/drizzle/rootSaga.js

@ -0,0 +1,8 @@
import { all, fork } from 'redux-saga/effects'
import { drizzleSagas } from 'drizzle'
export default function* root() {
yield all(
drizzleSagas.map(saga => fork(saga))
)
}

51
src/util/web3/getWeb3.js

@ -1,51 +0,0 @@
import store from '../../store'
import Web3 from 'web3'
export const WEB3_INITIALIZED = 'WEB3_INITIALIZED';
function web3Initialized(results) {
return {
type: WEB3_INITIALIZED,
payload: results
}
}
let getWeb3 = new Promise(function(resolve, reject) {
// Wait for loading completion to avoid race conditions with web3 injection timing.
window.addEventListener('load', function(dispatch) {
var results;
var web3 = window.web3;
// Checking if Web3 has been injected by the browser (Mist/MetaMask)
if (typeof web3 !== 'undefined') {
// Use Mist/MetaMask's provider.
web3 = new Web3(web3.currentProvider);
results = {
web3Instance: web3
};
console.log('Injected web3 detected.');
resolve(store.dispatch(web3Initialized(results)))
} else {
// Fallback to localhost if no web3 injection.
var provider = new Web3.providers.HttpProvider('http://localhost:8545');
web3 = new Web3(provider);
results = {
web3Instance: web3
};
console.log('No web3 instance injected, using Local web3.');
resolve(store.dispatch(web3Initialized(results)))
}
// TODO: Error checking.
})
});
export default getWeb3

16
src/util/web3/web3Reducer.js

@ -1,16 +0,0 @@
const initialState = {
web3Instance: null
};
const web3Reducer = (state = initialState, action) => {
if (action.type === 'WEB3_INITIALIZED')
{
return Object.assign({}, state, {
web3Instance: action.payload.web3Instance
})
}
return state
};
export default web3Reducer
Loading…
Cancel
Save