git.iko.soy/bridge
on 2fc74c8 help sign in
bridge/src/walletgen/App.js
150 lines 3.7 kB history raw
1import React from 'react'
2import * as lodash from 'lodash'
4import Header from './components/Header'
5import Footer from './components/Footer'
7import { NETWORK_STATES, PROFILE_STATES, GEN_STATES } from './lib/constants'
9import BrowserWarning from './views/BrowserWarning'
10import NetworkWarning from './views/NetworkWarning'
11import PrivacyPolicy from './views/PrivacyPolicy'
12import Welcome from './views/Welcome'
13import Eula from './views/Eula'
14import EulaView from './views/EulaView'
15import Upload from './views/Upload'
16import Understand from './views/Understand'
17import Generate from './views/Generate'
18import Custody from './views/Custody'
19import Download from './views/Download'
20import Done from './views/Done'
23const checkNetwork = () => navigator.onLine
24 ? NETWORK_STATES.ONLINE
25 : NETWORK_STATES.OFFLINE
27const ROUTES = [
28 { path: '/Welcome',
29 Component: Welcome,
30 },
31 { path: '/Eula',
32 Component: Eula,
33 },
34 { path: '/Upload',
35 Component: Upload,
36 },
37 { path: '/Understand',
38 Component: Understand,
39 },
40 { path: '/Custody',
41 Component: Custody,
42 },
43 { path: '/Generate',
44 Component: Generate,
45 },
46 { path: '/Download',
47 Component: Download,
48 },
49 { path: '/Done',
50 Component: Done,
51 },
52 { path: '/PrivacyPolicy',
53 Component: PrivacyPolicy,
54 },
55 { path: '/EulaView',
56 Component: EulaView,
57 }
58];
60const TOTAL_STEPS = 7;
62class App extends React.Component {
63 constructor(props) {
64 super(props)
65 this.state = {
66 'network': checkNetwork(),
67 'profile.state': PROFILE_STATES.NOSTART,
68 'profile.value': null,
69 'profile.shipCount': 0,
70 'profile.error': '',
71 'eny.state': GEN_STATES.ENY_NOSTART,
72 'eny.value': [],
73 'eny.error': '',
74 'wallets.state': GEN_STATES.DERIVATION_NOSTART,
75 'wallets.value': null,
76 'wallets.error': '',
77 'wallets.genCounter': 0,
78 'paperCollateral.state': GEN_STATES.PAPER_NOSTART,
79 'paperCollateral.value': null,
80 'paperCollateral.error': '',
81 'route': '/Welcome',
82 'lastRoute': '/Welcome',
83 'currentStep': 1,
84 'totalSteps': TOTAL_STEPS,
85 'downloaded': false,
86 'didClickDownload': false,
87 };
88 };
91 componentDidMount = () => {
92 window.addEventListener('online', () => this.setState({'network': NETWORK_STATES.ONLINE}));
93 window.addEventListener('offline', () => this.setState({'network': NETWORK_STATES.OFFLINE}));
94 };
97 setGlobalState = state => this.setState(state)
99 router = (network, path) => {
100 const route = key => {
101 const { Component } = lodash.find(ROUTES, { path: key })
102 const globals = {
103 setGlobalState: this.setGlobalState,
104 ...this.state
105 }
106 return <Component { ...globals } />
107 }
109 return route(path)
111 // return network === NETWORK_STATES.ONLINE
112 // ? <NetworkWarning />
113 // : !(network === NETWORK_STATES.OFFLINE)
114 // ? <h1>Detecting your network state.</h1>
115 // : route(path)
116 }
119 render() {
120 const { network, route, currentStep, stepCount, lastRoute } = this.state;
122 const routed = this.router(network, route) // hacky prod
123 // const routed = this.router(NETWORK_STATES.OFFLINE, true, route) // hacky dev
125 return (
126 <main className={'container'}>
128 <Header
129 network={ network }
130 currentStep={ currentStep }
131 totalSteps={ TOTAL_STEPS } />
133 <div className={ 'row wrapper' }>
134 <div className={'col-'}>
135 { routed }
136 </div>
137 <div className={'push'} />
138 </div>
140 <Footer
141 route={ route }
142 lastRoute={ lastRoute }
143 setGlobalState={ this.setGlobalState }
144 />
145 </main>
146 );
147 };
148};
150export default App