diff --git a/embark-ui/src/actions/index.js b/embark-ui/src/actions/index.js index e4bee207c..21fb0bcbe 100644 --- a/embark-ui/src/actions/index.js +++ b/embark-ui/src/actions/index.js @@ -260,6 +260,7 @@ export const WATCH_NEW_CONTRACT_LOGS = 'WATCH_NEW_CONTRACT_LOGS'; export const INIT_BLOCK_HEADER = 'INIT_BLOCK_HEADER'; export const STOP_BLOCK_HEADER = 'STOP_BLOCK_HEADER'; export const WATCH_GAS_ORACLE = 'WATCH_GAS_ORACLE'; +export const STOP_GAS_ORACLE = 'STOP_GAS_ORACLE'; export function listenToProcessLogs(processName) { return { @@ -292,4 +293,10 @@ export function listenToGasOracle(){ }; } +export function stopGasOracle(){ + return { + type: STOP_GAS_ORACLE + }; +} + diff --git a/embark-ui/src/containers/GasStationContainer.js b/embark-ui/src/containers/GasStationContainer.js index 0c2518b18..4fded5d88 100644 --- a/embark-ui/src/containers/GasStationContainer.js +++ b/embark-ui/src/containers/GasStationContainer.js @@ -3,19 +3,19 @@ import React, {Component} from 'react'; import {connect} from 'react-redux'; import {withRouter} from "react-router-dom"; import GasStation from '../components/GasStation'; -import {listenToGasOracle, gasOracle as ethGasAction, blocks as blocksAction} from "../actions"; +import {stopGasOracle, listenToGasOracle, gasOracle as ethGasAction, blocks as blocksAction} from "../actions"; import DataWrapper from "../components/DataWrapper"; import {getOracleGasStats, getLastBlock} from "../reducers/selectors"; class GasStationContainer extends Component { componentDidMount() { this.props.fetchEthGas(); - if (!this.props.gasOracleStats.length) { - this.props.listenToGasOracle(); - } - if (!this.props.lastBlock) { - this.props.fetchBlocks(); - } + this.props.listenToGasOracle(); + this.props.fetchBlocks(); + } + + componentWillUnmount() { + this.props.stopGasOracle(); } render() { @@ -31,6 +31,8 @@ GasStationContainer.propTypes = { gasOracleStats: PropTypes.object, lastBlock: PropTypes.object, listenToGasOracle: PropTypes.func, + stopGasOracle: PropTypes.func, + fetchBlocks: PropTypes.func, fetchEthGas: PropTypes.func }; @@ -44,8 +46,9 @@ function mapStateToProps(state, _props) { export default withRouter(connect( mapStateToProps, { - listenToGasOracle: listenToGasOracle, fetchEthGas: ethGasAction.request, - fetchBlocks: blocksAction.request + fetchBlocks: blocksAction.request, + listenToGasOracle, + stopGasOracle } )(GasStationContainer)); diff --git a/embark-ui/src/sagas/index.js b/embark-ui/src/sagas/index.js index 7f2d9a64b..fa36f1902 100644 --- a/embark-ui/src/sagas/index.js +++ b/embark-ui/src/sagas/index.js @@ -259,7 +259,15 @@ export function *listenGasOracle() { const socket = api.websocketGasOracle(credentials); const channel = yield call(createChannel, socket); while (true) { - const gasOracleStats = yield take(channel); + const { cancel, gasOracleStats } = yield race({ + gasOracleStats: take(channel), + cancel: take(actions.STOP_GAS_ORACLE) + }); + + if (cancel) { + channel.close(); + return; + } yield put(actions.gasOracle.success(gasOracleStats)); } }