Merge pull request #234 from beejunk/update-dependencies

Update deps, fix linting/type changes

package.json

@@ -2,35 +2,37 @@
   "name": "shinkgs",
   "version": "0.4.0-dev",
   "devDependencies": {
+    "babel-eslint": "^10.1.0",
     "cross-env": "^7.0.2",
-    "eslint-config-prettier": "^3.0.1",
-    "eslint-plugin-prettier": "^2.6.2",
+    "eslint-config-prettier": "^6.11.0",
+    "eslint-plugin-flowtype": "^5.2.0",
+    "eslint-plugin-prettier": "^3.1.4",
     "eslint-plugin-react": "^7.11.1",
-    "flow-bin": "0.80.0",
+    "flow-bin": "^0.129.0",
     "node-sass": "4.14.1",
-    "prettier": "^1.14.2",
+    "prettier": "^2.0.5",
     "react-scripts": "3.4.1",
-    "serve": "^10.0.0"
+    "serve": "^11.3.2"
   },
   "dependencies": {
     "autolinker.js": "0.7.0",
     "axios": "^0.19.2",
     "chartist": "^0.11.0",
-    "date-fns": "^1.28.5",
-    "dom-helpers": "^3.3.1",
+    "date-fns": "^2.14.0",
+    "dom-helpers": "^5.1.4",
     "fastclick": "^1.0.6",
     "font-awesome": "4.7.0",
-    "history": "4.7.2",
-    "idb-keyval": "3.1.0",
+    "history": "^5.0.0",
+    "idb-keyval": "^3.2.0",
     "locale-string": "1.0.0",
     "lodash.get": "^4.4.2",
     "prop-types": "^15.6.2",
     "prop-types-extra": "^1.1.0",
-    "rc-slider": "^8.6.2",
+    "rc-slider": "^9.3.1",
     "react": "^16.5.0",
-    "react-chartist": "^0.13.0",
+    "react-chartist": "^0.14.3",
     "react-dom": "^16.5.0",
-    "uuid": "3.3.2"
+    "uuid": "^8.2.0"
   },
   "scripts": {
     "start": "cross-env REACT_APP_API_URL=\"/json-cors/access\"  react-scripts start",
@@ -39,7 +41,7 @@
     "build": "react-scripts build",
     "eject": "react-scripts eject",
     "test": "react-scripts test --env=jsdom",
-    "lint": "./node_modules/eslint/bin/eslint.js src/",
+    "lint": "eslint src/",
     "flow": "flow check",
     "now-deploy": "yarn build && cp server/* build && now",
     "now-start": "serve ./build --single"

src/App.js

@@ -1,6 +1,6 @@
 // @flow
 import React, { Component } from "react";
-import createHistory from "history/createBrowserHistory";
+import { createBrowserHistory } from "history";
 import LoginScreen from "./ui/LoginScreen";
 import {
   getInitialState,
@@ -32,7 +32,7 @@ class App extends Component<Props, State> {
   constructor(props: any, context: any) {
     super(props, context);
 
-    this._history = createHistory();
+    this._history = createBrowserHistory();
 
     this._client = new KgsClient();
     this._store = new AppStore(
@@ -75,7 +75,7 @@ class App extends Component<Props, State> {
   };
 
   _onHistoryChange = (loc: Object, action: string) => {
-    let path: NavOption = loc.pathname.substring(1);
+    let path: NavOption = loc.location.pathname.substring(1);
     if (action === "POP") {
       this._actions.onChangeNav(path, { push: false });
     }

src/model/AppActions.js

@@ -44,7 +44,7 @@ export class AppActions {
   };
 
   onRestoreAppState = () => {
-    this._store.restoreSavedState(APP_STATE_SAVE_KEY, appState => {
+    this._store.restoreSavedState(APP_STATE_SAVE_KEY, (appState) => {
       this._client.setState(appState.clientState);
       this._store.dispatch({ type: "APP_STATE_INITIALIZED" });
       let clientStatus = appState.clientState.status;
@@ -188,7 +188,7 @@ export class AppActions {
     } else {
       let gameSummaries = state.gameSummariesByUser[currentUser.name];
       let gameSummary = gameSummaries
-        ? gameSummaries.find(g => g.timestamp === gameId)
+        ? gameSummaries.find((g) => g.timestamp === gameId)
         : null;
       if (gameSummary) {
         players = gameSummary.players;
@@ -289,9 +289,9 @@ export class AppActions {
       proposal,
     });
     this._client.sendMessage({
+      ...proposal,
       type: "CHALLENGE_SUBMIT",
       channelId: challengeId,
-      ...proposal,
     });
   };
 
@@ -322,16 +322,16 @@ export class AppActions {
     // Users must be name-only
     let normProposal = {
       ...proposal,
-      players: proposal.players.map(p => {
+      players: proposal.players.map((p) => {
         p = { ...p, name: p.user ? p.user.name : p.name };
         delete p.user;
         return p;
       }),
     };
     this._client.sendMessage({
+      ...normProposal,
       type: "CHALLENGE_PROPOSAL",
       channelId: challengeId,
-      ...normProposal,
     });
   };
 
@@ -385,9 +385,9 @@ export class AppActions {
       let acceptable = proposalsEqual(sentProposal, proposal);
       if (acceptable) {
         this._client.sendMessage({
+          ...sentProposal,
           type: "CHALLENGE_ACCEPT",
           channelId: challengeId,
-          ...sentProposal,
         });
       } else {
         // TODO - reset challenge, show to current user for review
@@ -499,7 +499,7 @@ export class AppActions {
     this.onChangeNav("chat");
     let { conversationsById } = this._store.getState();
     let userConvo = Object.keys(conversationsById).find(
-      cid => conversationsById[cid].user === user.name
+      (cid) => conversationsById[cid].user === user.name
     );
     if (userConvo) {
       this.onSelectConversation(parseInt(userConvo, 10));
@@ -564,7 +564,7 @@ export class AppActions {
     // Only fetch rooms whose name we don't know yet
     let roomIds = distinct(
       Object.keys(roomsById).filter(
-        id => typeof roomsById[id].name !== "string"
+        (id) => typeof roomsById[id].name !== "string"
       )
     );
     if (roomIds.length) {
@@ -584,12 +584,12 @@ export class AppActions {
     let roomIds = distinct(
       games
         .filter(
-          g =>
+          (g) =>
             g.roomId &&
             (!roomsById[g.roomId] ||
               typeof roomsById[g.roomId].name !== "string")
         )
-        .map(g => g.roomId)
+        .map((g) => g.roomId)
     );
     if (roomIds.length) {
       this._client.sendMessage({ type: "ROOM_NAMES_REQUEST", rooms: roomIds });

src/model/AppStore.js

@@ -57,7 +57,7 @@ export class AppStore {
     return this._state.appState;
   };
 
-  saveState = (saveKey: string, prepareSavedState?: AppState => AppState) => {
+  saveState = (saveKey: string, prepareSavedState?: (AppState) => AppState) => {
     let saveState = { ...this.getState(), savedAt: new Date() };
     if (prepareSavedState) {
       saveState = prepareSavedState(saveState);
@@ -68,10 +68,10 @@ export class AppStore {
     set(saveKey, saveState);
   };
 
-  restoreSavedState = (saveKey: string, done: AppState => any) => {
+  restoreSavedState = (saveKey: string, done: (AppState) => any) => {
     let prevState = this.getState();
     get(saveKey)
-      .then(savedAppState => {
+      .then((savedAppState) => {
         if (this._debug) {
           console.log("Restoring saved app state...", savedAppState);
         }
@@ -80,7 +80,7 @@ export class AppStore {
         }
         done(this.getState());
       })
-      .catch(err => {
+      .catch((err) => {
         if (!navigator.userAgent.includes("jsdom")) {
           console.warn("Unable to restore saved app state: ", err);
           // Revert everything, just in case we errored out in a sync render due

src/model/KgsClient.js

@@ -178,9 +178,9 @@ export class KgsClient {
       }
 
       let nextState = { ...this.state, network: "online", retryTimes: 0 };
-      if (messages.find(msg => msg.type === "LOGOUT")) {
+      if (messages.find((msg) => msg.type === "LOGOUT")) {
         nextState.status = "loggedOut";
-      } else if (messages.find(msg => msg.type === "LOGIN_SUCCESS")) {
+      } else if (messages.find((msg) => msg.type === "LOGIN_SUCCESS")) {
         nextState.status = "loggedIn";
       }
       this.setState(nextState);
@@ -249,7 +249,7 @@ export class KgsClient {
         let err = new ApiError("Receive failed", errorType, xhr);
         reject(err);
       };
-      xhr.onreadystatechange = function() {
+      xhr.onreadystatechange = function () {
         if (xhr.readyState === 4) {
           if (xhr.status === 200) {
             let resp = JSON.parse(xhr.responseText);
@@ -280,7 +280,7 @@ export class KgsClient {
         let err = new ApiError("Send failed", errorType, xhr);
         reject(err);
       };
-      xhr.onreadystatechange = function() {
+      xhr.onreadystatechange = function () {
         if (xhr.readyState === 4) {
           if (xhr.status === 200) {
             resolve();

src/model/channel.js

@@ -26,7 +26,7 @@ export function handleChannelMessage(
     if (prevState.activeConversationId === msg.channelId) {
       nextState.activeConversationId = null;
     }
-    if (prevState.conversationsById[msg.channelId]) {
+    if (msg.channelId && prevState.conversationsById[msg.channelId]) {
       let conversationsById: Index<Conversation> = {
         ...prevState.conversationsById,
       };

src/model/conversation.js

@@ -1,5 +1,5 @@
 // @flow
-import uuidV4 from "uuid/v4";
+import { v4 as uuidV4 } from "uuid";
 import { isTempId } from "./tempId";
 import { InvariantError } from "../util/error";
 import type {
@@ -48,7 +48,7 @@ export function handleConversationMessage(
     let tempConvoId;
     if (msg.callbackKey) {
       tempConvoId = Object.keys(conversationsById).find(
-        cid =>
+        (cid) =>
           isTempId(conversationsById[cid].id) &&
           conversationsById[cid].callbackKey === msg.callbackKey
       );
@@ -110,13 +110,13 @@ export function handleConversationMessage(
       messages = [...conversationsById[chanId].messages];
     } else {
       let matchingMsg = conversationsById[chanId].messages.find(
-        m =>
+        (m) =>
           m.sending && m.body === convoMsg.body && m.sender === convoMsg.sender
       );
       if (matchingMsg) {
         let matchingId = matchingMsg.id;
         messages = conversationsById[chanId].messages.filter(
-          m => m.id !== matchingId
+          (m) => m.id !== matchingId
         );
         convoMsg.date = matchingMsg.date;
       } else {

src/model/game/challenge.js

@@ -177,8 +177,8 @@ export function createInitialProposal(
   let gameType = lastProposal
     ? lastProposal.gameType
     : canPlayRanked
-      ? "ranked"
-      : "free";
+    ? "ranked"
+    : "free";
   let rules: GameRules = lastProposal
     ? lastProposal.rules
     : {