Webatrice P.O.C. (#3854)

* port webclient POC into react shell

* Abstract websocket messaging behind redux store

* refactor architecture

* add rooms store

* introduce application service layer and login form

* display room messages

* implement roomSay

* improve Room view styling

* display room games

* improve gameList update logic

* hide protected games

* improve game update logic

* move mapping to earlier lifecycle hook

* add autoscroll to bottom

* tabs to spaces, refresh guard

* implement server joins/leaves

* show users in room

* add material-ui to build

* refactor, add room joins/leaves to store and render

* begin using Material UI components

* fix spectatorsCount

* remove unused package

* improve Server and Room styling

* fix scroll context

* route on room join

* refactor room path

* add auth guard

* refactor authGuard export

* add missing files

* clear store on disconnect, add logout button to Account view

* fix disconnect handling

* Safari fixes

* organize current todos

* improve login page and server status tracking

* improve login page

* introduce sorting arch, refine reducers, begin viewLogHistory

* audit fix for handlebars

* implement moderator log view

* comply with code style rules

* remove original POC from codebase

* add missing semi

* minor improvements, begin registration functionality

* retry as ws when wss fails

additionally, dont mutate the default options when connecting

* retain user/pass in WebClient.options for login

* take protocol off of options, make it a connect param that defaults to wss

* cleanup server page styling

* match wss logic with desktop client

* add virtual scroll component, add context menu to UserDisplay

* revert VirtualTable on messages

* improve styling for Room view

* add routing to Player view

* increase tooltip delay

* begin implementing Account view

* disable app level contextMenu

* implement buddy/ignore list management

* fix gitignore

Co-authored-by: Jay Letto <jeremy.letto@merrillcorp.com>
Co-authored-by: skwerlman <skwerlman@users.noreply.github.com>
Co-authored-by: Jeremy Letto <jeremy.letto@datasite.com>

webclient/src/WebClient/events/SessionEvents/AddToList.tsx

@@ -0,0 +1,18 @@
+export const AddToList = {
+  id: ".Event_AddToList.ext",
+  action: ({ listName, userInfo}, webClient) => {
+    switch (listName) {
+      case 'buddy': {
+        webClient.services.session.addToBuddyList(userInfo);
+        break;
+      }
+      case 'ignore': {
+        webClient.services.session.addToIgnoreList(userInfo);
+        break;
+      }
+      default: {
+        webClient.debug(() => console.log('Attempted to add to unknown list: ', listName));
+      }
+    }
+  }
+};

webclient/src/WebClient/events/SessionEvents/ConnectionClosed.tsx

@@ -0,0 +1,39 @@
+import { StatusEnum } from "types";
+
+export const ConnectionClosed = {
+  id: ".Event_ConnectionClosed.ext",
+  action: ({ reason }, webClient) => {
+    let message = "";
+
+    // @TODO (5)
+    switch(reason) {
+      case webClient.pb.Event_ConnectionClosed.CloseReason.USER_LIMIT_REACHED:
+        message = "The server has reached its maximum user capacity";
+        break;
+      case webClient.pb.Event_ConnectionClosed.CloseReason.TOO_MANY_CONNECTIONS:
+        message = "There are too many concurrent connections from your address";
+        break;
+      case webClient.pb.Event_ConnectionClosed.CloseReason.BANNED:
+        message = "You are banned";
+        break;
+      case webClient.pb.Event_ConnectionClosed.CloseReason.DEMOTED:
+        message = "You were demoted";
+        break;
+      case webClient.pb.Event_ConnectionClosed.CloseReason.SERVER_SHUTDOWN:
+        message = "Scheduled server shutdown";
+        break;
+      case webClient.pb.Event_ConnectionClosed.CloseReason.USERNAMEINVALID:
+        message = "Invalid username";
+        break;
+      case webClient.pb.Event_ConnectionClosed.CloseReason.LOGGEDINELSEWERE:
+        message = "You have been logged out due to logging in at another location";
+        break;
+      case webClient.pb.Event_ConnectionClosed.CloseReason.OTHER:
+      default:
+        message = "Unknown reason";
+        break;
+    }
+
+    webClient.updateStatus(StatusEnum.DISCONNECTED, message);
+  }
+};

webclient/src/WebClient/events/SessionEvents/ListRooms.tsx

@@ -0,0 +1,16 @@
+import * as _ from "lodash";
+
+export const ListRooms = {
+  id: ".Event_ListRooms.ext",
+  action: ({ roomList }, webClient) => {
+    webClient.services.room.updateRooms(roomList);
+
+    if (webClient.options.autojoinrooms) {
+      _.each(roomList, ({ autoJoin, roomId }) => {
+        if (autoJoin) {
+          webClient.commands.session.joinRoom(roomId);
+        }
+      });
+    }
+  }
+};

webclient/src/WebClient/events/SessionEvents/NotifyUser.tsx

@@ -0,0 +1,6 @@
+export const NotifyUser = {
+  id: ".Event_NotifyUser.ext",
+  action: (payload) => {
+    // console.info("Event_NotifyUser", payload);
+  }
+};

webclient/src/WebClient/events/SessionEvents/PlayerPropertiesChanges.tsx

@@ -0,0 +1,6 @@
+export const PlayerPropertiesChanges = {
+  id: ".Event_PlayerPropertiesChanges.ext",
+  action: (payload) => {
+    // console.info("Event_PlayerPropertiesChanges", payload);
+  }
+};

webclient/src/WebClient/events/SessionEvents/RemoveFromList.tsx

@@ -0,0 +1,18 @@
+export const RemoveFromList = {
+  id: ".Event_RemoveFromList.ext",
+  action: ({ listName, userName }, webClient) => {
+    switch (listName) {
+      case 'buddy': {
+        webClient.services.session.removeFromBuddyList(userName);
+        break;
+      }
+      case 'ignore': {
+        webClient.services.session.removeFromIgnoreList(userName);
+        break;
+      }
+      default: {
+        webClient.debug(() => console.log('Attempted to remove from unknown list: ', listName));
+      }
+    }
+  }
+};

webclient/src/WebClient/events/SessionEvents/ServerIdentification.tsx

@@ -0,0 +1,19 @@
+import { StatusEnum } from "types";
+
+export const ServerIdentification = {
+  id: ".Event_ServerIdentification.ext",
+  action: (info, webClient, _raw) => {
+    const { serverName, serverVersion, protocolVersion } = info;
+
+    if (protocolVersion !== webClient.protocolVersion) {
+      webClient.disconnect();
+      webClient.updateStatus(StatusEnum.DISCONNECTED, "Protocol version mismatch: " + protocolVersion);
+      return;
+    }
+
+    webClient.resetConnectionvars();
+    webClient.updateStatus(StatusEnum.LOGGINGIN, "Logging in...");
+    webClient.services.session.updateInfo(serverName, serverVersion);
+    webClient.commands.session.login();
+  }
+};

webclient/src/WebClient/events/SessionEvents/ServerMessage.tsx

@@ -0,0 +1,6 @@
+export const ServerMessage = {
+  id: ".Event_ServerMessage.ext",
+  action: ({ message }, webClient) => {
+    webClient.services.session.serverMessage(message);
+  }
+};

webclient/src/WebClient/events/SessionEvents/ServerShutdown.tsx

@@ -0,0 +1,6 @@
+export const ServerShutdown = {
+  id: ".Event_ServerShutdown.ext",
+  action: (payload, webClient) => {
+    // console.info("Event_ServerShutdown", payload);
+  }
+};

webclient/src/WebClient/events/SessionEvents/UserJoined.tsx

@@ -0,0 +1,6 @@
+export const UserJoined = {
+  id: ".Event_UserJoined.ext",
+  action: ({ userInfo }, webClient) => {
+    webClient.services.session.userJoined(userInfo);
+  }
+};

webclient/src/WebClient/events/SessionEvents/UserLeft.tsx

@@ -0,0 +1,6 @@
+export const UserLeft = {
+  id: ".Event_UserLeft.ext",
+  action: ({ name }, webClient) => {
+    webClient.services.session.userLeft(name);
+  }
+};

webclient/src/WebClient/events/SessionEvents/UserMessage.tsx

@@ -0,0 +1,6 @@
+export const UserMessage = {
+  id: ".Event_UserMessage.ext",
+  action: (payload) => {
+    // console.info("Event_UserMessage", payload);
+  }
+};

webclient/src/WebClient/events/SessionEvents/index.ts

@@ -0,0 +1,12 @@
+export * from "./ConnectionClosed";
+export * from "./ListRooms";
+export * from "./AddToList";
+export * from "./RemoveFromList";
+export * from "./NotifyUser"; // @TODO
+export * from "./PlayerPropertiesChanges"; // @TODO
+export * from "./ServerIdentification";
+export * from "./ServerMessage";
+export * from "./ServerShutdown"; // @TODO
+export * from "./UserJoined";
+export * from "./UserLeft";
+export * from "./UserMessage"; // @TODO