diff --git a/client/src/actions/app.js b/client/src/actions/app.js index 42e37f5..084c7a2 100644 --- a/client/src/actions/app.js +++ b/client/src/actions/app.js @@ -1,3 +1,7 @@ +import { + process as processMessage, +} from 'utils/message' + export const openModal = payload => ({ type: 'OPEN_MODAL', payload }) export const closeModal = () => ({ type: 'CLOSE_MODAL' }) @@ -18,3 +22,18 @@ export const toggleSoundEnabled = payload => async (dispatch) => { export const toggleSocketConnected = payload => async (dispatch) => { dispatch({ type: 'TOGGLE_SOCKET_CONNECTED', payload }) } + +export const receiveEncryptedMessage = payload => async (dispatch, getState) => { + const state = getState() + const message = await processMessage(payload, state) + // Pass current state to all RECEIVE_ENCRYPTED_MESSAGE reducers for convenience, since each may have different needs + dispatch({ type: `RECEIVE_ENCRYPTED_MESSAGE_${message.type}`, payload: { payload: message.payload, state } }) +} + +export const createUser = payload => async (dispatch) => { + dispatch({ type: 'CREATE_USER', payload }) +} + +export const clearActivities = () => async (dispatch) => { + dispatch({ type: 'CLEAR_ACTIVITIES' }) +} diff --git a/client/src/actions/encrypted_messages.js b/client/src/actions/encrypted_messages.js new file mode 100644 index 0000000..e934ab1 --- /dev/null +++ b/client/src/actions/encrypted_messages.js @@ -0,0 +1,11 @@ +import { getSocket } from 'utils/socket' +import { + prepare as prepareMessage, +} from 'utils/message' + +export const sendEncryptedMessage = payload => async (dispatch, getState) => { + const state = getState() + const msg = await prepareMessage(payload, state) + dispatch({ type: `SEND_ENCRYPTED_MESSAGE_${msg.original.type}`, payload: msg.original.payload }) + getSocket().emit('ENCRYPTED_MESSAGE', msg.toSend) +} \ No newline at end of file diff --git a/client/src/actions/index.js b/client/src/actions/index.js index 7949d05..3504084 100644 --- a/client/src/actions/index.js +++ b/client/src/actions/index.js @@ -1,3 +1,4 @@ -export * from './room' export * from './app' +export * from './unencrypted_messages' +export * from './encrypted_messages' diff --git a/client/src/actions/room.js b/client/src/actions/room.js deleted file mode 100644 index 64ba53c..0000000 --- a/client/src/actions/room.js +++ /dev/null @@ -1,99 +0,0 @@ -import isEqual from 'lodash/isEqual' -import { - process as processMessage, - prepare as prepareMessage, -} from 'utils/message' -import { getSocket } from 'utils/socket' - -export const receiveEncryptedMessage = payload => async (dispatch, getState) => { - const state = getState() - const message = await processMessage(payload, state) - // Pass current state to all RECEIVE_ENCRYPTED_MESSAGE reducers for convenience, since each may have different needs - dispatch({ type: `RECEIVE_ENCRYPTED_MESSAGE_${message.type}`, payload: { payload: message.payload, state } }) -} - -export const createUser = payload => async (dispatch) => { - dispatch({ type: 'CREATE_USER', payload }) -} - -export const sendUserEnter = payload => async () => { - getSocket().emit('USER_ENTER', { - publicKey: payload.publicKey, - }) -} - -export const receiveUserExit = payload => async (dispatch, getState) => { - const state = getState() - const exitingUser = state.room.members.find(m => !payload.map(p => JSON.stringify(p.publicKey)).includes(JSON.stringify(m.publicKey))) - - if (!exitingUser) { - return; - } - - const exitingUserId = exitingUser.id - const exitingUsername = exitingUser.username - - dispatch({ - type: 'USER_EXIT', - payload: { - members: payload, - id: exitingUserId, - username: exitingUsername, - }, - }) -} - -export const receiveUserEnter = payload => async (dispatch) => { - dispatch({ type: 'USER_ENTER', payload }) -} - -export const onFileTransfer = payload => async (dispatch) => { - dispatch({ type: 'PREFLIGHT_FILE_TRANSFER', payload }) -} - -export const sendEncryptedMessage = payload => async (dispatch, getState) => { - const state = getState() - const msg = await prepareMessage(payload, state) - dispatch({ type: `SEND_ENCRYPTED_MESSAGE_${msg.original.type}`, payload: msg.original.payload }) - getSocket().emit('ENCRYPTED_MESSAGE', msg.toSend) -} - -export const toggleLockRoom = () => async (dispatch, getState) => { - const state = getState() - getSocket().emit('TOGGLE_LOCK_ROOM', null, (res) => { - dispatch({ - type: 'TOGGLE_LOCK_ROOM', - payload: { - locked: res.isLocked, - username: state.user.username, - sender: state.user.id, - }, - }) - }) -} - -export const receiveToggleLockRoom = payload => async (dispatch, getState) => { - const state = getState() - - const lockedByUser = state.room.members.find(m => isEqual(m.publicKey, payload.publicKey)) - const lockedByUsername = lockedByUser.username - const lockedByUserId = lockedByUser.id - - dispatch({ - type: 'RECEIVE_TOGGLE_LOCK_ROOM', - payload: { - username: lockedByUsername, - locked: payload.locked, - id: lockedByUserId, - }, - }) -} - -export const clearActivities = () => async (dispatch) => { - dispatch({ type: 'CLEAR_ACTIVITIES' }) -} - -export const sendUserDisconnect = () => async () => { - getSocket().emit('USER_DISCONNECT') -} - diff --git a/client/src/actions/unencrypted_messages.js b/client/src/actions/unencrypted_messages.js new file mode 100644 index 0000000..85586e9 --- /dev/null +++ b/client/src/actions/unencrypted_messages.js @@ -0,0 +1,80 @@ +import { getSocket } from 'utils/socket' +import isEqual from 'lodash/isEqual' + +const receiveUserEnter = (payload, dispatch) => { + dispatch({ type: 'USER_ENTER', payload }) +} + +const receiveToggleLockRoom = (payload, dispatch, getState) => { + const state = getState() + + const lockedByUser = state.room.members.find(m => isEqual(m.publicKey, payload.publicKey)) + const lockedByUsername = lockedByUser.username + const lockedByUserId = lockedByUser.id + + dispatch({ + type: 'RECEIVE_TOGGLE_LOCK_ROOM', + payload: { + username: lockedByUsername, + locked: payload.locked, + id: lockedByUserId, + }, + }) +} + +const receiveUserExit = (payload, dispatch, getState) => { + const state = getState() + const exitingUser = state.room.members.find(m => !payload.map(p => JSON.stringify(p.publicKey)).includes(JSON.stringify(m.publicKey))) + + if (!exitingUser) { + return; + } + + const exitingUserId = exitingUser.id + const exitingUsername = exitingUser.username + + dispatch({ + type: 'USER_EXIT', + payload: { + members: payload, + id: exitingUserId, + username: exitingUsername, + }, + }) +} + +export const receiveUnencryptedMessage = (type, payload) => async (dispatch, getState) => { + switch(type) { + case 'USER_ENTER': + return receiveUserEnter(payload, dispatch); + case 'USER_EXIT': + return receiveUserExit(payload, dispatch, getState); + case 'TOGGLE_LOCK_ROOM': + return receiveToggleLockRoom(payload, dispatch, getState); + default: + return; + } +} + +const sendToggleLockRoom = (dispatch, getState) => { + const state = getState() + getSocket().emit('TOGGLE_LOCK_ROOM', null, (res) => { + dispatch({ + type: 'TOGGLE_LOCK_ROOM', + payload: { + locked: res.isLocked, + username: state.user.username, + sender: state.user.id, + }, + }) + }) +} + +export const sendUnencryptedMessage = (type, payload) => async (dispatch, getState) => { + switch(type) { + case 'TOGGLE_LOCK_ROOM': + return sendToggleLockRoom(dispatch, getState); + default: + return; + } +} \ No newline at end of file diff --git a/client/src/components/Home/index.js b/client/src/components/Home/index.js index 54a3d95..3e661cc 100644 --- a/client/src/components/Home/index.js +++ b/client/src/components/Home/index.js @@ -24,20 +24,16 @@ import { getObjectUrl } from 'utils/file' import { connect } from 'react-redux' import { receiveEncryptedMessage, - sendEncryptedMessage, createUser, - receiveUserExit, - receiveUserEnter, - toggleLockRoom, - receiveToggleLockRoom, openModal, closeModal, setScrolledToBottom, - sendUserEnter, toggleWindowFocus, toggleSoundEnabled, toggleSocketConnected, - sendUserDisconnect + receiveUnencryptedMessage, + sendUnencryptedMessage, + sendEncryptedMessage } from 'actions' import styles from './styles.module.scss' @@ -65,29 +61,19 @@ class Home extends Component { const socket = connectSocket(roomId) - const disconnectEvents = [ - 'disconnect', - ] + this.socket = socket; - disconnectEvents.forEach((evt) => { - socket.on(evt, () => { - this.props.toggleSocketConnected(false) - }) + socket.on('disconnect', () => { + this.props.toggleSocketConnected(false) }) - const connectEvents = [ - 'connect', - ] - - connectEvents.forEach((evt) => { - socket.on(evt, () => { - this.initApp(user) - this.props.toggleSocketConnected(true) - }) + socket.on('connect', () => { + this.initApp(user) + this.props.toggleSocketConnected(true) }) socket.on('USER_ENTER', (payload) => { - this.props.receiveUserEnter(payload) + this.props.receiveUnencryptedMessage('USER_ENTER', payload) this.props.sendEncryptedMessage({ type: 'ADD_USER', payload: { @@ -100,7 +86,7 @@ class Home extends Component { }) socket.on('USER_EXIT', (payload) => { - this.props.receiveUserExit(payload) + this.props.receiveUnencryptedMessage('USER_EXIT', payload) }) socket.on('ENCRYPTED_MESSAGE', (payload) => { @@ -108,7 +94,7 @@ class Home extends Component { }) socket.on('TOGGLE_LOCK_ROOM', (payload) => { - this.props.receiveToggleLockRoom(payload) + this.props.receiveUnencryptedMessage('TOGGLE_LOCK_ROOM', payload) }) socket.on('ROOM_LOCKED', (payload) => { @@ -116,7 +102,7 @@ class Home extends Component { }); window.addEventListener('beforeunload', (evt) => { - this.props.sendUserDisconnect(); + socket.emit('USER_DISCONNECT') }); } @@ -289,7 +275,7 @@ class Home extends Component { } initApp(user) { - this.props.sendUserEnter({ + this.socket.emit('USER_ENTER', { publicKey: user.publicKey, }) } @@ -363,7 +349,7 @@ class Home extends Component { members={this.props.members} roomId={this.props.roomId} roomLocked={this.props.roomLocked} - toggleLockRoom={this.props.toggleLockRoom} + toggleLockRoom={() => this.props.sendUnencryptedMessage('TOGGLE_LOCK_ROOM')} openModal={this.props.openModal} iAmOwner={this.props.iAmOwner} userId={this.props.userId} @@ -426,10 +412,7 @@ Home.defaultProps = { Home.propTypes = { receiveEncryptedMessage: PropTypes.func.isRequired, - sendEncryptedMessage: PropTypes.func.isRequired, createUser: PropTypes.func.isRequired, - receiveUserExit: PropTypes.func.isRequired, - receiveUserEnter: PropTypes.func.isRequired, activities: PropTypes.array.isRequired, username: PropTypes.string.isRequired, publicKey: PropTypes.object.isRequired, @@ -437,16 +420,12 @@ Home.propTypes = { match: PropTypes.object.isRequired, roomId: PropTypes.string.isRequired, roomLocked: PropTypes.bool.isRequired, - toggleLockRoom: PropTypes.func.isRequired, - receiveToggleLockRoom: PropTypes.func.isRequired, modalComponent: PropTypes.string, openModal: PropTypes.func.isRequired, closeModal: PropTypes.func.isRequired, setScrolledToBottom: PropTypes.func.isRequired, scrolledToBottom: PropTypes.bool.isRequired, iAmOwner: PropTypes.bool.isRequired, - sendUserEnter: PropTypes.func.isRequired, - sendUserDisconnect: PropTypes.func.isRequired, userId: PropTypes.string.isRequired, joining: PropTypes.bool.isRequired, toggleWindowFocus: PropTypes.func.isRequired, @@ -455,6 +434,8 @@ Home.propTypes = { toggleSoundEnabled: PropTypes.func.isRequired, toggleSocketConnected: PropTypes.func.isRequired, socketConnected: PropTypes.bool.isRequired, + sendUnencryptedMessage: PropTypes.func.isRequired, + sendEncryptedMessage: PropTypes.func.isRequired } const mapStateToProps = (state) => { @@ -481,20 +462,16 @@ const mapStateToProps = (state) => { const mapDispatchToProps = { receiveEncryptedMessage, - sendEncryptedMessage, - receiveUserExit, - receiveUserEnter, createUser, - toggleLockRoom, - receiveToggleLockRoom, openModal, closeModal, setScrolledToBottom, - sendUserEnter, toggleWindowFocus, toggleSoundEnabled, toggleSocketConnected, - sendUserDisconnect + receiveUnencryptedMessage, + sendUnencryptedMessage, + sendEncryptedMessage } export default connect(