From a52bbcac0576c26eb5c59bcc440bd4f1b55c2b32 Mon Sep 17 00:00:00 2001 From: Jonathan Rainville Date: Wed, 8 Aug 2018 15:03:46 -0400 Subject: [PATCH] fix listen to channels --- embark-ui/src/actions/index.js | 43 +++++++++---------- embark-ui/src/components/Communication.js | 4 +- .../src/containers/CommunicationContainer.js | 17 +++++--- embark-ui/src/reducers/index.js | 13 +++++- embark-ui/src/reducers/selectors.js | 15 +++++++ embark-ui/src/sagas/index.js | 4 +- 6 files changed, 63 insertions(+), 33 deletions(-) diff --git a/embark-ui/src/actions/index.js b/embark-ui/src/actions/index.js index 1b696ca6..7e6db2b5 100644 --- a/embark-ui/src/actions/index.js +++ b/embark-ui/src/actions/index.js @@ -97,6 +97,27 @@ export const contractProfile = { failure: (error) => action(CONTRACT_PROFILE[FAILURE], {error}) }; +export const MESSAGE_VERSION = createRequestTypes('MESSAGE_VERSION'); +export const messageVersion = { + request: () => action(MESSAGE_VERSION[REQUEST]), + success: (messageVersion) => action(MESSAGE_VERSION[SUCCESS], {messageVersion}), + failure: (error) => action(MESSAGE_VERSION[FAILURE], {error}) +}; + +export const MESSAGE_SEND = createRequestTypes('MESSAGE_SEND'); +export const messageSend = { + request: (body) => action(MESSAGE_SEND[REQUEST], {body}), + success: () => action(MESSAGE_SEND[SUCCESS]), + failure: (error) => action(MESSAGE_SEND[FAILURE], {error}) +}; + +export const MESSAGE_LISTEN = createRequestTypes('MESSAGE_LISTEN'); +export const messageListen = { + request: (channel) => action(MESSAGE_LISTEN[REQUEST], {channel}), + success: (messages) => action(MESSAGE_LISTEN[SUCCESS], {messages}), + failure: (error) => action(MESSAGE_LISTEN[FAILURE], {error}) +}; + // Web Socket export const WATCH_NEW_PROCESS_LOGS = 'WATCH_NEW_PROCESS_LOGS'; export const INIT_BLOCK_HEADER = 'INIT_BLOCK_HEADER'; @@ -113,25 +134,3 @@ export function initBlockHeader(){ type: INIT_BLOCK_HEADER }; } - -export const MESSAGE_VERSION = createRequestTypes('MESSAGE_VERSION'); -export const messageVersion = { - request: () => action(MESSAGE_VERSION[REQUEST]), - success: (version) => action(MESSAGE_VERSION[SUCCESS], {version}), - failure: (error) => action(MESSAGE_VERSION[FAILURE], {error}) -}; - - -export const MESSAGE_SEND = createRequestTypes('MESSAGE_SEND'); -export const messageSend = { - request: (body) => action(MESSAGE_SEND[REQUEST], {body}), - success: () => action(MESSAGE_SEND[SUCCESS]), - failure: (error) => action(MESSAGE_SEND[FAILURE], {error}) -}; - -export const MESSAGE_LISTEN = createRequestTypes('MESSAGE_LISTEN'); -export const messageListen = { - request: (channel) => action(MESSAGE_LISTEN[REQUEST], {channel}), - success: (message) => action(MESSAGE_LISTEN[SUCCESS], {message}), - failure: (error) => action(MESSAGE_LISTEN[FAILURE], {error}) -}; diff --git a/embark-ui/src/components/Communication.js b/embark-ui/src/components/Communication.js index b81a36c3..3ecc897f 100644 --- a/embark-ui/src/components/Communication.js +++ b/embark-ui/src/components/Communication.js @@ -62,8 +62,8 @@ class Communication extends Component { return ( - {this.props.channels[channelName].messages.map((message, f) => { - return

{message}

