on 39b5975 help sign in
bridge/src/Root.js
103 lines 2.6 kB history raw
1import 'babel-polyfill' // required for @ledgerhq/hw-transport-u2f
3import React from 'react'
4import ReactDOM from 'react-dom'
5import _ from 'lodash'
7import Bridge from './bridge/Bridge'
8import Walletgen from './walletgen/Walletgen'
9import { AppNavigation } from './common/components/AppNavigation'
11import './common/style/index.css'
12import './bridge/style/index.css'
13import './walletgen/style/index.css'
15class Root extends React.Component {
16 constructor(props) {
17 super(props)
19 this.state = {
20 appView: "bridge"
21 }
23 this.setView = this.setView.bind(this)
24 }
26 /*
27 Style switching:
29 To switch between walletgen and bridge styles without them clobbering each
30 other, we need a way to identify which app the stylesheet belongs to.
32 So we include a "walletgen" or "bridge" style as the first rule of any
33 stylesheet. If this directive is included, we can disable the appropriate
34 sheet when the user switches applications
36 A bit hacky, but does the job for now. These styles should probably be
37 fully merged at some point.
38 */
40 isWalletgenStyle(styleSheet) {
41 return _.get(styleSheet, 'cssRules[0].selectorText', null) === "walletgen"
42 }
44 isBridgeStyle(styleSheet) {
45 return _.get(styleSheet, 'cssRules[0].selectorText', null) === "bridge"
46 }
48 disableStylesheets(appView) {
49 for (var i = 0; i < document.styleSheets.length; i++) {
50 let styleSheet = document.styleSheets[i]
52 if (appView === "bridge") {
53 if (this.isWalletgenStyle(styleSheet)) styleSheet.disabled = true
54 if (this.isBridgeStyle(styleSheet)) styleSheet.disabled = false
55 } else if (appView === "walletgen") {
56 if (this.isWalletgenStyle(styleSheet)) styleSheet.disabled = false
57 if (this.isBridgeStyle(styleSheet)) styleSheet.disabled = true
58 }
59 }
60 }
62 componentDidMount() {
63 this.disableStylesheets(this.state.appView)
64 }
66 setView(appView) {
67 this.disableStylesheets(appView)
69 this.setState({
70 appView
71 })
72 }
74 render() {
75 let appComponent = null;
77 if (this.state.appView === "walletgen") {
78 appComponent = <Walletgen
79 appView={this.state.appView}
80 setView={this.setView} />
81 }
83 if (this.state.appView === "bridge") {
84 appComponent = <Bridge
85 appView={this.state.appView}
86 setView={this.setView} />
87 }
89 return (
90 <React.Fragment>
91 {appComponent}
92 <AppNavigation
93 setView={this.setView}
94 appView={this.state.appView}
95 />
96 </React.Fragment>
97 )
98 }
101export {
102 Root