Structure change (#4220)

* Structure change

* Remove duplicate folders from previous structure

* Cleanup websocket protocol

* Updating from based off PR

* Fixup - remove wrong files during conflict and get the websocket working

* renaming tsx to ts

Co-authored-by: Jeremy Letto <jeremy.letto@datasite.com>

webclient/copy_shared_files.ps1

@@ -0,0 +1,3 @@
+#!/bin/bash
+robocopy /E ../common/pb/. ./public/pb/
+robocopy /E ../cockatrice/resources/countries/. ./src/images/countries

webclient/package-lock.json

@@ -1612,6 +1612,24 @@
         "@types/react": "*"
       }
     },
+    "@types/react-virtualized-auto-sizer": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/@types/react-virtualized-auto-sizer/-/react-virtualized-auto-sizer-1.0.0.tgz",
+      "integrity": "sha512-NMErdIdSnm2j/7IqMteRiRvRulpjoELnXWUwdbucYCz84xG9PHcoOrr7QfXwB/ku7wd6egiKFrzt/+QK4Imeeg==",
+      "dev": true,
+      "requires": {
+        "@types/react": "*"
+      }
+    },
+    "@types/react-window": {
+      "version": "1.8.2",
+      "resolved": "https://registry.npmjs.org/@types/react-window/-/react-window-1.8.2.tgz",
+      "integrity": "sha512-gP1xam68Wc4ZTAee++zx6pTdDAH08rAkQrWm4B4F/y6hhmlT9Mgx2q8lTCXnrPHXsr15XjRN9+K2DLKcz44qEQ==",
+      "dev": true,
+      "requires": {
+        "@types/react": "*"
+      }
+    },
     "@types/redux": {
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/@types/redux/-/redux-3.6.0.tgz",

webclient/package.json

@@ -37,8 +37,7 @@
     "start": "react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",
-    "eject": "react-scripts eject",
-    "postinstall": "./copy_shared_files.sh"
+    "eject": "react-scripts eject"
   },
   "eslintConfig": {
     "extends": "react-app"
@@ -54,5 +53,9 @@
       "last 1 firefox version",
       "last 1 safari version"
     ]
+  },
+  "devDependencies": {
+    "@types/react-virtualized-auto-sizer": "^1.0.0",
+    "@types/react-window": "^1.8.2"
   }
 }

webclient/src/AppShell/common/services/index.ts

@@ -1,4 +0,0 @@
-export * from "./AuthenticationService";
-export * from "./ModeratorService";
-export * from "./RoomsService";
-export * from "./SessionService";

webclient/src/AppShell/common/types/index.tsx

@@ -1,2 +0,0 @@
-export * from "./routes";
-export * from "./user";

webclient/src/AppShell/common/types/user.tsx

@@ -1,3 +0,0 @@
-export interface User {
-  name: string;
-}

webclient/src/WebClient/commands/index.tsx

@@ -1,2 +0,0 @@
-export * from "./RoomCommands";
-export * from "./SessionCommands";

webclient/src/WebClient/events/RoomEvents/index.tsx

@@ -1,4 +0,0 @@
-export * from "./JoinRoom";
-export * from "./LeaveRoom";
-export * from "./ListGames";
-export * from "./RoomSay";

webclient/src/WebClient/services/RoomService.tsx

@@ -1,53 +0,0 @@
-import { Dispatch, Selectors } from "store/rooms";
-import { store } from "store";
-
-
-import { WebClient } from "../WebClient";
-
-import { NormalizeService } from "./NormalizeService";
-
-export class RoomService {
-  webClient: WebClient;
-
-  constructor(webClient) {
-    this.webClient = webClient;
-  }
-
-  clearStore() {
-    Dispatch.clearStore();
-  }
-
-  joinRoom(roomInfo) {
-    NormalizeService.normalizeRoomInfo(roomInfo);
-    Dispatch.joinRoom(roomInfo);
-  }
-
-  updateRooms(rooms) {
-    Dispatch.updateRooms(rooms);
-  }
-
-  updateGames(roomId, gameList) {
-    const game = gameList[0];
-
-    if (!game.gameType) {
-      const { gametypeMap } = Selectors.getRoom(store.getState(), roomId);
-      NormalizeService.normalizeGameObject(game, gametypeMap);
-    }
-
-    Dispatch.updateGames(roomId, gameList);
-  }
-
-  addMessage(roomId, message) {
-    NormalizeService.normalizeUserMessage(message);
-
-    Dispatch.addMessage(roomId, message);
-  }
-
-  userJoined(roomId, user) {
-    Dispatch.userJoined(roomId, user);
-  }
-
-  userLeft(roomId, name) {
-    Dispatch.userLeft(roomId, name);
-  }
-}

