Add vuex actions/getters for chat messages

src/store/network/actions.ts

@@ -1,7 +1,14 @@
 import { ActionTree } from "vuex";
 import { AppState } from "../types";
 import { NetworkState, StartServerOptions, ConnectOptions } from "./types";
-import { PeerServer, LocalClient, PeerClient } from "@/network";
+import {
+  PeerServer,
+  LocalClient,
+  PeerClient,
+  NetworkMessage,
+  Client,
+  ChatMessage
+} from "@/network";
 
 const actions: ActionTree<NetworkState, AppState> = {
   startServer({ commit }, options: StartServerOptions) {
@@ -23,6 +30,21 @@ const actions: ActionTree<NetworkState, AppState> = {
       commit("connectionError", err);
     });
     client.connect(options.serverID);
+  },
+
+  sendChatMessage({ commit, dispatch, getters }, message: ChatMessage) {
+    if (getters.connectionType == "none") {
+      throw new Error("not connected");
+    }
+    dispatch("sendMessage", message);
+    commit("receivedChatMessage", message);
+  },
+
+  sendMessage({ getters }, message: NetworkMessage) {
+    if (getters.connectionType == "none") {
+      throw new Error("not connected");
+    }
+    (getters.client as Client).send(message);
   }
 };
 

src/store/network/getters.ts

@@ -1,6 +1,7 @@
 import { GetterTree } from "vuex";
 import { AppState } from "../types";
 import { NetworkState } from "./types";
+import { Client } from "@/network";
 
 const getters: GetterTree<NetworkState, AppState> = {
   peerID(state): string | null {
@@ -23,6 +24,16 @@ const getters: GetterTree<NetworkState, AppState> = {
     return null;
   },
 
+  client(state): Client | null {
+    switch (state.peerType) {
+      case "server":
+        return state.local;
+      case "client":
+        return state.peer;
+    }
+    return null;
+  },
+
   connectionType(state): "client" | "server" | "none" {
     return state.peerType;
   },

src/store/network/mutations.ts

@@ -5,7 +5,7 @@ import {
   ClientNetworkState,
   ConnectionStatus
 } from "./types";
-import { LocalClient, PeerServer, PeerClient } from "@/network";
+import { LocalClient, PeerServer, PeerClient, ChatMessage } from "@/network";
 
 const mutations: MutationTree<NetworkState> = {
   becomeServer(state, payload: { local: LocalClient; server: PeerServer }) {
@@ -28,6 +28,10 @@ const mutations: MutationTree<NetworkState> = {
   connectionError(state, error) {
     (state as ClientNetworkState).connectionStatus = "error";
     (state as ClientNetworkState).connectionError = error;
+  },
+
+  receivedChatMessage(state, message: ChatMessage) {
+    state.chatLog.push(message);
   }
 };
 

src/store/network/types.ts

@@ -3,7 +3,8 @@ import {
   PeerServer,
   LocalClient,
   RoomInfo,
-  PeerMetadata
+  PeerMetadata,
+  ChatMessage
 } from "@/network";
 import Peer from "peerjs";
 
@@ -13,12 +14,6 @@ export type ConnectionStatus =
   | "disconnected"
   | "error";
 
-export interface ChatMessage {
-  who: string;
-  to: string;
-  message: string;
-}
-
 export interface SharedNetworkState {
   chatLog: ChatMessage[];
 }