Enable using commands

web-chat/src/App.tsx

@@ -67,12 +67,28 @@ export default function App() {
     }
   });
 
+  const commandHandler = (cmd: string) => {
+    let commandResponse = 'internal error';
+    switch (cmd) {
+      case '/help':
+        commandResponse = '/help Display this help';
+        break;
+      default:
+        commandResponse = 'Unknown Command'
+    }
+
+    setState(({waku, messages}) => {
+      messages.push(new ChatMessage(new Date(), 'Command Response', commandResponse));
+      return {waku, messages};
+    })
+  }
+
   return (
     <div className='App'>
       <div className='chat-room'>
         <WakuContext.Provider value={{ waku: state.waku }}>
           <Paper>
-            <Room lines={state.messages} />
+            <Room lines={state.messages} commandHandler={commandHandler}/>
           </Paper>
         </WakuContext.Provider>
       </div>

web-chat/src/Room.tsx

@@ -15,6 +15,7 @@ import { useWaku } from './WakuContext';
 
 interface Props {
   lines: ChatMessage[],
+  commandHandler: (cmd: string) => void;
 }
 
 export default function  Room (props :Props)  {
@@ -26,10 +27,14 @@ export default function  Room (props :Props)  {
   }
 
   const sendMessage = async () => {
+    if (messageToSend.startsWith('/')) {
+      props.commandHandler(messageToSend)
+    } else {
       const chatMessage = new ChatMessage(new Date(), 'web-chat', messageToSend);
       const wakuMsg = WakuMessage.fromBytes(chatMessage.encode(), ChatContentTopic);
       await waku!.relay.send(wakuMsg);
     }
+  }
 
     return (
       <Grid container spacing={2}>