Merge remote-tracking branch 'origin/master' into postCodeButton

ocadotechnology · Aug 17, 2018 · 0675db1 · 0675db1
2 parents ac1c908 + d8b0c5f
commit 0675db1
Show file tree

Hide file tree

Showing 16 changed files with 146 additions and 134 deletions.
diff --git a/game_frontend/package.json b/game_frontend/package.json
@@ -39,10 +39,10 @@
     "react-dom": "^16.3.0",
     "react-redux": "^5.0.7",
     "react-unity-webgl": "^6.5.0",
-    "redux": "^3.7.2",
+    "redux": "^4.0.0",
     "redux-devtools-extension": "^2.13.2",
-    "redux-observable": "^0.18.0",
-    "rxjs": "^5.5.10",
+    "redux-observable": "^1.0.0",
+    "rxjs": "^6.2.2",
     "shelljs": "^0.8.1",
     "socket.io-client": "^2.1.1",
     "styled-components": "^3.2.5",

diff --git a/game_frontend/src/index.js b/game_frontend/src/index.js
@@ -1,6 +1,5 @@
 import React from 'react'
 import {render} from 'react-dom'
-import 'rxjs'
 import { createMuiTheme, MuiThemeProvider } from '@material-ui/core/styles'
 import { ThemeProvider } from 'styled-components'
 

