From f5edd09fa9a3fdf9b4c98d1c0cf590f4faf96956 Mon Sep 17 00:00:00 2001
From: Franck Royer <franck@status.im>
Date: Fri, 23 Apr 2021 14:43:39 +1000
Subject: [PATCH] Implement /nick command

---
 web-chat/src/App.tsx  | 17 ++++++++++++++++-
 web-chat/src/Room.tsx |  3 ++-
 2 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/web-chat/src/App.tsx b/web-chat/src/App.tsx
index a6133afcec..b7ba0ad8a9 100644
--- a/web-chat/src/App.tsx
+++ b/web-chat/src/App.tsx
@@ -15,6 +15,7 @@ export const ChatContentTopic = 'dingpu';
 export default function App() {
   let [stateMessages, setMessages] = useState<ChatMessage[]>([]);
   let [stateWaku, setWaku] = useState<Waku | undefined>(undefined);
+  let [nick, setNick] = useState<string>('web-chat');
 
   useEffect(() => {
     async function initWaku() {
@@ -80,11 +81,21 @@ export default function App() {
     } else {
       switch (cmd) {
         case '/help':
+          commandResponses.push('/nick <nickname>: set a new nickname');
           commandResponses.push(
             '/connect <Multiaddr>: connect to the given peer'
           );
           commandResponses.push('/help: Display this help');
           break;
+        case '/nick':
+          const arg = args.shift();
+          if (!arg) {
+            commandResponses.push('No nick provided');
+          } else {
+            setNick(arg);
+            commandResponses.push(`New nick: ${arg}`);
+          }
+          break;
         case '/connect':
           const peer = args.shift();
           if (!peer) {
@@ -138,7 +149,11 @@ export default function App() {
       <div className="chat-room">
         <WakuContext.Provider value={{ waku: stateWaku }}>
           <Paper>
-            <Room lines={stateMessages} commandHandler={commandHandler} />
+            <Room
+              nick={nick}
+              lines={stateMessages}
+              commandHandler={commandHandler}
+            />
           </Paper>
         </WakuContext.Provider>
       </div>
diff --git a/web-chat/src/Room.tsx b/web-chat/src/Room.tsx
index b1f20a9339..f62dc1613c 100644
--- a/web-chat/src/Room.tsx
+++ b/web-chat/src/Room.tsx
@@ -9,6 +9,7 @@ import { useWaku } from './WakuContext';
 interface Props {
   lines: ChatMessage[];
   commandHandler: (cmd: string) => void;
+  nick: string;
 }
 
 export default function Room(props: Props) {
@@ -25,7 +26,7 @@ export default function Room(props: Props) {
     } else {
       const chatMessage = new ChatMessage(
         new Date(),
-        'web-chat',
+        props.nick,
         messageToSend
       );
       const wakuMsg = WakuMessage.fromBytes(