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..0fc71f3 100644 --- a/contracts/Forum.sol +++ b/contracts/Forum.sol @@ -1,51 +1,62 @@ -pragma solidity ^0.4.17; +pragma solidity ^0.4.23; contract Forum { - //----------------------------------------USER---------------------------------------- + //----------------------------------------AUTHENTICATION---------------------------------------- struct User { - string userName; // TODO: set an upper bound instead of arbitrary string + string username; // TODO: set an upper bound instead of arbitrary string // TODO: orbitDBAddress; uint[] topicIDs; // IDs of the topics the user created uint[] postIDs; // IDs of the posts the user created + bool signedUp; // Helper variable for hasUserSignedUp() } mapping (address => User) users; mapping (string => address) userAddresses; - 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; + event UserSignedUp(string username, address userAddress); + event UsernameUpdated(string newName, string oldName,address userAddress); + + function signUp(string username) public returns (bool) { + require (!hasUserSignedUp(msg.sender), "User has already signed up."); + require(!isUserNameTaken(username), "Username is already taken."); + users[msg.sender] = User(username, new uint[](0), new uint[](0), true); + userAddresses[username] = msg.sender; + emit UserSignedUp(username, msg.sender); return true; } - function login() public view returns (string) { - require (hasUserSignedUp(msg.sender)); - return users[msg.sender].userName; + function updateUsername(string newUsername) public returns (bool) { + require (hasUserSignedUp(msg.sender), "User hasn't signed up yet."); + require(!isUserNameTaken(newUsername), "Username is already taken."); + string memory oldUsername = getUsername(msg.sender); + delete userAddresses[users[msg.sender].username]; + users[msg.sender].username = newUsername; + userAddresses[newUsername] = msg.sender; + emit UsernameUpdated(newUsername, oldUsername, msg.sender); + return true; } function getUsername(address userAddress) public view returns (string) { - return users[userAddress].userName; + return users[userAddress].username; } - function getUserAddress(string userName) public view returns (address) { - return userAddresses[userName]; + function getUserAddress(string username) public view returns (address) { + return userAddresses[username]; } function hasUserSignedUp(address userAddress) public view returns (bool) { - if (bytes(getUsername(userAddress)).length!=0) - return true; - return false; + return users[userAddress].signedUp; } - function isUserNameTaken(string userName) public view returns (bool) { - if (getUserAddress(userName)!=0) + function isUserNameTaken(string username) public view returns (bool) { + if (getUserAddress(username)!=address(0)) return true; return false; } - //----------------------------------------TOPIC---------------------------------------- + + //----------------------------------------POSTING---------------------------------------- struct Topic { uint topicID; address author; diff --git a/contracts/Migrations.sol b/contracts/Migrations.sol index 26d7ce9..184150a 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; @@ -8,7 +8,7 @@ contract Migrations { if (msg.sender == owner) _; } - function Migrations() public { + constructor() public { owner = msg.sender; } @@ -20,4 +20,4 @@ contract Migrations { Migrations upgraded = Migrations(new_address); upgraded.setCompleted(last_completed_migration); } -} +} \ No newline at end of file diff --git a/package.json b/package.json index 6ffc6e6..159cbbf 100644 --- a/package.json +++ b/package.json @@ -6,19 +6,22 @@ "type": "git", "url": "https://gitlab.com/Ezerous/Apella.git" }, - "devDependencies": { - "truffle-contract": "^3.0.4" - }, "dependencies": { - "react": "^16.3.0", - "react-dom": "^16.3.0", - "react-scripts": "1.1.1", + "drizzle": "^1.1.5", + "drizzle-react": "^1.1.1", + "drizzle-react-components": "^1.1.0", + "eth-block-tracker-es5": "^2.3.2", + "prop-types": "^15.6.1", + "react": "^16.3.2", + "react-dom": "^16.3.2", + "react-scripts": "^1.1.4", "react-redux": "^5.0.7", - "react-router": "3.2.1", + "react-router": "^3.2.1", "react-router-redux": "^4.0.8", "redux": "^3.7.2", "redux-auth-wrapper": "1.1.0", - "redux-thunk": "^2.2.0" + "redux-saga": "0.16.0", + "web3":"^1.0.0-beta.34" }, "scripts": { "start": "react-scripts start", diff --git a/public/manifest.json b/public/manifest.json deleted file mode 100644 index 0bcfdd4..0000000 --- a/public/manifest.json +++ /dev/null @@ -1,15 +0,0 @@ -{ - "short_name": "Apella", - "name": "Apella", - "icons": [ - { - "src": "favicon.ico", - "sizes": "64x64 32x32 24x24 16x16", - "type": "image/x-icon" - } - ], - "start_url": "./index.html", - "display": "standalone", - "theme_color": "#000000", - "background_color": "#ffffff" -} diff --git a/src/App.js b/src/App.js index 41c5ef9..f51c726 100644 --- a/src/App.js +++ b/src/App.js @@ -1,52 +1,19 @@ import React, { Component } from 'react' -import { Link } from 'react-router' -import { HiddenOnlyAuth, VisibleOnlyAuth } from './util/wrappers.js' - -// UI Components -import LoginButtonContainer from './user/ui/loginbutton/LoginButtonContainer' // Styles import './css/oswald.css' import './css/open-sans.css' import './css/pure-min.css' -import './App.css' +import './css/App.css' class App extends Component { - render() { - const OnlyAuthLinks = VisibleOnlyAuth(() => - -
  • - Dashboard -
  • -
  • - Profile -
  • -
    - ); - - const OnlyGuestLinks = HiddenOnlyAuth(() => - -
  • - Sign Up -
  • - -
    - ); - - return ( -
    - - - {this.props.children} -
    - ); - } + render() { + return ( +
    + {this.props.children} +
    + ); + } } export default App diff --git a/src/App.test.js b/src/App.test.js index a754b20..b84af98 100644 --- a/src/App.test.js +++ b/src/App.test.js @@ -5,5 +5,4 @@ import App from './App'; it('renders without crashing', () => { const div = document.createElement('div'); ReactDOM.render(, div); - ReactDOM.unmountComponentAtNode(div); }); diff --git a/src/containers/AuthWrapperContainer.js b/src/containers/AuthWrapperContainer.js new file mode 100644 index 0000000..ce2ad11 --- /dev/null +++ b/src/containers/AuthWrapperContainer.js @@ -0,0 +1,48 @@ +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 new file mode 100644 index 0000000..469a47f --- /dev/null +++ b/src/containers/UsernameFormContainer.js @@ -0,0 +1,103 @@ +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"; +const updateUsernameMethod ="updateUsername"; + +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.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] = ''; + } + + } + } + console.dir(initialState); + this.state = initialState; + } + + handleSignUp() { + this.contracts[contract].methods[signUpMethod].cacheSend(...Object.values(this.state.signUp)); + } + + handleUsernameUpdate() { + this.contracts[contract].methods[updateUsernameMethod].cacheSend(...Object.values(this.state.updateUsername)); + } + + 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} }); + } + + + render() { + let signUp = this.inputs.signUp[0].name; //username + let updateUsername = this.inputs.updateUsername[0].name; //newUsername + return ( + + + + + } + guestRender={ +
    + + +
    + } + /> + + + ) + } +} + +UsernameFormContainer.contextTypes = { + drizzle: PropTypes.object +}; + +const mapStateToProps = state => { + return { + contracts: state.contracts + } +}; + +export default drizzleConnect(UsernameFormContainer, mapStateToProps) \ No newline at end of file diff --git a/src/App.css b/src/css/App.css similarity index 58% rename from src/App.css rename to src/css/App.css index d6e66c0..2346633 100644 --- a/src/App.css +++ b/src/css/App.css @@ -5,21 +5,26 @@ body, font-family: 'Open Sans', sans-serif; } +.header { + text-align: center; +} + h1, h2, h3 { font-family: 'Oswald', 'Arial Narrow', sans-serif; } code { - display: block; - margin: 20px 0 15px 0; - padding: 10px; + padding: .25rem; + margin: 0 .25rem; background: #eee; } .container { box-sizing: border-box; - width: 100%; + width: calc(100% - 60px); + max-width: 600px; padding: 45px 20px; + margin: 0 auto; } .pure-button-primary { @@ -34,6 +39,15 @@ code { border-color: #0c1a2b; } +ul { + list-style-type: none; + padding-left: 0; +} + +ul li:not(:last-child) { + margin-bottom: 15px; +} + /* NAVBAR */ .navbar { @@ -66,3 +80,31 @@ code { height: 16px; margin-right: 10px; } + +/* LOADING SCREEN */ + +.loading-screen { + opacity: 1; + visibility: visible; + transition: all .25s ease-in-out; +} + +.loading-screen.loaded { + opacity: 0; + visibility: hidden; +} + +/* FORMS */ + +.pure-form { + display: inline-block; +} + +/* ALERTS */ + +.alert { + padding: .5rem; + color: darkgreen; + background: darkseagreen; + border: 1px solid darkgreen; +} \ No newline at end of file diff --git a/src/index.css b/src/css/index.css similarity index 100% rename from src/index.css rename to src/css/index.css diff --git a/src/drizzleOptions.js b/src/drizzleOptions.js new file mode 100644 index 0000000..e6889d8 --- /dev/null +++ b/src/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/index.js b/src/index.js index 0c2ee1b..7877e8d 100644 --- a/src/index.js +++ b/src/index.js @@ -1,54 +1,32 @@ import React from 'react'; -import ReactDOM from 'react-dom'; +import { render } from 'react-dom'; import { Router, Route, IndexRoute, browserHistory } from 'react-router' -import { Provider } from 'react-redux' import { syncHistoryWithStore } from 'react-router-redux' -import { UserIsAuthenticated, UserIsNotAuthenticated } from './util/wrappers.js' -import getWeb3 from "./util/web3/getWeb3"; +import { DrizzleProvider } from 'drizzle-react' // Layouts import App from './App' -import Home from './layouts/home/Home' -import Dashboard from './layouts/dashboard/Dashboard' -import SignUp from './user/layouts/signup/SignUp' -import Profile from './user/layouts/profile/Profile' +import HomeContainer from './layouts/home/HomeContainer' +import { LoadingContainer } from 'drizzle-react-components' - -import './index.css'; //??? -// Redux Store import store from './store' +import drizzleOptions from './drizzleOptions' -// ServiceWorker -import registerServiceWorker from './registerServiceWorker'; +import './css/index.css' // 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') +render(( + + + + + + + + + + ), + document.getElementById('root') ); - -registerServiceWorker(); - diff --git a/src/layouts/dashboard/Dashboard.js b/src/layouts/dashboard/Dashboard.js deleted file mode 100644 index b2ae92d..0000000 --- a/src/layouts/dashboard/Dashboard.js +++ /dev/null @@ -1,23 +0,0 @@ -import React, { Component } from 'react' - -class Dashboard extends Component { - constructor(props, { authData }) { - super(props); - authData = this.props - } - - render() { - return( -
    -
    -
    -

    Dashboard

    -

    Congratulations {this.props.authData.name}! If you're seeing this page, you've logged in with your own smart contract successfully.

    -
    -
    -
    - ) - } -} - -export default Dashboard diff --git a/src/layouts/home/Home.js b/src/layouts/home/Home.js index eb409e1..2b68cc5 100644 --- a/src/layouts/home/Home.js +++ b/src/layouts/home/Home.js @@ -1,13 +1,22 @@ import React, { Component } from 'react' +import { AccountData, ContractData } from 'drizzle-react-components' +import UsernameFormContainer from '../../containers/UsernameFormContainer' class Home extends Component { render() { - return( + return (
    +
    +

    Apella

    +

    +
    -

    Welcome!

    -

    Lorem ipsum dolor sit amet, tempor vitae vivamus senectus id risus, nulla in, urna sed vitae at ac. Parturient fringilla vestibulum, vitae metus tempus, augue sollicitudin, faucibus scelerisque suspendisse, consectetuer massa fermentum tellus interdum neque. Luctus euismod, nam sodales, non aliquam luctus lorem tellus, habitasse porttitor fusce sed mauris omnis massa, mauris felis pede sodales ligula semper. Amet ut id voluptatum. Nunc amet sem, fusce wisi interdum, et a. Fusce dolor augue in non aliquam, id vestibulum, lacinia diam ante sit felis et, viverra velit, nulla sociosqu autem.

    +

    Account

    + +

    Username:

    + +

    diff --git a/src/layouts/home/HomeContainer.js b/src/layouts/home/HomeContainer.js new file mode 100644 index 0000000..1eb73eb --- /dev/null +++ b/src/layouts/home/HomeContainer.js @@ -0,0 +1,15 @@ +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 { + accounts: state.accounts, + 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..9db9303 100644 --- a/src/reducer.js +++ b/src/reducer.js @@ -1,12 +1,10 @@ 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/registerServiceWorker.js b/src/registerServiceWorker.js deleted file mode 100644 index a3e6c0c..0000000 --- a/src/registerServiceWorker.js +++ /dev/null @@ -1,117 +0,0 @@ -// In production, we register a service worker to serve assets from local cache. - -// This lets the app load faster on subsequent visits in production, and gives -// it offline capabilities. However, it also means that developers (and users) -// will only see deployed updates on the "N+1" visit to a page, since previously -// cached resources are updated in the background. - -// To learn more about the benefits of this model, read https://goo.gl/KwvDNy. -// This link also includes instructions on opting out of this behavior. - -const isLocalhost = Boolean( - window.location.hostname === 'localhost' || - // [::1] is the IPv6 localhost address. - window.location.hostname === '[::1]' || - // 127.0.0.1/8 is considered localhost for IPv4. - window.location.hostname.match( - /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/ - ) -); - -export default function register() { - if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) { - // The URL constructor is available in all browsers that support SW. - const publicUrl = new URL(process.env.PUBLIC_URL, window.location); - if (publicUrl.origin !== window.location.origin) { - // Our service worker won't work if PUBLIC_URL is on a different origin - // from what our page is served on. This might happen if a CDN is used to - // serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374 - return; - } - - window.addEventListener('load', () => { - const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`; - - if (isLocalhost) { - // This is running on localhost. Lets check if a service worker still exists or not. - checkValidServiceWorker(swUrl); - - // Add some additional logging to localhost, pointing developers to the - // service worker/PWA documentation. - navigator.serviceWorker.ready.then(() => { - console.log( - 'This web app is being served cache-first by a service ' + - 'worker. To learn more, visit https://goo.gl/SC7cgQ' - ); - }); - } else { - // Is not local host. Just register service worker - registerValidSW(swUrl); - } - }); - } -} - -function registerValidSW(swUrl) { - navigator.serviceWorker - .register(swUrl) - .then(registration => { - registration.onupdatefound = () => { - const installingWorker = registration.installing; - installingWorker.onstatechange = () => { - if (installingWorker.state === 'installed') { - if (navigator.serviceWorker.controller) { - // At this point, the old content will have been purged and - // the fresh content will have been added to the cache. - // It's the perfect time to display a "New content is - // available; please refresh." message in your web app. - console.log('New content is available; please refresh.'); - } else { - // At this point, everything has been precached. - // It's the perfect time to display a - // "Content is cached for offline use." message. - console.log('Content is cached for offline use.'); - } - } - }; - }; - }) - .catch(error => { - console.error('Error during service worker registration:', error); - }); -} - -function checkValidServiceWorker(swUrl) { - // Check if the service worker can be found. If it can't reload the page. - fetch(swUrl) - .then(response => { - // Ensure service worker exists, and that we really are getting a JS file. - if ( - response.status === 404 || - response.headers.get('content-type').indexOf('javascript') === -1 - ) { - // No service worker found. Probably a different app. Reload the page. - navigator.serviceWorker.ready.then(registration => { - registration.unregister().then(() => { - window.location.reload(); - }); - }); - } else { - // Service worker found. Proceed as normal. - registerValidSW(swUrl); - } - }) - .catch(() => { - console.log( - 'No internet connection found. App is running in offline mode.' - ); - }); -} - -export function unregister() { - if ('serviceWorker' in navigator) { - navigator.serviceWorker.ready.then(registration => { - registration.unregister(); - }); - } -} diff --git a/src/rootSaga.js b/src/rootSaga.js new file mode 100644 index 0000000..d9f654b --- /dev/null +++ b/src/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/store.js b/src/store.js index 0c98744..bc333fe 100644 --- a/src/store.js +++ b/src/store.js @@ -1,22 +1,33 @@ import { browserHistory } from 'react-router' import { createStore, applyMiddleware, compose } from 'redux' -import thunkMiddleware from 'redux-thunk' import { routerMiddleware } from 'react-router-redux' import reducer from './reducer' +import rootSaga from './rootSaga' +import createSagaMiddleware from 'redux-saga' +import { generateContractsInitialState } from 'drizzle' +import drizzleOptions from './drizzleOptions' -// Redux DevTools (see also https://github.com/zalmoxisus/redux-devtools-extension#12-advanced-store-setup) +// Redux DevTools const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; const routingMiddleware = routerMiddleware(browserHistory); +const sagaMiddleware = createSagaMiddleware(); + +const initialState = { + contracts: generateContractsInitialState(drizzleOptions) +}; const store = createStore( reducer, + initialState, composeEnhancers( applyMiddleware( - thunkMiddleware, - routingMiddleware + routingMiddleware, + sagaMiddleware ) ) ); -export default store +sagaMiddleware.run(rootSaga); + +export default store \ No newline at end of file diff --git a/src/user/layouts/profile/Profile.js b/src/user/layouts/profile/Profile.js deleted file mode 100644 index 6dfb688..0000000 --- a/src/user/layouts/profile/Profile.js +++ /dev/null @@ -1,20 +0,0 @@ -import React, { Component } from 'react' -import ProfileFormContainer from '../../ui/profileform/ProfileFormContainer' - -class Profile extends Component { - render() { - return( -
    -
    -
    -

    Profile

    -

    Edit your account details here.

    - -
    -
    -
    - ) - } -} - -export default Profile diff --git a/src/user/layouts/signup/SignUp.js b/src/user/layouts/signup/SignUp.js deleted file mode 100644 index 069e379..0000000 --- a/src/user/layouts/signup/SignUp.js +++ /dev/null @@ -1,20 +0,0 @@ -import React, { Component } from 'react' -import SignUpFormContainer from '../../ui/signupform/SignUpFormContainer' - -class SignUp extends Component { - render() { - return( -
    -
    -
    -

    Sign Up

    -

    We've got your wallet information, simply input your name and your account is made!

    - -
    -
    -
    - ) - } -} - -export default SignUp diff --git a/src/user/ui/loginbutton/LoginButton.js b/src/user/ui/loginbutton/LoginButton.js deleted file mode 100644 index 6ba658b..0000000 --- a/src/user/ui/loginbutton/LoginButton.js +++ /dev/null @@ -1,11 +0,0 @@ -import React from 'react' - -const LoginButton = ({ onLoginUserClick }) => { - return( -
  • - onLoginUserClick(event)}>Login -
  • - ) -}; - -export default LoginButton diff --git a/src/user/ui/loginbutton/LoginButtonActions.js b/src/user/ui/loginbutton/LoginButtonActions.js deleted file mode 100644 index 994cedc..0000000 --- a/src/user/ui/loginbutton/LoginButtonActions.js +++ /dev/null @@ -1,69 +0,0 @@ -import ForumContract from '../../../build/contracts/Forum.json' -import { browserHistory } from 'react-router' -import store from '../../../store' - -const contract = require('truffle-contract'); - -export const USER_LOGGED_IN = 'USER_LOGGED_IN'; -function userLoggedIn(user) { - return { - type: USER_LOGGED_IN, - payload: user - } -} - -export function loginUser() { - let web3 = store.getState().web3.web3Instance; - - // Double-check web3's status. - if (typeof web3 !== 'undefined') { - - return function(dispatch) { - // Using truffle-contract we create the authentication object. - const authentication = contract(ForumContract); - authentication.setProvider(web3.currentProvider); - - // Declaring this for later so we can chain functions on Authentication. - let authenticationInstance; - - // Get current ethereum wallet. - web3.eth.getCoinbase((error, coinbase) => { - // Log errors, if any. - if (error) { - console.error(error); - } - - authentication.deployed().then(function(instance) { - authenticationInstance = instance; - - // Attempt to login user. - authenticationInstance.login({from: coinbase}) - .then(function(result) { - // If no error, login user. - console.log("Login successful: " + JSON.parse(result)); - dispatch(userLoggedIn({"name": JSON.parse(result)})); - - // Used a manual redirect here as opposed to a wrapper. - // This way, once logged in a user can still access the home page. - let currentLocation = browserHistory.getCurrentLocation(); - - if ('redirect' in currentLocation.query) - return browserHistory.push(decodeURIComponent(currentLocation.query.redirect)); - - - return browserHistory.push('/dashboard') - }) - .catch(function(result) { - // If error, go to signup page. - console.error('Wallet ' + coinbase + ' does not have an account!'); - console.error('Error: ' + result); - - return browserHistory.push('/signup') - }) - }) - }) - } - } else { - console.error('Web3 is not initialized.'); - } -} diff --git a/src/user/ui/loginbutton/LoginButtonContainer.js b/src/user/ui/loginbutton/LoginButtonContainer.js deleted file mode 100644 index 244876c..0000000 --- a/src/user/ui/loginbutton/LoginButtonContainer.js +++ /dev/null @@ -1,23 +0,0 @@ -import { connect } from 'react-redux' -import LoginButton from './LoginButton' -import { loginUser } from './LoginButtonActions' - -const mapStateToProps = (state, ownProps) => { - return {} -}; - -const mapDispatchToProps = (dispatch) => { - return { - onLoginUserClick: (event) => { - event.preventDefault(); - dispatch(loginUser()); - } - } -}; - -const LoginButtonContainer = connect( - mapStateToProps, - mapDispatchToProps -)(LoginButton); - -export default LoginButtonContainer diff --git a/src/user/ui/profileform/ProfileForm.js b/src/user/ui/profileform/ProfileForm.js deleted file mode 100644 index 2ec114c..0000000 --- a/src/user/ui/profileform/ProfileForm.js +++ /dev/null @@ -1,42 +0,0 @@ -import React, { Component } from 'react' - -class ProfileForm extends Component { - constructor(props) { - super(props); - - this.state = { - name: this.props.name - } - } - - onInputChange(event) { - this.setState({ name: event.target.value }) - } - - handleSubmit(event) { - event.preventDefault(); - - if (this.state.name.length < 2) - return alert('Please fill in your name.'); - - this.props.onProfileFormSubmit(this.state.name, event) - } - - render() { - return( -
    -
    - - - This is a required field. - -
    - - -
    -
    - ) - } -} - -export default ProfileForm diff --git a/src/user/ui/profileform/ProfileFormActions.js b/src/user/ui/profileform/ProfileFormActions.js deleted file mode 100644 index a895303..0000000 --- a/src/user/ui/profileform/ProfileFormActions.js +++ /dev/null @@ -1,56 +0,0 @@ -import ForumContract from '../../../build/contracts/Forum.json' -import store from '../../../store' - -const contract = require('truffle-contract'); - -export const USER_UPDATED = 'USER_UPDATED'; -function userUpdated(user) { - return { - type: USER_UPDATED, - payload: user - } -} - -export function updateUser(name) { - let web3 = store.getState().web3.web3Instance; - - // Double-check web3's status. - if (typeof web3 !== 'undefined') { - - return function(dispatch) { - // Using truffle-contract we create the authentication object. - const authentication = contract(ForumContract); - authentication.setProvider(web3.currentProvider); - - // Declaring this for later so we can chain functions on Authentication. - let authenticationInstance; - - // Get current ethereum wallet. - web3.eth.getCoinbase((error, coinbase) => { - // Log errors, if any. - if (error) { - console.error(error); - } - - authentication.deployed().then(function(instance) { - authenticationInstance = instance; - - // Attempt to login user. - authenticationInstance.signUp(JSON.stringify(name), {from: coinbase}) - .then(function(result) { - console.log("SignUp/name update successful: " + name); - // If no error, update user. - dispatch(userUpdated({"name": name})); - - return alert('Name updated!') - }) - .catch(function(result) { - // If error... - }) - }) - }) - } - } else { - console.error('Web3 is not initialized.'); - } -} diff --git a/src/user/ui/profileform/ProfileFormContainer.js b/src/user/ui/profileform/ProfileFormContainer.js deleted file mode 100644 index bda66a9..0000000 --- a/src/user/ui/profileform/ProfileFormContainer.js +++ /dev/null @@ -1,25 +0,0 @@ -import { connect } from 'react-redux' -import ProfileForm from './ProfileForm' -import { updateUser } from './ProfileFormActions' - -const mapStateToProps = (state, ownProps) => { - return { - name: state.user.data.name - } -}; - -const mapDispatchToProps = (dispatch) => { - return { - onProfileFormSubmit: (name, event) => { - event.preventDefault(); - dispatch(updateUser(name)) - } - } -}; - -const ProfileFormContainer = connect( - mapStateToProps, - mapDispatchToProps -)(ProfileForm); - -export default ProfileFormContainer diff --git a/src/user/ui/signupform/SignUpForm.js b/src/user/ui/signupform/SignUpForm.js deleted file mode 100644 index c5f6cc8..0000000 --- a/src/user/ui/signupform/SignUpForm.js +++ /dev/null @@ -1,44 +0,0 @@ -import React, { Component } from 'react' - -class SignUpForm extends Component { - constructor(props) { - super(props); - - this.state = { - name: '' - } - } - - onInputChange(event) { - this.setState({ name: event.target.value }) - } - - handleSubmit(event) { - event.preventDefault(); - - if (this.state.name.length < 2) - { - return alert('Please fill in your name.') - } - - this.props.onSignUpFormSubmit(this.state.name) - } - - render() { - return( -
    -
    - - - This is a required field. - -
    - - -
    -
    - ) - } -} - -export default SignUpForm diff --git a/src/user/ui/signupform/SignUpFormActions.js b/src/user/ui/signupform/SignUpFormActions.js deleted file mode 100644 index 3fcdb09..0000000 --- a/src/user/ui/signupform/SignUpFormActions.js +++ /dev/null @@ -1,45 +0,0 @@ -import ForumContract from '../../../build/contracts/Forum.json' -import { loginUser } from '../loginbutton/LoginButtonActions' -import store from '../../../store' - -const contract = require('truffle-contract'); - -export function signUpUser(name) { - let web3 = store.getState().web3.web3Instance; - - // Double-check web3's status. - if (typeof web3 !== 'undefined') { - - return function(dispatch) { - // Using truffle-contract we create the authentication object. - const authentication = contract(ForumContract); - authentication.setProvider(web3.currentProvider); - - // Declaring this for later so we can chain functions on Authentication. - let authenticationInstance; - - // Get current ethereum wallet. - web3.eth.getCoinbase((error, coinbase) => { - // Log errors, if any. - if (error) - console.error(error); - - authentication.deployed().then(function(instance) { - authenticationInstance = instance; - - // Attempt to sign up user. - authenticationInstance.signUp(JSON.stringify(name), {from: coinbase}) - .then(function(result) { - // If no error, login user. - return dispatch(loginUser()) - }) - .catch(function(result) { - console.log("SignUp error: " + result); - }) - }) - }) - } - } else { - console.error('Web3 is not initialized.'); - } -} diff --git a/src/user/ui/signupform/SignUpFormContainer.js b/src/user/ui/signupform/SignUpFormContainer.js deleted file mode 100644 index 358db7d..0000000 --- a/src/user/ui/signupform/SignUpFormContainer.js +++ /dev/null @@ -1,22 +0,0 @@ -import { connect } from 'react-redux' -import SignUpForm from './SignUpForm' -import { signUpUser } from './SignUpFormActions' - -const mapStateToProps = (state, ownProps) => { - return {} -}; - -const mapDispatchToProps = (dispatch) => { - return { - onSignUpFormSubmit: (name) => { - dispatch(signUpUser(name)) - } - } -}; - -const SignUpFormContainer = connect( - mapStateToProps, - mapDispatchToProps -)(SignUpForm); - -export default SignUpFormContainer diff --git a/src/user/userReducer.js b/src/user/userReducer.js deleted file mode 100644 index 0904126..0000000 --- a/src/user/userReducer.js +++ /dev/null @@ -1,22 +0,0 @@ -const initialState = { - data: null -}; - -const userReducer = (state = initialState, action) => { - if (action.type === 'USER_LOGGED_IN' || action.type === 'USER_UPDATED') - { - return Object.assign({}, state, { - data: action.payload - }) - } - - if (action.type === 'USER_LOGGED_OUT') - { - return Object.assign({}, state, { - data: null - }) - } - return state; -}; - -export default userReducer 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 diff --git a/src/util/wrappers.js b/src/util/wrappers.js deleted file mode 100644 index 04a1571..0000000 --- a/src/util/wrappers.js +++ /dev/null @@ -1,34 +0,0 @@ -import { UserAuthWrapper } from 'redux-auth-wrapper' -import { routerActions } from 'react-router-redux' - -// Layout Component Wrappers -export const UserIsAuthenticated = UserAuthWrapper({ - authSelector: state => state.user.data, - redirectAction: routerActions.replace, - failureRedirectPath: '/', // '/login' by default. - wrapperDisplayName: 'UserIsAuthenticated' -}); - -export const UserIsNotAuthenticated = UserAuthWrapper({ - authSelector: state => state.user, - redirectAction: routerActions.replace, - failureRedirectPath: (state, ownProps) => ownProps.location.query.redirect || '/dashboard', - wrapperDisplayName: 'UserIsNotAuthenticated', - predicate: user => user.data === null, - allowRedirectBack: false -}); - -// UI Component Wrappers -export const VisibleOnlyAuth = UserAuthWrapper({ - authSelector: state => state.user, - wrapperDisplayName: 'VisibleOnlyAuth', - predicate: user => user.data, - FailureComponent: null -}); - -export const HiddenOnlyAuth = UserAuthWrapper({ - authSelector: state => state.user, - wrapperDisplayName: 'HiddenOnlyAuth', - predicate: user => user.data === null, - FailureComponent: null -});