From 9134f07fec4ac05f64b41397f5f5688ccea84804 Mon Sep 17 00:00:00 2001 From: Ezerous Date: Mon, 23 Apr 2018 15:43:38 +0300 Subject: [PATCH] Initial attempt --- .gitignore | 12 ++++--- contracts/Forum.sol | 7 +++- contracts/Migrations.sol | 2 +- package.json | 4 +++ src/index.js | 42 ++++++++++-------------- src/layouts/home/HomeContainer.js | 14 ++++++++ src/reducer.js | 4 +-- src/store.js | 26 +++++++++++---- src/util/drizzle/drizzleOptions.js | 18 +++++++++++ src/util/drizzle/rootSaga.js | 8 +++++ src/util/web3/getWeb3.js | 51 ------------------------------ src/util/web3/web3Reducer.js | 16 ---------- 12 files changed, 97 insertions(+), 107 deletions(-) create mode 100644 src/layouts/home/HomeContainer.js create mode 100644 src/util/drizzle/drizzleOptions.js create mode 100644 src/util/drizzle/rootSaga.js delete mode 100644 src/util/web3/getWeb3.js delete mode 100644 src/util/web3/web3Reducer.js diff --git a/.gitignore b/.gitignore index dd40e6f..ac47e30 100644 --- a/.gitignore +++ b/.gitignore @@ -4,6 +4,9 @@ /node_modules package-lock.json +# Yarn +yarn.lock + # Testing /coverage @@ -11,6 +14,11 @@ package-lock.json /build /src/build +# Logs +npm-debug.log* +yarn-debug.log* +yarn-error.log* + # Misc .DS_Store .env.local @@ -18,9 +26,5 @@ package-lock.json .env.test.local .env.production.local -npm-debug.log* -yarn-debug.log* -yarn-error.log* - # Jetbrains .idea diff --git a/contracts/Forum.sol b/contracts/Forum.sol index 3732646..eef2e82 100644 --- a/contracts/Forum.sol +++ b/contracts/Forum.sol @@ -1,4 +1,4 @@ -pragma solidity ^0.4.17; +pragma solidity ^0.4.21; contract Forum { @@ -13,10 +13,15 @@ contract Forum { mapping (address => User) users; 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 require(!isUserNameTaken(userName)); users[msg.sender] = User(userName, new uint[](0), new uint[](0)); userAddresses[userName] = msg.sender; + emit UserSignedUp(userName); return true; } diff --git a/contracts/Migrations.sol b/contracts/Migrations.sol index 26d7ce9..27598ad 100644 --- a/contracts/Migrations.sol +++ b/contracts/Migrations.sol @@ -1,4 +1,4 @@ -pragma solidity ^0.4.19; +pragma solidity ^0.4.21; contract Migrations { address public owner; diff --git a/package.json b/package.json index 6ffc6e6..108b889 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,9 @@ "truffle-contract": "^3.0.4" }, "dependencies": { + "drizzle": "^1.1.4", + "drizzle-react": "^1.1.1", + "drizzle-react-components": "^1.1.0", "react": "^16.3.0", "react-dom": "^16.3.0", "react-scripts": "1.1.1", @@ -18,6 +21,7 @@ "react-router-redux": "^4.0.8", "redux": "^3.7.2", "redux-auth-wrapper": "1.1.0", + "redux-saga": "0.16.0", "redux-thunk": "^2.2.0" }, "scripts": { diff --git a/src/index.js b/src/index.js index 0c2ee1b..16f0ed1 100644 --- a/src/index.js +++ b/src/index.js @@ -1,22 +1,23 @@ import React from 'react'; import ReactDOM from 'react-dom'; 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 { UserIsAuthenticated, UserIsNotAuthenticated } from './util/wrappers.js' -import getWeb3 from "./util/web3/getWeb3"; // Layouts import App from './App' -import Home from './layouts/home/Home' +import HomeContainer from './layouts/home/HomeContainer' import Dashboard from './layouts/dashboard/Dashboard' import SignUp from './user/layouts/signup/SignUp' import Profile from './user/layouts/profile/Profile' - +import {LoadingContainer} from 'drizzle-react-components' import './index.css'; //??? + // Redux Store import store from './store' +import drizzleOptions from './util/drizzle/drizzleOptions' // ServiceWorker import registerServiceWorker from './registerServiceWorker'; @@ -24,28 +25,19 @@ import registerServiceWorker from './registerServiceWorker'; // Initialize react-router-redux. 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(( - - - - - - - - - - + + + + + + + + + + + + ), document.getElementById('root') ); diff --git a/src/layouts/home/HomeContainer.js b/src/layouts/home/HomeContainer.js new file mode 100644 index 0000000..ac699a5 --- /dev/null +++ b/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 diff --git a/src/reducer.js b/src/reducer.js index 2af2517..4c54292 100644 --- a/src/reducer.js +++ b/src/reducer.js @@ -1,12 +1,12 @@ import { combineReducers } from 'redux' import { routerReducer } from 'react-router-redux' import userReducer from './user/userReducer' -import web3Reducer from './util/web3/web3Reducer' +import { drizzleReducers } from 'drizzle' const reducer = combineReducers({ routing: routerReducer, user: userReducer, - web3: web3Reducer + ...drizzleReducers }); export default reducer diff --git a/src/store.js b/src/store.js index 0c98744..5f73ee5 100644 --- a/src/store.js +++ b/src/store.js @@ -1,22 +1,34 @@ -import { browserHistory } from 'react-router' -import { createStore, applyMiddleware, compose } from 'redux' +import {browserHistory} from 'react-router' +import {createStore, applyMiddleware, compose} from 'redux' import thunkMiddleware from 'redux-thunk' -import { routerMiddleware } from 'react-router-redux' +import {routerMiddleware} from 'react-router-redux' 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) const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; const routingMiddleware = routerMiddleware(browserHistory); +const sagaMiddleware = createSagaMiddleware(); + +const initialState = { + contracts: generateContractsInitialState(drizzleOptions) +}; const store = createStore( - reducer, - composeEnhancers( + reducer, + initialState, + composeEnhancers( applyMiddleware( - thunkMiddleware, - routingMiddleware + thunkMiddleware, + routingMiddleware, + sagaMiddleware ) ) ); +sagaMiddleware.run(rootSaga); export default store diff --git a/src/util/drizzle/drizzleOptions.js b/src/util/drizzle/drizzleOptions.js new file mode 100644 index 0000000..798ab7d --- /dev/null +++ b/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 \ No newline at end of file diff --git a/src/util/drizzle/rootSaga.js b/src/util/drizzle/rootSaga.js new file mode 100644 index 0000000..d9f654b --- /dev/null +++ b/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)) + ) +} \ No newline at end of file diff --git a/src/util/web3/getWeb3.js b/src/util/web3/getWeb3.js deleted file mode 100644 index 33d0ca7..0000000 --- a/src/util/web3/getWeb3.js +++ /dev/null @@ -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 \ No newline at end of file diff --git a/src/util/web3/web3Reducer.js b/src/util/web3/web3Reducer.js deleted file mode 100644 index be08027..0000000 --- a/src/util/web3/web3Reducer.js +++ /dev/null @@ -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