webclient/src/WebClient/services/index.ts

@@ -1,3 +0,0 @@
-export * from "./NormalizeService";
-export * from "./RoomService";
-export * from "./SessionService";

webclient/src/components/Decks/Decks.tsx

@@ -1,7 +1,7 @@
 // eslint-disable-next-line
 import React, { Component } from "react";
 
-import AuthGuard from "AppShell/common/guards/AuthGuard";
+import { AuthGuard } from "components/index";
 
 import "./Decks.css";
 

webclient/src/components/Game/Game.tsx

@@ -1,7 +1,7 @@
 // eslint-disable-next-line
 import React, { Component } from "react";
 
-import AuthGuard from "AppShell/common/guards/AuthGuard";
+import { AuthGuard } from "../index";
 
 import "./Game.css";
 

webclient/src/components/Guard/AuthGuard.tsx

@@ -2,10 +2,10 @@ import React, { Component } from "react";
 import { connect } from "react-redux";
 import { Redirect } from "react-router-dom";
 
-import { Selectors } from "store/server";
+import { ServerSelectors } from "store";
+import { RouteEnum } from "types";
 
-import { AuthenticationService } from "AppShell/common/services";
-import { RouteEnum } from "AppShell/common/types";
+import { AuthenticationService } from "websocket";
 
 class AuthGuard extends Component<AuthGuardProps> {
   render() {
@@ -20,7 +20,7 @@ interface AuthGuardProps {
 }
 
 const mapStateToProps = state => ({
-  state: Selectors.getState(state),
+  state: ServerSelectors.getState(state),
 });
 
 export default connect(mapStateToProps)(AuthGuard);

webclient/src/components/Guard/ModGuard.tsx

@@ -2,11 +2,11 @@ import React, { Component } from "react";
 import { connect } from "react-redux";
 import { Redirect } from "react-router-dom";
 
-import { Selectors } from "store/server";
+import { ServerSelectors } from "store";
 import { User } from "types";
 
-import { AuthenticationService } from "AppShell/common/services";
-import { RouteEnum } from "AppShell/common/types";
+import { AuthenticationService } from "websocket";
+import { RouteEnum } from "types";
 
 class ModGuard extends Component<ModGuardProps> {
   render() {
@@ -21,7 +21,7 @@ interface ModGuardProps {
 }
 
 const mapStateToProps = state => ({
-  user: Selectors.getUser(state),
+  user: ServerSelectors.getUser(state),
 });
 
 export default connect(mapStateToProps)(ModGuard);

webclient/src/components/Header/Header.tsx

@@ -6,12 +6,11 @@ import Chip from "@material-ui/core/Chip";
 import Toolbar from "@material-ui/core/Toolbar";
 import * as _ from "lodash";
 
-import { Selectors as RoomsSelectors } from "store/rooms";
-import { Selectors as ServerSelectors } from "store/server";
+import {  RoomsSelectors, ServerSelectors } from "store";
 import { Room, User } from "types";
 
-import { AuthenticationService } from "AppShell/common/services";
-import { RouteEnum } from "AppShell/common/types";
+import { AuthenticationService } from "../../websocket";
+import { RouteEnum } from "../../types";
 
 import "./Header.css";
 import logo from "./logo.png";

webclient/src/components/InputAction/InputAction.tsx

@@ -3,7 +3,7 @@ import React from "react";
 import { Field } from "redux-form"
 import Button from "@material-ui/core/Button";
 
-import InputField from '../InputField/InputField';
+import { InputField } from 'components';
 
 import "./InputAction.css";
 

webclient/src/components/Logs/Logs.tsx

@@ -4,14 +4,13 @@ import { connect } from "react-redux";
 import { withRouter } from "react-router-dom";
 import * as _ from "lodash";
 
-import { Dispatch, Selectors, ServerStateLogs } from "store/server"
+import { ServerDispatch, ServerSelectors, ServerStateLogs } from "store";
 
-import { ModeratorService } from "AppShell/common/services";
-import AuthGuard from "AppShell/common/guards/AuthGuard";
-import ModGuard from "AppShell/common/guards/ModGuard";
+import { ModeratorService } from "websocket";
 
-import LogResults from "./LogResults/LogResults";
-import SearchForm from "./SearchForm/SearchForm";
+import { AuthGuard, ModGuard} from "components";
+import LogResults from "./LogResults";
+import { SearchForm } from "forms";
 
 import "./Logs.css";
 
@@ -25,7 +24,7 @@ class Logs extends Component<LogsTypes> {
   }
 
   componentWillUnmount() {
-    Dispatch.clearLogs();
+    ServerDispatch.clearLogs();
   }
 
   onSubmit(fields) {
@@ -96,7 +95,7 @@ interface LogsTypes {
 }
 
 const mapStateToProps = state => ({
-  logs: Selectors.getLogs(state)
+  logs: ServerSelectors.getLogs(state)
 });
 
 export default withRouter(connect(mapStateToProps)(Logs));

webclient/src/components/Player/Player.tsx

@@ -1,9 +1,7 @@
 // eslint-disable-next-line
 import React, { Component } from "react";
 
-import AuthGuard from "AppShell/common/guards/AuthGuard";
-
-import "./Player.css";
+import { AuthGuard } from "components";
 
 class Player extends Component {
   render() {

webclient/src/components/Room/Games.tsx

@@ -13,9 +13,8 @@ import Tooltip from "@material-ui/core/Tooltip";
 
 // import { RoomsService } from "AppShell/common/services";
 
-import { SortUtil } from "store/common";
-import { Dispatch, Selectors } from "store/rooms";
-import UserDisplay from "AppShell/common/components/UserDisplay/UserDisplay";
+import { SortUtil, RoomsDispatch, RoomsSelectors } from "store";
+import { UserDisplay } from "components";
 
 import "./Games.css";
 
@@ -55,7 +54,7 @@ class Games extends Component<GamesProps> {
   handleSort(sortByField) {
     const { room: { roomId }, sortBy } = this.props;
     const { field, order } = SortUtil.toggleSortBy(sortByField, sortBy);
-    Dispatch.sortGames(roomId, field, order);
+    RoomsDispatch.sortGames(roomId, field, order);
   }
 
   private isUnavailableGame({ started, maxPlayers, playerCount }) {
@@ -138,7 +137,7 @@ interface GamesProps {
 }
 
 const mapStateToProps = state => ({
-  sortBy: Selectors.getSortGamesBy(state)
+  sortBy: RoomsSelectors.getSortGamesBy(state)
 });
 
 export default connect(mapStateToProps)(Games);

webclient/src/components/Room/Room.tsx

@@ -5,19 +5,15 @@ import { withRouter /*, RouteComponentProps */ } from "react-router-dom";
 import ListItem from "@material-ui/core/ListItem";
 import Paper from "@material-ui/core/Paper";
 
-import { RoomsStateMessages, RoomsStateRooms, Selectors } from "store/rooms";
+import { RoomsStateMessages, RoomsStateRooms, RoomsSelectors } from "store";
+import { RoomsService } from "websocket";
+import { ScrollToBottomOnChanges, ThreePaneLayout, UserDisplay, VirtualList, AuthGuard} from "components";
 
-import AuthGuard from "AppShell/common/guards/AuthGuard";
-import { RoomsService } from "AppShell/common/services";
 
-import ScrollToBottomOnChanges from "AppShell/common/components/ScrollToBottomOnChanges/ScrollToBottomOnChanges";
-import ThreePaneLayout from "AppShell/common/components/ThreePaneLayout/ThreePaneLayout";
-import UserDisplay from "AppShell/common/components/UserDisplay/UserDisplay";
-import VirtualList from "AppShell/common/components/VirtualList/VirtualList";
 
-import Games from "./Games/Games";
-import Messages from "./Messages/Messages";
-import SayMessage from "./SayMessage/SayMessage";
+import Games from "./Games";
+import Messages from "./Messages";
+import SayMessage from "./SayMessage";
 
 import "./Room.css";
 
@@ -96,8 +92,8 @@ interface RoomProps {
 }
 
 const mapStateToProps = state => ({
-  messages: Selectors.getMessages(state),
-  rooms: Selectors.getRooms(state)
+  messages: RoomsSelectors.getMessages(state),
+  rooms: RoomsSelectors.getRooms(state)
 });
 
 export default withRouter(connect(mapStateToProps)(Room));

webclient/src/components/Room/SayMessage.tsx

@@ -3,7 +3,7 @@ import React from "react";
 import { connect } from "react-redux";
 import { Form, reduxForm } from "redux-form"
 
-import InputAction from 'AppShell/common/components/InputAction/InputAction';
+import { InputAction } from 'components';
 
 const SayMessage = ({ handleSubmit }) => (
   <Form onSubmit={handleSubmit}>

webclient/src/components/Server/Rooms.tsx

@@ -10,8 +10,9 @@ import TableCell from "@material-ui/core/TableCell";
 import TableHead from "@material-ui/core/TableHead";
 import TableRow from "@material-ui/core/TableRow";
 
-import { RoomsService } from "AppShell/common/services";
-import { RouteEnum } from "AppShell/common/types";
+
+import { RoomsService } from "websocket";
+import { RouteEnum } from "types";
 
 import "./Rooms.css";
 

webclient/src/components/Server/Server.tsx

@@ -7,19 +7,14 @@ import Button from "@material-ui/core/Button";
 import ListItem from "@material-ui/core/ListItem";
 import Paper from "@material-ui/core/Paper";
 
-import { Selectors as RoomsSelectors } from "store/rooms";
-import { Selectors as ServerSelectors } from "store/server";
+import { RoomsSelectors, ServerSelectors } from "store";
+
+import { AuthenticationService } from "websocket";
+
+import { ThreePaneLayout, UserDisplay, VirtualList } from "components";
+import { ConnectForm, RegisterForm } from "forms";
 import { Room, StatusEnum, User } from "types";
-
-import ThreePaneLayout from "AppShell/common/components/ThreePaneLayout/ThreePaneLayout";
-import UserDisplay from "AppShell/common/components/UserDisplay/UserDisplay";
-import VirtualList from "AppShell/common/components/VirtualList/VirtualList";
-
-import { AuthenticationService } from "AppShell/common/services";
-
-import ConnectForm from "./ConnectForm/ConnectForm";
-import RegisterForm from "./RegisterForm/RegisterForm";
-import Rooms from "./Rooms/Rooms";
+import Rooms from './Rooms';
 
 import "./Server.css";
 

webclient/src/components/ThreePaneLayout/ThreePaneLayout.tsx

@@ -40,8 +40,6 @@ interface ThreePaneLayoutProps {
   fixedHeight?: boolean,
 }
 
-const mapStateToProps = state => ({
-
-});
+const mapStateToProps = state => ({});
 
 export default connect(mapStateToProps)(ThreePaneLayout);

webclient/src/components/UserDisplay/UserDisplay.tsx

@@ -6,10 +6,10 @@ import { NavLink, generatePath } from "react-router-dom";
 import Menu from "@material-ui/core/Menu";
 import MenuItem from "@material-ui/core/MenuItem";
 
-import { SessionService } from "AppShell/common/services";
-import { RouteEnum } from "AppShell/common/types";
+import { SessionService } from "../../websocket";
+import { ServerSelectors } from "../../store";
 
-import { Selectors } from "store/server";
+import { RouteEnum } from "../../types";
 
 import { User } from "types";
 
@@ -146,8 +146,8 @@ interface UserDisplayState {
 }
 
 const mapStateToProps = (state) => ({
-  buddyList: Selectors.getBuddyList(state),
-  ignoreList: Selectors.getIgnoreList(state)
+  buddyList: ServerSelectors.getBuddyList(state),
+  ignoreList: ServerSelectors.getIgnoreList(state)
 });
 
 export default connect(mapStateToProps)(UserDisplay);

webclient/src/components/index.ts

@@ -0,0 +1,25 @@
+
+
+// Common components
+export { default as Header } from './Header/Header';
+export { default as InputField } from './InputField/InputField';
+export { default as InputAction } from './InputAction/InputAction';
+export { default as VirtualList } from './VirtualList/VirtualList';
+export { default as UserDisplay} from './UserDisplay/UserDisplay';
+export { default as ThreePaneLayout }  from './ThreePaneLayout/ThreePaneLayout';
+export { default as CheckboxField } from './CheckboxField/CheckboxField';
+export { default as SelectField } from './SelectField/SelectField';
+export { default as ScrollToBottomOnChanges } from './ScrollToBottomOnChanges/ScrollToBottomOnChanges';
+
+// Major components
+export { default as Game } from './Game/Game';
+export { default as Decks } from './Decks/Decks';
+export { default as Room } from "./Room/Room";
+export { default as Player } from "./Player/Player";
+export { default as Server } from "./Server/Server";
+export { default as Logs } from "./Logs/Logs";
+
+// Guards
+export { default as AuthGuard } from './Guard/AuthGuard';
+export { default as ModGuard} from './Guard/ModGuard';
+

webclient/src/containers/Account/Account.tsx

@@ -6,19 +6,13 @@ import Button from "@material-ui/core/Button";
 import ListItem from "@material-ui/core/ListItem";
 import Paper from "@material-ui/core/Paper";
 
-import UserDisplay from "AppShell/common/components/UserDisplay/UserDisplay";
-import VirtualList from "AppShell/common/components/VirtualList/VirtualList";
-
-import { AuthenticationService, SessionService } from "AppShell/common/services";
-
-import AuthGuard from "AppShell/common/guards/AuthGuard";
-
-import { Selectors } from "store/server";
-
+import { UserDisplay, VirtualList, AuthGuard } from "components";
+import { AuthenticationService, SessionService } from "websocket";
+import { ServerSelectors } from "store";
 import { User } from 'types';
 
-import AddToBuddies from './AddToBuddies/AddToBuddies';
-import AddToIgnore from './AddToIgnore/AddToIgnore';
+import AddToBuddies from './AddToBuddies';
+import AddToIgnore from './AddToIgnore';
 
 import "./Account.css";
 
@@ -112,11 +106,11 @@ interface AccountProps {
 }
 
 const mapStateToProps = state => ({
-  buddyList: Selectors.getBuddyList(state),
-  ignoreList: Selectors.getIgnoreList(state),
-  serverName: Selectors.getName(state),
-  serverVersion: Selectors.getVersion(state),
-  user: Selectors.getUser(state),
+  buddyList: ServerSelectors.getBuddyList(state),
+  ignoreList: ServerSelectors.getIgnoreList(state),
+  serverName: ServerSelectors.getName(state),
+  serverVersion: ServerSelectors.getVersion(state),
+  user: ServerSelectors.getUser(state),
 });
 
 export default connect(mapStateToProps)(Account);

webclient/src/containers/Account/AddToBuddies.tsx

@@ -3,7 +3,7 @@ import React from "react";
 import { connect } from "react-redux";
 import { Form, reduxForm } from "redux-form"
 
-import InputAction from 'AppShell/common/components/InputAction/InputAction';
+import { InputAction } from 'components';
 
 const AddToBuddies = ({ handleSubmit }) => (
   <Form onSubmit={handleSubmit}>

webclient/src/containers/Account/AddToIgnore.tsx

@@ -3,7 +3,7 @@ import React from "react";
 import { connect } from "react-redux";
 import { Form, reduxForm } from "redux-form"
 
-import InputAction from 'AppShell/common/components/InputAction/InputAction';
+import { InputAction } from 'components';
 
 const AddToIgnore = ({ handleSubmit }) => (
   <Form onSubmit={handleSubmit}>

webclient/src/containers/App/AppShell.tsx

@@ -3,13 +3,11 @@ import React, { Component } from "react";
 import { Provider } from "react-redux";
 import { MemoryRouter as Router } from "react-router-dom";
 import CssBaseline from "@material-ui/core/CssBaseline";
-
 import { store } from "store";
+import { Header } from 'components';
+import Routes from "./AppShellRoutes";
 
 import "./AppShell.css";
-import Routes from "./AppShellRoutes";
-import Header from "./Header/Header";
-
 
 class AppShell extends Component {
   componentDidMount() {

webclient/src/containers/App/AppShellRoutes.tsx

@@ -1,15 +1,15 @@
   import React from "react";
 import { Redirect, Route, Switch } from "react-router-dom";
 
-import { RouteEnum } from "./common/types";
-
-import Account from "./Account/Account";
-import Decks from "./Decks/Decks";
-import Game from "./Game/Game";
-import Logs from "./Logs/Logs";
-import Player from "./Player/Player";
-import Room from "./Room/Room";
-import Server from "./Server/Server";
+import { RouteEnum } from "types";
+import { Account } from "containers";
+import { 
+  Decks, 
+  Game, 
+  Player, 
+  Room, 
+  Server, 
+  Logs } from "components";
 
 const Routes = () => (
   <div className="AppShell-routes overflow-scroll">

webclient/src/containers/index.ts

@@ -0,0 +1,2 @@
+export { default as AppShell } from './App/AppShell';
+export { default as Account } from './Account/Account';

webclient/src/forms/ConnectForm/ConnectForm.tsx

@@ -4,8 +4,7 @@ import { connect } from "react-redux";
 import { Form, Field, InjectedFormProps, reduxForm } from "redux-form"
 
 import Button from "@material-ui/core/Button";
-
-import InputField from "AppShell/common/components/InputField/InputField";
+import { InputField } from "../../components";
 
 import "./ConnectForm.css";
 

webclient/src/forms/RegisterForm/RegisterForm.tsx

@@ -5,7 +5,7 @@ import { Form, Field, InjectedFormProps, reduxForm } from 'redux-form'
 
 import Button from '@material-ui/core/Button';
 
-import InputField from 'AppShell/common/components/InputField/InputField';
+import { InputField } from '../../components';
 
 import './RegisterForm.css';
 

webclient/src/forms/SearchForm/SearchForm.tsx

@@ -7,8 +7,7 @@ import Button from "@material-ui/core/Button";
 import Divider from "@material-ui/core/Divider";
 import Paper from "@material-ui/core/Paper";
 
-import InputField from "AppShell/common/components/InputField/InputField";
-import CheckboxField from "AppShell/common/components/CheckboxField/CheckboxField";
+import { InputField, CheckboxField } from "../../components";
 
 import "./SearchForm.css";
 

webclient/src/forms/index.ts

@@ -0,0 +1,4 @@
+
+export { default as ConnectForm } from './ConnectForm/ConnectForm';
+export { default as RegisterForm } from './RegisterForm/RegisterForm';
+export { default as SearchForm } from './SearchForm/SearchForm';

webclient/src/index.tsx

@@ -2,6 +2,6 @@ import React from "react";
 import ReactDOM from "react-dom";
 import "./index.css";
 
-import AppShell from "./AppShell/AppShell";
+import { AppShell } from "containers";
 
 ReactDOM.render(<AppShell />, document.getElementById("root"));

webclient/src/store/common/SortUtil.tsx

@@ -1,6 +1,6 @@
 import { SortBy, SortDirection, User } from "types";
 
-export class SortUtil {
+export default class SortUtil {
   static sortByField(arr:  any[], sortBy: SortBy): void {
     if (arr.length) {
       const field = SortUtil.resolveFieldChain(arr[0], sortBy.field);

webclient/src/store/common/index.ts

@@ -1 +1 @@
-export * from "./SortUtil";
+export { default as SortUtil} from "./SortUtil";

webclient/src/store/index.ts

@@ -1 +1,20 @@
-export * from "./store";
+export { store } from "./store";
+
+// Common
+export { SortUtil } from "./common";
+
+// Server 
+
+export { 
+    Selectors as ServerSelectors,
+    Dispatch as ServerDispatch} from './server';
+
+export * from "store/server/server.interfaces";
+
+export { 
+    Selectors as RoomsSelectors,
+    Dispatch as RoomsDispatch } from 'store/rooms';
+
+export * from "store/rooms/rooms.interfaces";
+
+

webclient/src/store/rooms/index.ts

@@ -1,6 +1,5 @@
 export * from "./rooms.actions";
 export * from "./rooms.dispatch";
-export * from "./rooms.interfaces";
 export * from "./rooms.reducer";
 export * from "./rooms.selectors";
 export * from "./rooms.types";

webclient/src/store/rooms/rooms.dispatch.tsx

@@ -1,6 +1,6 @@
 import { reset } from 'redux-form';
 import { Actions } from "./rooms.actions";
-import { store } from "../store";
+import { store } from "store";
 
 // const history = useHistory();
 

webclient/src/store/server/index.ts

@@ -1,6 +1,5 @@
-export * from "./server.actions";
-export * from "./server.dispatch";
-export * from "./server.interfaces";
+export { Actions } from "./server.actions";
+export { Dispatch } from "./server.dispatch";
 export * from "./server.reducer";
-export * from "./server.selectors";
+export { Selectors } from "./server.selectors";
 export * from "./server.types";

webclient/src/store/server/server.dispatch.ts

@@ -1,6 +1,6 @@
 import { reset } from 'redux-form';
 import { Actions } from "./server.actions";
-import { store } from "../store";
+import { store } from "store";
 
 export const Dispatch = {
   clearStore: () => {

webclient/src/translations/en.json

@@ -0,0 +1,3 @@
+{
+    
+}

webclient/src/types/index.ts

@@ -2,4 +2,6 @@ export * from "./game";
 export * from "./room";
 export * from "./server";
 export * from "./sort";
-export * from "./user";
+export * from "./user";
+export * from "./routes";
+export * from "./sort";

webclient/src/websocket/WebClient.tsx

@@ -6,7 +6,7 @@ import * as roomEvents from "./events/RoomEvents";
 import * as sessionEvents from "./events/SessionEvents";
   
 import { RoomService, SessionService } from "./services";
-import { RoomCommands, SessionCommands } from "./commands";
+import { RoomCommand, SessionCommands } from "./commands";
 
 import ProtoFiles from "./ProtoFiles";
 
@@ -14,7 +14,7 @@ const roomEventKeys = Object.keys(roomEvents);
 const sessionEventKeys = Object.keys(sessionEvents);
 
 interface ApplicationCommands {
-  room: RoomCommands;
+  room: RoomCommand;
   session: SessionCommands;
 }
 
@@ -80,7 +80,7 @@ export class WebClient {
     // This sucks. I can"t seem to get out of this
     // circular dependency trap, so this is my current best.
     this.commands = {
-      room: new RoomCommands(this),
+      room: new RoomCommand(this),
       session: new SessionCommands(this),
     };
 
@@ -208,9 +208,8 @@ export class WebClient {
     this.options = { ...this.options, ...options };
 
     const { host, port } = this.options;
-    const protocol = port === '443' ? 'wss' : 'ws';
 
-    this.socket = new WebSocket(protocol + "://" + host + ":" + port);
+    this.socket = new WebSocket("ws://" + host + ":" + port);
     this.socket.binaryType = "arraybuffer"; // We are talking binary
 
     this.socket.onopen = () => {
@@ -326,4 +325,5 @@ export class WebClient {
 }
 
 const webClient = new WebClient();
+
 export default webClient;

webclient/src/websocket/WebClient/services/RoomService.tsx

@@ -0,0 +1,48 @@
+import { RoomsDispatch, RoomsSelectors, store } from "store";
+import { WebClient } from "../../WebClient";
+import { NormalizeService } from "websocket";
+
+export default class RoomService {
+  webClient: WebClient;
+
+  constructor(webClient) {
+    this.webClient = webClient;
+  }
+
+  clearStore() {
+    RoomsDispatch.clearStore();
+  }
+
+  joinRoom(roomInfo) {
+    NormalizeService.normalizeRoomInfo(roomInfo);
+    RoomsDispatch.joinRoom(roomInfo);
+  }
+
+  updateRooms(rooms) {
+    RoomsDispatch.updateRooms(rooms);
+  }
+
+  updateGames(roomId, gameList) {
+    const game = gameList[0];
+
+    if (!game.gameType) {
+      const { gametypeMap } = RoomsSelectors.getRoom(store.getState(), roomId);
+      NormalizeService.normalizeGameObject(game, gametypeMap);
+    }
+
+    RoomsDispatch.updateGames(roomId, gameList);
+  }
+
+  addMessage(roomId, message) {
+    NormalizeService.normalizeUserMessage(message);
+    RoomsDispatch.addMessage(roomId, message);
+  }
+
+  userJoined(roomId, user) {
+    RoomsDispatch.userJoined(roomId, user);
+  }
+
+  userLeft(roomId, name) {
+    RoomsDispatch.userLeft(roomId, name);
+  }
+}

webclient/src/websocket/WebClient/services/SessionService.tsx

@@ -1,12 +1,11 @@
-import { Dispatch, ServerConnectParams } from "store/server";
+import { ServerDispatch, ServerConnectParams } from "store";
 import { StatusEnum } from "types";
 
-import { sanitizeHtml } from "../util";
-import { WebClient } from "../WebClient";
+import { sanitizeHtml } from "websocket/utils";
+import { WebClient } from "../../WebClient";
+import { NormalizeService } from "websocket";
 
-import { NormalizeService } from "./NormalizeService";
-
-export class SessionService {
+export default class SessionService {
   webClient: WebClient;
 
   constructor(webClient) {
@@ -14,11 +13,11 @@ export class SessionService {
   }
 
   clearStore() {
-    Dispatch.clearStore();
+    ServerDispatch.clearStore();
   }
 
   connectServer(options: ServerConnectParams) {
-    Dispatch.connectServer();
+    ServerDispatch.connectServer();
     this.webClient.updateStatus(StatusEnum.CONNECTING, "Connecting...");
     this.webClient.connect(options);
   }
@@ -29,39 +28,39 @@ export class SessionService {
   }
 
   connectionClosed(reason) {
-    Dispatch.connectionClosed(reason);
+    ServerDispatch.connectionClosed(reason);
   }
 
   updateBuddyList(buddyList) {
-    Dispatch.updateBuddyList(buddyList);
+    ServerDispatch.updateBuddyList(buddyList);
   }
 
   addToBuddyList(user) {
-    Dispatch.addToBuddyList(user);
+    ServerDispatch.addToBuddyList(user);
   }
 
   removeFromBuddyList(userName) {
-    Dispatch.removeFromBuddyList(userName);
+    ServerDispatch.removeFromBuddyList(userName);
   }
 
   updateIgnoreList(ignoreList) {
-    Dispatch.updateIgnoreList(ignoreList);
+    ServerDispatch.updateIgnoreList(ignoreList);
   }
 
   addToIgnoreList(user) {
-    Dispatch.addToIgnoreList(user);
+    ServerDispatch.addToIgnoreList(user);
   }
 
   removeFromIgnoreList(userName) {
-    Dispatch.removeFromIgnoreList(userName);
+    ServerDispatch.removeFromIgnoreList(userName);
   }
 
   updateInfo(name, version) {
-    Dispatch.updateInfo(name, version);
+    ServerDispatch.updateInfo(name, version);
   }
 
   updateStatus(state, description) {
-    Dispatch.updateStatus(state, description);
+    ServerDispatch.updateStatus(state, description);
 
     if (state === StatusEnum.DISCONNECTED) {
       this.connectionClosed({ reason: description });
@@ -69,26 +68,26 @@ export class SessionService {
   }
 
   updateUser(user) {
-    Dispatch.updateUser(user);
+    ServerDispatch.updateUser(user);
   }
 
   updateUsers(users) {
-    Dispatch.updateUsers(users);
+    ServerDispatch.updateUsers(users);
   }
 
   userJoined(user) {
-    Dispatch.userJoined(user);
+    ServerDispatch.userJoined(user);
   }
 
   userLeft(userId) {
-    Dispatch.userLeft(userId);
+    ServerDispatch.userLeft(userId);
   }
 
   viewLogs(logs) {
-    Dispatch.viewLogs(NormalizeService.normalizeLogs(logs));
+    ServerDispatch.viewLogs(NormalizeService.normalizeLogs(logs));
   }
 
   serverMessage(message) {
-    Dispatch.serverMessage(sanitizeHtml(message));
+    ServerDispatch.serverMessage(sanitizeHtml(message));
   }
 }

webclient/src/websocket/commands/RoomCommands.tsx

@@ -2,7 +2,7 @@ import * as _ from 'lodash';
 
 import { WebClient } from "../WebClient"; 
 
-export class RoomCommands {
+export default class RoomCommands {
   private webClient: WebClient;
 
   constructor(webClient) {

webclient/src/websocket/commands/SessionCommands.tsx

@@ -1,9 +1,9 @@
 import { StatusEnum } from "types";
 
 import { WebClient } from "../WebClient"; 
-import { guid } from "../util";
+import { guid } from "../utils";
 
-export class SessionCommands {
+export default class SessionCommands {
   private webClient: WebClient;
 
   constructor(webClient) {

webclient/src/websocket/commands/index.tsx

@@ -0,0 +1,2 @@
+export { default as RoomCommand } from "./RoomCommands";
+export { default as SessionCommands } from "./SessionCommands";

webclient/src/websocket/events/RoomEvents/index.tsx

@@ -0,0 +1,4 @@
+export { JoinRoom } from "./JoinRoom";
+export { LeaveRoom } from "./LeaveRoom";
+export { ListGames } from "./ListGames";
+export { RoomSay } from "./RoomSay";