From e0daf87564653f81a7689035180595692e6b70b4 Mon Sep 17 00:00:00 2001 From: Ben Werdmuller Date: Wed, 26 Sep 2018 15:56:08 -0700 Subject: [PATCH 1/7] Wiring homepage up to new dashboard --- unlock-app/src/components/Unlock.js | 2 ++ .../src/components/creator/Dashboard.js | 23 ++++++++++++++++++- unlock-app/src/components/pages/Home.js | 11 ++++++++- 3 files changed, 34 insertions(+), 2 deletions(-) diff --git a/unlock-app/src/components/Unlock.js b/unlock-app/src/components/Unlock.js index 7d5a080c559..0b886d7cb48 100644 --- a/unlock-app/src/components/Unlock.js +++ b/unlock-app/src/components/Unlock.js @@ -6,6 +6,7 @@ import React from 'react' import { Route, Switch } from 'react-router' import LockMaker from './creator/LockMaker' +import Dashboard from './creator/Dashboard' import Lock from './consumer/Lock' import Home from './pages/Home' import Jobs from './pages/Jobs' @@ -63,6 +64,7 @@ export function Unlock({ network, config, path }) { return ( + diff --git a/unlock-app/src/components/creator/Dashboard.js b/unlock-app/src/components/creator/Dashboard.js index 9add8de6747..2e8fbccd6b7 100644 --- a/unlock-app/src/components/creator/Dashboard.js +++ b/unlock-app/src/components/creator/Dashboard.js @@ -4,9 +4,15 @@ import React, { Component } from 'react' import Layout from '../interface/Layout' import CreatorAccount from './CreatorAccount' import CreatorLocks from './CreatorLocks' +import {setTransaction} from '../../actions/transaction' +import connect from 'react-redux/es/connect/connect' -export default class Dashboard extends Component { +export class Dashboard extends Component { render() { + if (!this.props.account) { + return null //loading + } + return ( @@ -22,3 +28,18 @@ Dashboard.propTypes = { transactions: UnlockPropTypes.transactions, locks: UnlockPropTypes.locks, } + +const mapStateToProps = state => { + return { + account: state.network.account, // TODO change account to base level + network: state.network, + transactions: state.transactions, + locks: state.locks, + } +} + +const mapDispatchToProps = dispatch => ({ + setTransaction: (transaction) => dispatch(setTransaction(transaction)), +}) + +export default connect(mapStateToProps, mapDispatchToProps)(Dashboard) diff --git a/unlock-app/src/components/pages/Home.js b/unlock-app/src/components/pages/Home.js index 518a803f7b1..d827877cdac 100644 --- a/unlock-app/src/components/pages/Home.js +++ b/unlock-app/src/components/pages/Home.js @@ -5,6 +5,15 @@ import { Section, Headline, SubTitle, CallToAction, ThreeColumns, Column } from import { ActionButton } from '../creator/CreatorLocks' export default class Home extends PureComponent { + constructor(props) { + super(props) + this.dashboardClick = this.dashboardClick.bind(this); + } + + dashboardClick() { + this.props.history.push('/dashboard'); + } + render() { return ( @@ -13,7 +22,7 @@ export default class Home extends PureComponent { Unlock is a protocol which enables creators to monetize their content with a few lines of code in a fully decentralized way. - + Go to Your Dashboard Requires a browser with an Ethereum wallet From b96c624430b4ad4846b690ac2ca82dd23de1ff1f Mon Sep 17 00:00:00 2001 From: Ben Werdmuller Date: Wed, 26 Sep 2018 15:59:34 -0700 Subject: [PATCH 2/7] Adding proptype validation --- unlock-app/src/components/pages/Home.js | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/unlock-app/src/components/pages/Home.js b/unlock-app/src/components/pages/Home.js index d827877cdac..8b4ab274159 100644 --- a/unlock-app/src/components/pages/Home.js +++ b/unlock-app/src/components/pages/Home.js @@ -1,5 +1,6 @@ import styled from 'styled-components' import React, { PureComponent } from 'react' +import UnlockPropTypes from '../../propTypes' import Layout from '../interface/Layout' import { Section, Headline, SubTitle, CallToAction, ThreeColumns, Column } from './Components' import { ActionButton } from '../creator/CreatorLocks' @@ -7,11 +8,11 @@ import { ActionButton } from '../creator/CreatorLocks' export default class Home extends PureComponent { constructor(props) { super(props) - this.dashboardClick = this.dashboardClick.bind(this); + this.dashboardClick = this.dashboardClick.bind(this) } dashboardClick() { - this.props.history.push('/dashboard'); + this.props.history.push('/dashboard') } render() { @@ -60,6 +61,10 @@ export default class Home extends PureComponent { } } +Home.propTypes = { + history: UnlockPropTypes.Object, +} + const ImageWithHover = styled.div` border-style: none; background: url(${props => (`/images/pages/png/${props.base}.png`)}) no-repeat center/contain; From c7c43f115169473783069c55d0bea45c28728c86 Mon Sep 17 00:00:00 2001 From: Ben Werdmuller Date: Wed, 26 Sep 2018 16:21:09 -0700 Subject: [PATCH 3/7] Fixing import issue --- unlock-app/src/components/creator/Dashboard.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/unlock-app/src/components/creator/Dashboard.js b/unlock-app/src/components/creator/Dashboard.js index 2e8fbccd6b7..a59c8e4f7c7 100644 --- a/unlock-app/src/components/creator/Dashboard.js +++ b/unlock-app/src/components/creator/Dashboard.js @@ -5,7 +5,7 @@ import Layout from '../interface/Layout' import CreatorAccount from './CreatorAccount' import CreatorLocks from './CreatorLocks' import {setTransaction} from '../../actions/transaction' -import connect from 'react-redux/es/connect/connect' +import { connect } from 'react-redux' export class Dashboard extends Component { render() { From edae52cc5cd1a440e3a9be7fb4bad3a57b706b42 Mon Sep 17 00:00:00 2001 From: Ben Werdmuller Date: Thu, 27 Sep 2018 12:17:15 -0700 Subject: [PATCH 4/7] Using Link --- .../src/components/creator/Dashboard.js | 6 +----- unlock-app/src/components/pages/Home.js | 21 +++++++------------ 2 files changed, 9 insertions(+), 18 deletions(-) diff --git a/unlock-app/src/components/creator/Dashboard.js b/unlock-app/src/components/creator/Dashboard.js index a59c8e4f7c7..b9a99352d6c 100644 --- a/unlock-app/src/components/creator/Dashboard.js +++ b/unlock-app/src/components/creator/Dashboard.js @@ -38,8 +38,4 @@ const mapStateToProps = state => { } } -const mapDispatchToProps = dispatch => ({ - setTransaction: (transaction) => dispatch(setTransaction(transaction)), -}) - -export default connect(mapStateToProps, mapDispatchToProps)(Dashboard) +export default connect(mapStateToProps)(Dashboard) diff --git a/unlock-app/src/components/pages/Home.js b/unlock-app/src/components/pages/Home.js index 8b4ab274159..54964ae4adb 100644 --- a/unlock-app/src/components/pages/Home.js +++ b/unlock-app/src/components/pages/Home.js @@ -1,20 +1,12 @@ import styled from 'styled-components' import React, { PureComponent } from 'react' +import { Link } from 'react-router-dom' import UnlockPropTypes from '../../propTypes' import Layout from '../interface/Layout' import { Section, Headline, SubTitle, CallToAction, ThreeColumns, Column } from './Components' import { ActionButton } from '../creator/CreatorLocks' export default class Home extends PureComponent { - constructor(props) { - super(props) - this.dashboardClick = this.dashboardClick.bind(this) - } - - dashboardClick() { - this.props.history.push('/dashboard') - } - render() { return ( @@ -23,10 +15,12 @@ export default class Home extends PureComponent { Unlock is a protocol which enables creators to monetize their content with a few lines of code in a fully decentralized way. - - Go to Your Dashboard - Requires a browser with an Ethereum wallet - + + + Go to Your Dashboard + Requires a browser with an Ethereum wallet + + @@ -96,6 +90,7 @@ const ButtonLabel = styled.small` font-size: 12px; font-weight: 200; font-family: 'IBM Plex Mono', 'Courier New', Serif; + color: var(--darkgrey); ` const Paragraph = styled.p` From 60d5d9bf8f500c0e39e978d9f7e4db8099ffda93 Mon Sep 17 00:00:00 2001 From: Ben Werdmuller Date: Thu, 27 Sep 2018 12:25:19 -0700 Subject: [PATCH 5/7] Linter fix --- unlock-app/src/components/creator/Dashboard.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/unlock-app/src/components/creator/Dashboard.js b/unlock-app/src/components/creator/Dashboard.js index b9a99352d6c..37b75afdc25 100644 --- a/unlock-app/src/components/creator/Dashboard.js +++ b/unlock-app/src/components/creator/Dashboard.js @@ -1,11 +1,10 @@ import UnlockPropTypes from '../../propTypes' import React, { Component } from 'react' +import { connect } from 'react-redux' import Layout from '../interface/Layout' import CreatorAccount from './CreatorAccount' import CreatorLocks from './CreatorLocks' -import {setTransaction} from '../../actions/transaction' -import { connect } from 'react-redux' export class Dashboard extends Component { render() { From 192aa3bbcf2efe26d3718612ff2a72fb8993af34 Mon Sep 17 00:00:00 2001 From: Ben Werdmuller Date: Thu, 27 Sep 2018 12:36:24 -0700 Subject: [PATCH 6/7] Removing prop --- unlock-app/src/components/pages/Home.js | 4 ---- 1 file changed, 4 deletions(-) diff --git a/unlock-app/src/components/pages/Home.js b/unlock-app/src/components/pages/Home.js index 54964ae4adb..11ccbae1463 100644 --- a/unlock-app/src/components/pages/Home.js +++ b/unlock-app/src/components/pages/Home.js @@ -55,10 +55,6 @@ export default class Home extends PureComponent { } } -Home.propTypes = { - history: UnlockPropTypes.Object, -} - const ImageWithHover = styled.div` border-style: none; background: url(${props => (`/images/pages/png/${props.base}.png`)}) no-repeat center/contain; From d65d363ce73e9f52ec5a928c4c455dc75edd6751 Mon Sep 17 00:00:00 2001 From: Ben Werdmuller Date: Thu, 27 Sep 2018 12:43:39 -0700 Subject: [PATCH 7/7] Linter --- unlock-app/src/components/pages/Home.js | 1 - 1 file changed, 1 deletion(-) diff --git a/unlock-app/src/components/pages/Home.js b/unlock-app/src/components/pages/Home.js index 11ccbae1463..45149936a89 100644 --- a/unlock-app/src/components/pages/Home.js +++ b/unlock-app/src/components/pages/Home.js @@ -1,7 +1,6 @@ import styled from 'styled-components' import React, { PureComponent } from 'react' import { Link } from 'react-router-dom' -import UnlockPropTypes from '../../propTypes' import Layout from '../interface/Layout' import { Section, Headline, SubTitle, CallToAction, ThreeColumns, Column } from './Components' import { ActionButton } from '../creator/CreatorLocks'