6cdf197 · bridge · git.iko.soy

git.iko.soy/bridge

on master help sign in

- Addressed PR comments on code style

6cdf197Chris Johnson8 years ago

src/bridge/components/Passport.js+70−53

compare with master

unifiedsplit

@@ -33,10 +33,10 @@ class Passport extends React.Component {

33 let censor = "";

34 const blocks = ['▖','▗','▘','▙','▚','▛','▜','▝','▞','▟'];

36− for (var i = 0; i < 12; i++) {

36+ (new UInt32Array(12)).forEach((_, i) => {

37 let index = Math.floor(Math.random() * blocks.length)

38 censor += blocks[index];

39− }

39+ })

41 return censor

42 }

@@ -44,14 +44,14 @@ class Passport extends React.Component {

44 // generateCensor() {

45 // let blocks = [];

46 //

47− // for (var i = 0; i < 86; i++) {

47+ // (new UInt32Array(86)).forEach((_, i) => {

48 // let rand = Math.round(Math.random())

49 // let filled = (rand || i === 0 || i === 43)

50 //

51 // let className = filled ? "passport-block bg-gray-30" : "passport-block"

52 //

53 // blocks.push(<div key={i} data-key={i}className={className}></div>)

54− // }

54+ // })

55 //

56 // return (

57 // <div className="flex flex-wrap passport-censor">

@@ -135,11 +135,13 @@ class Passport extends React.Component {

135 }

136

137 render() {

138− let patp = this.props.point.matchWith({

138+ let pointVal = this.props.point.matchWith({

139− Just: p => ob.patp(p.value),

139+ Just: p => p.value,

140 Nothing: () => ''

141 })

142

143+ let patp = ob.patp(pointVal)

144+

143 let wallet = this.props.wallet.matchWith({

145 let wallet = this.props.wallet.matchWith({

144 Just: w => w.value,

146 Just: w => w.value,

145 Nothing: () => null

147 Nothing: () => null

@@ -164,60 +166,75 @@ class Passport extends React.Component {

164 let paperReady = this.state.paper && this.props.walletStates.includes(WALLET_STATES.PAPER_READY)

166 let paperReady = this.state.paper && this.props.walletStates.includes(WALLET_STATES.PAPER_READY)

165 let downloadColor = paperReady ? 'green' : 'black'

167 let downloadColor = paperReady ? 'green' : 'black'

166

168

169+ let downloadBtn = (

170+ <Button

171+ disabled={ !paperReady }

172+ prop-size={ 'lg wide' }

173+ prop-color={ downloadColor }

174+ onClick={ this.download }

175+ >

176+ { 'Download' }

177+ </Button>

178+ )

179+

180+ let paperCollateral = wallet

181+ ? (

182+ <PaperCollateralRenderer

183+ wallet={{[pointVal]: wallet}}

184+ className={'extremely-hidden'}

185+ callback={data => {

186+ this.setState({paper: data})

187+ this.props.pushWalletState(WALLET_STATES.PAPER_READY)

188+ }}

189+ mode={'REGISTRATION'} />

190+ )

191+ : <div />

192+

193+ let walletAddresses = (

194+ <div className="mt-8">

195+ <div className="passport-label text-mono">Ethereum Address</div>

196+ <div className="passport-value">{ownershipAddress || 'Ungenerated'}</div>

197+

198+ <div className="passport-label gray-50 mt-3">Master Ticket</div>

199+ <div className="passport-value passport-censor overflow-hidden">{this.masterCensor}</div>

200+

201+ <div className="passport-label gray-50 mt-5">Management Seed</div>

202+ <div className="passport-value passport-censor overflow-hidden">{this.managementCensor}</div>

203+ </div>

204+ )

205+

206+ let walletMetadata = (

207+ <div className="flex">

208+ <div className="passport-sigil">

209+ {sigil}

210+ </div>

211+ <div className="passport-metadata ml-4">

212+ <div className="passport-label text-mono">Point</div>

213+ <div className="text-mono">{patp || '-'}</div>

214+

215+ <div className="passport-label gray-50 mt-6">Created on</div>

216+ <div className="passport-value">{patp ? currentDate : '-' }</div>

217+

218+ <div className="passport-label gray-50 mt-2">Invited by</div>

219+ <div className="passport-value">{this.props.invitedBy || '-'}</div>

220+ </div>

221+ </div>

222+ )

223+

167 return (

224 return (

168 <div>

225 <div>

169 <div className="passport-border">

226 <div className="passport-border">

170 <div className={`passport ${paperReady && 'passport-filled'}`}>

227 <div className={`passport ${paperReady && 'passport-filled'}`}>

171− <div className="flex">

228+ { walletMetadata}

172− <div className="passport-sigil">

229+ { walletAddresses }

173− {sigil}

230+ { paperCollateral }

174− </div>

231+

175− <div className="passport-metadata ml-4">

176− <div className="passport-label text-mono">Point</div>

177− <div className="text-mono">{patp || '-'}</div>

178−

179− <div className="passport-label gray-50 mt-6">Created on</div>

180− <div className="passport-value">{patp ? currentDate : '-' }</div>

181−

182− <div className="passport-label gray-50 mt-2">Invited by</div>

183− <div className="passport-value">{this.props.invitedBy || '-'}</div>

184− </div>

185− </div>

186−

187− <div className="mt-8">

188− <div className="passport-label text-mono">Ethereum Address</div>

189− <div className="passport-value">{ownershipAddress || 'Ungenerated'}</div>

190−

191− <div className="passport-label gray-50 mt-3">Master Ticket</div>

192− <div className="passport-value passport-censor overflow-hidden">{this.masterCensor}</div>

193−

194− <div className="passport-label gray-50 mt-5">Management Seed</div>

195− <div className="passport-value passport-censor overflow-hidden">{this.managementCensor}</div>

196− </div>

197−

198− {wallet &&

199− <PaperCollateralRenderer

200− wallet={{[this.props.point.value]: wallet}}

201− className={'extremely-hidden'}

202− callback={data => {

203− this.setState({paper: data})

204− this.props.pushWalletState(WALLET_STATES.PAPER_READY)

205− }}

206− mode={'REGISTRATION'} />

207− }

208 </div>

232 </div>

209− <Button

233+ { downloadBtn }

210− disabled={ !paperReady }

211− prop-size={ 'lg wide' }

212− prop-color={ downloadColor }

213− onClick={ this.download }

214− >

215− { 'Download' }

216− </Button>

217 </div>

234 </div>

218

235

219− {walletProgress}

236+ { walletProgress }

220− {walletStates}

237+ { walletStates }

221

238

222 </div>

239 </div>

223 )

240 )