From b968952ef4f90d570eb73ccc5140f2ec9b7fd622 Mon Sep 17 00:00:00 2001 From: Jernej Pregelj Date: Fri, 8 Feb 2019 11:44:02 +0100 Subject: [PATCH] leaner bootstrap, remove window any casting --- src/App.tsx | 97 ++++++++++++++++++++++++--------------------- src/context/User.ts | 1 + 2 files changed, 52 insertions(+), 46 deletions(-) diff --git a/src/App.tsx b/src/App.tsx index ad9f367..c00f6f4 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -8,9 +8,17 @@ import './styles/global.scss' import { nodeHost, nodePort, nodeScheme } from './config' +declare global { + interface Window { + web3: Web3, + ethereum: any + } +} + interface AppState { isLogged: boolean - web3: any + isLoading: boolean + web3: Web3 ocean: {} startLogin: () => void } @@ -25,7 +33,12 @@ class App extends Component<{}, AppState> { public state = { isLogged: false, - web3: {}, + isLoading: true, + web3: new Web3( + new Web3.providers.HttpProvider( + `${nodeScheme}://${nodeHost}:${nodePort}` + ) + ), ocean: {}, startLogin: this.startLogin } @@ -45,62 +58,54 @@ class App extends Component<{}, AppState> { } private startLoginProcess = async () => { - if ((window as any).web3) { - const web3 = new Web3((window as any).web3.currentProvider) + this.setState({isLoading: true}) + if (window.web3) { + const web3 = new Web3(window.web3.currentProvider) try { const accounts = await web3.eth.getAccounts() - if (accounts.length === 0 && (window as any).ethereum) { - await (window as any).ethereum.enable() - const { ocean } = await provideOcean() - this.setState(state => ({ + if (accounts.length > 0) { + this.setState({ isLogged: true, - web3, - ocean - })) + web3 + }) } else { + if (accounts.length === 0 && window.ethereum) { + await window.ethereum.enable() + this.setState({ + isLogged: true, + web3 + }) + } + } + } catch (e) { + // something went wrong, show error? + } + } else { + // no metamask/mist, show installation guide! + } + this.setState({isLoading: false}) + } + + private bootstrap = async () => { + if (window.web3) { + const web3 = new Web3(window.web3.currentProvider) + try { + const accounts = await web3.eth.getAccounts() + if (accounts.length > 0) { this.setState(state => ({ isLogged: true, web3 })) } } catch (e) { - this.setDefaultProvider() + // continue with default } - } else { - this.setDefaultProvider() } - } - - private bootstrap = async () => { - if ((window as any).web3) { - const web3 = new Web3((window as any).web3.currentProvider) - try { - const accounts = await web3.eth.getAccounts() - if (accounts.length > 0) { - const { ocean } = await provideOcean() - this.setState(state => ({ - isLogged: true, - web3, - ocean - })) - } - } catch (e) { - this.setDefaultProvider() - } - } else { - this.setDefaultProvider() - } - } - - private setDefaultProvider = () => { - this.setState(state => ({ - isLogged: false, - web3: new Web3( - new Web3.providers.HttpProvider( - `${nodeScheme}://${nodeHost}:${nodePort}` - ) - ) - })) + const { ocean } = await provideOcean() + this.setState({ + isLoading: false, + ocean + }) } } diff --git a/src/context/User.ts b/src/context/User.ts index 3a478c2..9ef0ef2 100644 --- a/src/context/User.ts +++ b/src/context/User.ts @@ -2,6 +2,7 @@ import React from 'react' export const User = React.createContext({ isLogged: false, + isLoading: false, web3: {}, ocean: {}, startLogin: () => {