diff --git a/common/Root.tsx b/common/Root.tsx index 25de2ff5..e572c223 100644 --- a/common/Root.tsx +++ b/common/Root.tsx @@ -12,6 +12,8 @@ import SignAndVerifyMessage from 'containers/Tabs/SignAndVerifyMessage'; import BroadcastTx from 'containers/Tabs/BroadcastTx'; import ErrorScreen from 'components/ErrorScreen'; import PageNotFound from 'components/PageNotFound'; +import LogOutPrompt from 'components/LogOutPrompt'; +import { Aux } from 'components/ui'; import { Store } from 'redux'; import { AppState } from 'reducers'; @@ -60,16 +62,20 @@ export default class Root extends Component { - ); + + const Router = process.env.BUILD_DOWNLOADABLE ? HashRouter : BrowserRouter; + return ( - {process.env.BUILD_DOWNLOADABLE ? ( - {routes} - ) : ( - {routes} - )} + + + {routes} + + + + ); } diff --git a/common/components/WalletDecrypt/components/NavigationPrompt.tsx b/common/components/LogOutPrompt.tsx similarity index 57% rename from common/components/WalletDecrypt/components/NavigationPrompt.tsx rename to common/components/LogOutPrompt.tsx index cf927472..a7921b75 100644 --- a/common/components/WalletDecrypt/components/NavigationPrompt.tsx +++ b/common/components/LogOutPrompt.tsx @@ -1,11 +1,15 @@ import React from 'react'; +import { connect } from 'react-redux'; import { withRouter, RouteComponentProps } from 'react-router-dom'; import Modal, { IButton } from 'components/ui/Modal'; +import { AppState } from 'reducers'; +import { resetWallet, TResetWallet } from 'actions/wallet'; interface Props extends RouteComponentProps<{}> { - when: boolean; - onConfirm?: any; - onCancel?: any; + // State + wallet: AppState['wallet']['inst']; + // Actions + resetWallet: TResetWallet; } interface State { @@ -13,20 +17,16 @@ interface State { openModal: boolean; } -class NavigationPromptClass extends React.Component { - public unblock; - +class LogOutPromptClass extends React.Component { constructor(props) { super(props); this.state = { nextLocation: null, openModal: false }; - } - public setupUnblock() { - this.unblock = this.props.history.block(nextLocation => { - if (this.props.when && nextLocation.pathname !== this.props.location.pathname) { + this.props.history.block(nextLocation => { + if (this.props.wallet && nextLocation.pathname !== this.props.location.pathname) { const isSubTab = nextLocation.pathname.split('/')[1] === this.props.location.pathname.split('/')[1]; if (!isSubTab) { @@ -40,36 +40,6 @@ class NavigationPromptClass extends React.Component { }); } - public componentDidMount() { - this.setupUnblock(); - } - - public componentWillUnmount() { - this.unblock(); - } - - public onCancel = () => { - if (this.props.onCancel) { - this.props.onCancel(); - } - this.setState({ nextLocation: null, openModal: false }); - }; - - public onConfirm = () => { - if (this.props.onConfirm) { - this.props.onConfirm(); - } - // Lock Wallet - this.navigateToNextLocation(); - }; - - public navigateToNextLocation() { - this.unblock(); - if (this.state.nextLocation) { - this.props.history.push(this.state.nextLocation.pathname); - } - } - public render() { const buttons: IButton[] = [ { text: 'Log Out', type: 'primary', onClick: this.onConfirm }, @@ -86,6 +56,32 @@ class NavigationPromptClass extends React.Component { ); } + + private onCancel = () => { + this.setState({ nextLocation: null, openModal: false }); + }; + + private onConfirm = () => { + const { nextLocation } = this.state; + this.props.resetWallet(); + this.setState( + { + openModal: false, + nextLocation: null + }, + () => { + if (nextLocation) { + this.props.history.push(nextLocation.pathname); + } + } + ); + }; } -export const NavigationPrompt = withRouter(NavigationPromptClass); +function mapStateToProps(state: AppState) { + return { wallet: state.wallet.inst }; +} + +export default connect(mapStateToProps, { + resetWallet +})(withRouter(LogOutPromptClass)); diff --git a/common/components/WalletDecrypt/WalletDecrypt.tsx b/common/components/WalletDecrypt/WalletDecrypt.tsx index ca6d145b..eafafb25 100644 --- a/common/components/WalletDecrypt/WalletDecrypt.tsx +++ b/common/components/WalletDecrypt/WalletDecrypt.tsx @@ -28,7 +28,6 @@ import { TrezorDecrypt, ViewOnlyDecrypt, Web3Decrypt, - NavigationPrompt, WalletButton } from './components'; import { AppState } from 'reducers'; @@ -307,13 +306,11 @@ export class WalletDecrypt extends Component { }; public render() { - const { wallet, hidden } = this.props; + const { hidden } = this.props; const selectedWallet = this.getSelectedWallet(); const decryptionComponent = this.getDecryptionComponent(); - const unlocked = !!wallet; return (
- {!hidden && (
diff --git a/common/components/WalletDecrypt/components/index.tsx b/common/components/WalletDecrypt/components/index.tsx index 61fbf76b..3886676a 100644 --- a/common/components/WalletDecrypt/components/index.tsx +++ b/common/components/WalletDecrypt/components/index.tsx @@ -3,7 +3,6 @@ export * from './DigitalBitbox'; export * from './Keystore'; export * from './LedgerNano'; export * from './Mnemonic'; -export * from './NavigationPrompt'; export * from './PrivateKey'; export * from './Trezor'; export * from './ViewOnly';