diff --git a/game_frontend/src/redux/api/get.js b/game_frontend/src/redux/api/get.js
@@ -1,4 +1,4 @@
-import { ajax } from 'rxjs/observable/dom/ajax'
+import { ajax } from 'rxjs/ajax'
 import { API_PATH } from './constants'
 
 const get = endpoint => {

diff --git a/game_frontend/src/redux/api/post.js b/game_frontend/src/redux/api/post.js
@@ -1,19 +1,25 @@
-import { ajax } from 'rxjs/observable/dom/ajax'
-import { pipe } from 'rxjs/Rx'
+import { ajax } from 'rxjs/ajax'
+import { pipe } from 'rxjs'
+import { mergeMap, map } from 'rxjs/operators'
 import api from '../api'
 
 const getCSRFToken = action$ =>
-  action$.mergeMap(action =>
-    api.get('csrf_token')
-      .map(response => response.csrfToken)
+  action$.pipe(
+    mergeMap(action =>
+      api.get('csrf_token').pipe(
+        map(response => response.csrfToken)
+      )
+    )
   )
 
 const postOperator = (url, body) => csrfToken$ =>
-  csrfToken$.mergeMap(csrfToken =>
-    ajax.post(url, body(), {
-      withCredentials: true,
-      'X-CSRFToken': csrfToken
-    })
+  csrfToken$.pipe(
+    mergeMap(csrfToken =>
+      ajax.post(url, body(), {
+        withCredentials: true,
+        'X-CSRFToken': csrfToken
+      })
+    )
   )
 
 const post = (url, body) =>

diff --git a/game_frontend/src/redux/api/socket.js b/game_frontend/src/redux/api/socket.js
@@ -2,9 +2,7 @@ import io from 'socket.io-client'
 import { actions as gameActions } from '../features/Game'
 import { actions as consoleLogActions } from '../features/ConsoleLog'
 import { map, mergeMap } from 'rxjs/operators'
-import { merge } from 'rxjs/observable/merge'
-import { fromEvent } from 'rxjs/observable/fromEvent'
-import { pipe } from 'rxjs/Rx'
+import { fromEvent, pipe, merge } from 'rxjs'
 
 const connectToGame = () =>
   map(action => {

diff --git a/game_frontend/src/redux/api/socket.test.js b/game_frontend/src/redux/api/socket.test.js
@@ -1,5 +1,5 @@
 /* eslint-env jest */
-import { of } from 'rxjs/observable/of'
+import { of } from 'rxjs'
 import actions from '../features/Game/actions'
 import { tap } from 'rxjs/operators'
 import socket from './socket'

diff --git a/game_frontend/src/redux/api/unity.js b/game_frontend/src/redux/api/unity.js
@@ -1,27 +1,31 @@
 import { UnityEvent } from 'react-unity-webgl'
-import { Observable } from 'rxjs'
-import { map, catchError } from 'rxjs/operators'
+import { of } from 'rxjs'
+import { map, catchError, mergeMap } from 'rxjs/operators'
 
 const sendExternalEvent = communicator => action$ =>
-  action$.mergeMap(action =>
-    Observable.of(action).pipe(
-      communicator,
-      map(event => action.payload.successAction),
-      catchError(error => Observable.of(action.payload.failAction(error)))
+  action$.pipe(
+    mergeMap(action =>
+      of(action).pipe(
+        communicator,
+        map(event => action.payload.successAction),
+        catchError(error => of(action.payload.failAction(error)))
+      )
     )
   )
 
 const emitToUnity = action$ =>
-  action$.map(
-    action => {
-      let unityEvent = new UnityEvent('World Controller', action.payload.unityEvent)
+  action$.pipe(
+    map(
+      action => {
+        let unityEvent = new UnityEvent('World Controller', action.payload.unityEvent)
 
-      if (unityEvent.canEmit()) {
-        unityEvent.emit(action.payload.unityData)
-      } else {
-        throw new Error('Cannot emit the function!')
+        if (unityEvent.canEmit()) {
+          unityEvent.emit(action.payload.unityData)
+        } else {
+          throw new Error('Cannot emit the function!')
+        }
       }
-    }
+    )
   )
 
 export default {

diff --git a/game_frontend/src/redux/features/Editor/epics.js b/game_frontend/src/redux/features/Editor/epics.js
@@ -1,18 +1,18 @@
 import actions from './actions'
 import types from './types'
-import { Observable, Scheduler } from 'rxjs'
+import { Scheduler, of } from 'rxjs'
 import { map, mergeMap, catchError, debounceTime } from 'rxjs/operators'
 import { ofType } from 'redux-observable'
 
 const backgroundScheduler = Scheduler.async
 
-const getCodeEpic = (action$, store, { api }) =>
+const getCodeEpic = (action$, state$, { api }) =>
   action$.pipe(
     ofType(types.GET_CODE_REQUEST),
     mergeMap(action =>
-      api.get(`code/${store.getState().game.connectionParameters.game_id}/`).pipe(
+      api.get(`code/${state$.value.game.connectionParameters.game_id}/`).pipe(
         map(response => actions.getCodeReceived(response.code)),
-        catchError(error => Observable.of({
+        catchError(error => of({
           type: types.GET_CODE_FAILURE,
           payload: error.xhr.response,
           error: true
@@ -21,23 +21,23 @@ const getCodeEpic = (action$, store, { api }) =>
     )
   )
 
-const postCodeEpic = (action$, store, { api }) =>
+const postCodeEpic = (action$, state$, { api }) =>
   action$
     .pipe(
       ofType(types.POST_CODE_REQUEST),
       api.post(
-        `/aimmo/api/code/${store.getState().game.connectionParameters.game_id}/`,
-        () => ({ code: store.getState().editor.code })
+        `/aimmo/api/code/${state$.value.game.connectionParameters.game_id}/`,
+        () => ({ code: state$.value.editor.code })
       ),
       map(response => actions.postCodeReceived()),
-      catchError(error => Observable.of({
+      catchError(error => of({
         type: types.POST_CODE_FAILURE,
         payload: error.xhr.response,
         error: true
       }))
     )
 
-const changeCodeEpic = (action$, store, dependencies, scheduler = backgroundScheduler) =>
+const changeCodeEpic = (action$, state$, dependencies, scheduler = backgroundScheduler) =>
   action$.pipe(
     ofType(types.KEY_PRESSED),
     debounceTime(300, scheduler),

diff --git a/game_frontend/src/redux/features/Editor/epics.test.js b/game_frontend/src/redux/features/Editor/epics.test.js
@@ -1,13 +1,11 @@
 /* eslint-env jest */
-import { Observable, TestScheduler } from 'rxjs'
-import { ActionsObservable } from 'redux-observable'
+import { of, throwError, Subject } from 'rxjs'
+import { mapTo, mergeMapTo } from 'rxjs/operators'
+import { TestScheduler } from 'rxjs/testing'
+import { ActionsObservable, StateObservable } from 'redux-observable'
 import epics from './epics'
 import actions from './actions'
 import types from './types'
-import configureStore from 'redux-mock-store'
-
-const middlewares = []
-const mockStore = configureStore(middlewares)
 
 const deepEquals = (actual, expected) =>
   expect(actual).toEqual(expected)
@@ -33,17 +31,21 @@ describe('getCodeEpic', () => {
       testScheduler.createColdObservable(marbles1, values)
     )
     const mockGetJSON = () => {
-      return Observable.of({ code })
+      return of({ code })
     }
 
     const mockAPI = { api: { get: mockGetJSON } }
 
-    const actual = epics.getCodeEpic(source$, mockStore(
-      { game:
-        { connectionParameters:
-          { id: 1 }
+    const initialState = {
+      game: {
+        connectionParameters: {
+          id: 1
         }
-      }), mockAPI)
+      }
+    }
+    const state$ = new StateObservable(new Subject(), initialState)
+
+    const actual = epics.getCodeEpic(source$, state$, mockAPI)
 
     testScheduler.expectObservable(actual).toBe(marbles2, values)
     testScheduler.flush()
@@ -66,10 +68,12 @@ describe('postCodeEpic', () => {
       testScheduler.createColdObservable(marbles1, values)
     )
 
-    const mockPost = (url, body) => action$ => action$.mapTo({})
+    const mockPost = (url, body) => action$ => action$.pipe(
+      mapTo({})
+    )
     const mockAPI = { api: { post: mockPost } }
 
-    const state = {
+    const initialState = {
       game: {
         connectionParameters: {
           id: 1
@@ -80,7 +84,9 @@ describe('postCodeEpic', () => {
       }
     }
 
-    const actual = epics.postCodeEpic(source$, mockStore(state), mockAPI)
+    const state$ = new StateObservable(new Subject(), initialState)
+
+    const actual = epics.postCodeEpic(source$, state$, mockAPI)
 
     testScheduler.expectObservable(actual).toBe(marbles2, values)
     testScheduler.flush()
@@ -106,10 +112,12 @@ describe('postCodeEpic', () => {
     )
 
     const error = { xhr: { response: 'oh no!' } }
-    const mockPost = (url, body) => action$ => action$.mergeMapTo(Observable.throw(error))
+    const mockPost = (url, body) => action$ => action$.pipe(
+      mergeMapTo(throwError(error))
+    )
     const mockAPI = { api: { post: mockPost } }
 
-    const state = {
+    const initialState = {
       game: {
         connectionParameters: {
           id: 1
@@ -119,8 +127,9 @@ describe('postCodeEpic', () => {
         code: code
       }
     }
+    const state$ = new StateObservable(new Subject(), initialState)
 
-    const actual = epics.postCodeEpic(source$, mockStore(state), mockAPI)
+    const actual = epics.postCodeEpic(source$, state$, mockAPI)
 
     testScheduler.expectObservable(actual).toBe(marbles2, values)
     testScheduler.flush()
@@ -142,7 +151,8 @@ describe('changeCodeEpic', () => {
       testScheduler.createColdObservable(sourceMarbles, values)
     )
 
-    const actual = epics.changeCodeEpic(source$, mockStore({}), {}, testScheduler)
+    const state$ = new StateObservable(new Subject(), {})
+    const actual = epics.changeCodeEpic(source$, state$, {}, testScheduler)
 
     testScheduler.expectObservable(actual).toBe(expectMarbles, values)
     testScheduler.flush()

diff --git a/game_frontend/src/redux/features/Game/epics.js b/game_frontend/src/redux/features/Game/epics.js
@@ -1,19 +1,19 @@
 import actions from './actions'
 import types from './types'
-import { Observable } from 'rxjs'
-import { map, mergeMap, catchError, delay, tap } from 'rxjs/operators'
+import { of } from 'rxjs'
+import { map, mergeMap, catchError } from 'rxjs/operators'
 import { ofType } from 'redux-observable'
 
-const getConnectionParametersEpic = (action$, store, { api: { get } }) => action$.pipe(
+const getConnectionParametersEpic = (action$, state$, { api: { get } }) => action$.pipe(
   ofType(types.SOCKET_CONNECT_TO_GAME_REQUEST),
   mergeMap(action =>
-    get(`games/${store.getState().game.connectionParameters.game_id}/connection_parameters/`).pipe(
+    get(`games/${state$.value.game.connectionParameters.game_id}/connection_parameters/`).pipe(
       map(response => actions.connectionParametersReceived(response))
     )
   )
 )
 
-const sendGameStateEpic = (action$, store, { api: { unity } }) => action$.pipe(
+const sendGameStateEpic = (action$, state$, { api: { unity } }) => action$.pipe(
   ofType(types.SOCKET_GAME_STATE_RECEIVED),
   map(action => actions.unityEvent(
     'ReceiveGameUpdate',
@@ -24,18 +24,18 @@ const sendGameStateEpic = (action$, store, { api: { unity } }) => action$.pipe(
   unity.sendExternalEvent(unity.emitToUnity)
 )
 
-const connectToGameEpic = (action$, store, { api: { socket, unity } }) => action$.pipe(
+const connectToGameEpic = (action$, state$, { api: { socket, unity } }) => action$.pipe(
   ofType(types.CONNECTION_PARAMETERS_RECEIVED),
   socket.connectToGame(),
   socket.startListeners(),
-  catchError(error => Observable.of({
+  catchError(error => of({
     type: types.SOCKET_CONNECT_TO_GAME_FAIL,
     payload: error,
     error: true
   }))
 )
 
-const sendAvatarIDEpic = (action$, store, { api: { unity } }) => action$.pipe(
+const sendAvatarIDEpic = (action$, state$, { api: { unity } }) => action$.pipe(
   ofType(types.CONNECTION_PARAMETERS_RECEIVED),
   map(action => actions.unityEvent(
     'SetCurrentAvatarID',