Make socket automatically do the handshake on each reconnect

src/client/actions/CallActions.ts

@@ -1,7 +1,6 @@
 import socket from '../socket'
-import { Dispatch, ThunkResult } from '../store'
+import { ThunkResult } from '../store'
 import { callId } from '../window'
-import { ClientSocket } from '../socket'
 import * as NotifyActions from './NotifyActions'
 import * as SocketActions from './SocketActions'
 
@@ -20,26 +19,15 @@ const initialize = (): InitializeAction => ({
 
 export const init = (): ThunkResult<Promise<void>> =>
 async (dispatch, getState) => {
-  const socket = await dispatch(connect())
-
-  dispatch(SocketActions.handshake({
-    socket,
-    roomName: callId,
-  }))
-
-  dispatch(initialize())
-}
-
-export const connect = () => (dispatch: Dispatch) => {
-  return new Promise<ClientSocket>(resolve => {
-    socket.once('connect', () => {
-      resolve(socket)
-    })
-    socket.on('connect', () => {
-      dispatch(NotifyActions.warning('Connected to server socket'))
-    })
-    socket.on('disconnect', () => {
-      dispatch(NotifyActions.error('Server socket disconnected'))
-    })
+  socket.on('connect', () => {
+    dispatch(NotifyActions.warning('Connected to server socket'))
+    dispatch(SocketActions.handshake({
+      socket,
+      roomName: callId,
+    }))
+    dispatch(initialize())
+  })
+  socket.on('disconnect', () => {
+    dispatch(NotifyActions.error('Server socket disconnected'))
   })
 }

src/client/actions/SocketActions.ts

@@ -88,6 +88,10 @@ export function handshake (options: HandshakeOptions) {
       getState,
     })
 
+    // remove listeneres to make seocket reusable
+    socket.removeListener(constants.SOCKET_EVENT_SIGNAL, handler.handleSignal)
+    socket.removeListener(constants.SOCKET_EVENT_USERS, handler.handleUsers)
+
     socket.on(constants.SOCKET_EVENT_SIGNAL, handler.handleSignal)
     socket.on(constants.SOCKET_EVENT_USERS, handler.handleUsers)
 

src/client/reducers/streams.ts

@@ -43,6 +43,7 @@ function addStream (
   }
 
   if (userStreams.streams.map(s => s.stream).indexOf(stream) >= 0) {
+    console.log('stream already found')
     return state
   }