; + {this.props.channels[channelName].map((data, f) => { + return

{data.message}

; })} diff --git a/embark-ui/src/containers/CommunicationContainer.js b/embark-ui/src/containers/CommunicationContainer.js index 7dd6f31a..6f7e9699 100644 --- a/embark-ui/src/containers/CommunicationContainer.js +++ b/embark-ui/src/containers/CommunicationContainer.js @@ -4,6 +4,8 @@ import connect from "react-redux/es/connect/connect"; import {Alert, Loader, Page} from 'tabler-react'; import {messageSend, messageListen, messageVersion} from "../actions"; import Communication from "../components/Communication"; +import Loading from "../components/Loading"; +import {getMessageVersion, getMessages} from "../reducers/selectors"; class CommunicationContainer extends Component { componentDidMount() { @@ -20,21 +22,24 @@ class CommunicationContainer extends Component { render() { let isEnabledMessage = ''; - if (this.props.messages.version === undefined || this.props.messages.version === null) { + if (this.props.messageVersion === undefined || this.props.messageVersion === null) { isEnabledMessage = Checking Whisper support, please wait; - } else if (!this.props.messages.version) { + } else if (!this.props.messageVersion) { isEnabledMessage = The node you are using does not support Whisper; - } else if (this.props.messages.version === -1) { + } else if (this.props.messageVersion === -1) { isEnabledMessage = The node uses an unsupported version of Whisper; } + if (!this.props.messages) { + return ; + } return ( {isEnabledMessage} this.listenToChannel(channel)} sendMessage={(channel, message) => this.sendMessage(channel, message)} - channels={this.props.messages.channels} + channels={this.props.messages} subscriptions={this.props.messages.subscriptions}/> ); @@ -45,12 +50,14 @@ CommunicationContainer.propTypes = { messageSend: PropTypes.func, messageListen: PropTypes.func, communicationVersion: PropTypes.func, + messageVersion: PropTypes.number, messages: PropTypes.object }; function mapStateToProps(state) { return { - messages: state.messages + messages: getMessages(state), + messageVersion: getMessageVersion(state) }; } diff --git a/embark-ui/src/reducers/index.js b/embark-ui/src/reducers/index.js index 1caea355..16874698 100644 --- a/embark-ui/src/reducers/index.js +++ b/embark-ui/src/reducers/index.js @@ -11,7 +11,10 @@ const entitiesDefaultState = { processLogs: [], contracts: [], contractProfiles: [], - commands: [] + commands: [], + messages: [], + subscriptions: [], + messageVersion: null }; const sorter = { @@ -23,6 +26,9 @@ const sorter = { }, processLogs: function(a, b) { return a.timestamp - b.timestamp; + }, + messages: function(a, b) { + return a.time - b.time; } }; @@ -50,7 +56,10 @@ function entities(state = entitiesDefaultState, action) { for (let name of Object.keys(state)) { let filter = filtrer[name] || (() => true); let sort = sorter[name] || (() => true); - if (action[name] && action[name].length > 1) { + if (action[name] && !Array.isArray(action[name])) { + return {...state, [name]: action[name]}; + } + if (action[name] && (!Array.isArray(action[name]) || action[name].length > 1)) { return {...state, [name]: [...action[name], ...state[name]].filter(filter).sort(sort)}; } if (action[name] && action[name].length === 1) { diff --git a/embark-ui/src/reducers/selectors.js b/embark-ui/src/reducers/selectors.js index 81cd9f9b..0b79c5cc 100644 --- a/embark-ui/src/reducers/selectors.js +++ b/embark-ui/src/reducers/selectors.js @@ -57,3 +57,18 @@ export function getContract(state, contractName) { export function getContractProfile(state, contractName) { return state.entities.contractProfiles.find((contractProfile => contractProfile.name === contractName)); } + +export function getMessageVersion(state) { + return state.entities.messageVersion; +} + +export function getMessages(state) { + const messages = {}; + state.entities.messages.forEach(message => { + if (!messages[message.channel]) { + messages[message.channel] = [] + } + messages[message.channel].push(message); + }); + return messages; +} diff --git a/embark-ui/src/sagas/index.js b/embark-ui/src/sagas/index.js index b952e1d2..c8edfb17 100644 --- a/embark-ui/src/sagas/index.js +++ b/embark-ui/src/sagas/index.js @@ -4,7 +4,7 @@ import {eventChannel} from 'redux-saga'; import {all, call, fork, put, takeEvery, take} from 'redux-saga/effects'; const {account, accounts, block, blocks, transaction, transactions, processes, commands, processLogs, - contracts, contract, contractProfile, messageSend, messageVersion} = actions; + contracts, contract, contractProfile, messageSend, messageVersion, messageListen} = actions; function *doRequest(entity, apiFn, payload) { const {response, error} = yield call(apiFn, payload); @@ -125,7 +125,7 @@ export function *listenToMessages(action) { const channel = yield call(createChannel, socket); while (true) { const message = yield take(channel); - yield put({type: actions.MESSAGE_LISTEN[actions.SUCCESS], channel: action.channel, message}); + yield put(messageListen.success([{channel: action.channel, message: message.data, time: message.time}])); } }