Merge pull request #59 from Reckless-Satoshi/chatbox-fixes

Chatbox fixes. Well tested in robodevs.onion and in robotest.onion platforms. 
Already up in mainnet.

chat/consumers.py

@@ -49,16 +49,8 @@ class ChatRoomConsumer(AsyncWebsocketConsumer):
         message = event["message"]
         nick = event["nick"]
 
-        # Insert a white space in words longer than 22 characters.
-        # Helps when messages overflow in a single line.
-        words = message.split(" ")
-        fix_message = ""
-        for word in words:
-            word = " ".join(word[i:i + 22] for i in range(0, len(word), 22))
-            fix_message = fix_message + " " + word
-
         await self.send(text_data=json.dumps({
-            "message": fix_message,
+            "message": message,
             "user_nick": nick,
         }))
 

docker-compose.yml

@@ -37,6 +37,7 @@ services:
     command: python3 manage.py clean_orders
     volumes:
       - .:/usr/src/robosats
+      - /mnt/development/lnd:/lnd
     network_mode: service:tor
 
   follow-invoices:
@@ -71,7 +72,6 @@ services:
       REDIS_URL: redis://localhost:6379
     volumes:
       - .:/usr/src/robosats
-      - /mnt/development/database:/usr/src/database
     network_mode: service:tor
 
   tor:

frontend/src/components/Chat.js

@@ -48,12 +48,14 @@ export default class Chat extends Component {
   }
 
   onButtonClicked = (e) => {
-    this.client.send(JSON.stringify({
+    if(this.state.value!=''){
-      type: "message",
+      this.client.send(JSON.stringify({
-      message: this.state.value,
+        type: "message",
-      nick: this.props.ur_nick,
+        message: this.state.value,
-    }));
+        nick: this.props.ur_nick,
-    this.state.value = ''
+      }));
+      this.state.value = ''
+    }
     e.preventDefault();
   }
 
@@ -65,7 +67,7 @@ export default class Chat extends Component {
               <Card elevation={5} align="left" >
               {/* If message sender is not our nick, gray color, if it is our nick, green color */}
               {message.userNick == this.props.ur_nick ? 
-                  <CardHeader
+                <CardHeader
                   avatar={
                     <Avatar
                       alt={message.userNick}
@@ -75,19 +77,21 @@ export default class Chat extends Component {
                   style={{backgroundColor: '#e8ffe6'}}
                   title={message.userNick}
                   subheader={message.msg}
+                  subheaderTypographyProps={{sx: {wordWrap: "break-word", width: 200}}}
                 />
                 :
                 <CardHeader
-                        avatar={
+                  avatar={
-                          <Avatar
+                    <Avatar
-                            alt={message.userNick}
+                      alt={message.userNick}
-                            src={window.location.origin +'/static/assets/avatars/' + message.userNick + '.png'} 
+                      src={window.location.origin +'/static/assets/avatars/' + message.userNick + '.png'} 
-                            />
+                      />
-                        }
+                  }
-                        style={{backgroundColor: '#fcfcfc'}}
+                  style={{backgroundColor: '#fcfcfc'}}
-                        title={message.userNick}
+                  title={message.userNick}
-                        subheader={message.msg}
+                  subheader={message.msg}
-                      />} 
+                  subheaderTypographyProps={{sx: {wordWrap: "break-word", width: 200}}}
+                />} 
                 </Card>
               </>)}
               <div style={{ float:"left", clear: "both" }} ref={(el) => { this.messagesEnd = el; }}></div>
@@ -111,7 +115,9 @@ export default class Chat extends Component {
                 </Grid>
               </Grid>
             </form>
-            <FormHelperText>This chat has no memory. If you leave and come back the messages are lost.</FormHelperText>
+            <FormHelperText>
+              The chat has no memory: if you leave, messages are lost. <a target="_blank" href="https://diverter.hostyourown.tools/as-easy-as-pgp/"> Learn easy PGP encryption.</a>
+            </FormHelperText>
       </Container>
     )
   }