Max#mensagens nao lidas

src/Screens/Chat/chat.js

@@ -67,6 +67,7 @@ export default class Conversas extends Component {
             source
           })
         })
+        this.ref.update({ unreadMsgs: false, numUnreadMsgs: 0 })
         this.setState({ messages })
       })
   }
@@ -85,48 +86,100 @@ export default class Conversas extends Component {
     this.setState({ messageText: text, isValueNull: false })
   }
 
-  sendMessage = () => {
-    const { destUser, user } = this.state
-    this.ref.set({
-      userKey: destUser.key
-    })
-    this.refDest.set({
-      userKey: user
-    })
-
-    const { messageText } = this.state
-    if (messageText === "") this.setState({ isValueNull: true })
-    const newMessage = {
-      content: messageText,
-      date: firebase.database().getServerTime(),
-      source: "1"
+  proccessLastMsg = string => {
+    let strProcs = ""
+    if (string.length >= 25) {
+      strProcs = `${string.substr(0, 25)}...`
+    } else {
+      strProcs = string
     }
+    return strProcs
+  }
 
-    this.ref
-      .collection("messages")
-      .add({
-        content: newMessage.content,
-        date: newMessage.date,
-        source: newMessage.source
+  sendMessage = () => {
+    const { destUser, user, messageText } = this.state
+    if (messageText === "") {
+      this.setState({ isValueNull: true })
+    } else {
+      const newMessage = {
+        content: messageText,
+        date: firebase.database().getServerTime(),
+        source: "1"
+      }
+      this.ref.get().then(doc => {
+        if (!doc.exists) {
+          this.ref.set({
+            userKey: destUser.key,
+            unreadMsgs: false,
+            numUnreadMsgs: 0,
+            lastMessage: this.proccessLastMsg(newMessage.content),
+            dateLastMessage: newMessage.date
+          })
+        } else {
+          this.ref.update({
+            lastMessage: this.proccessLastMsg(newMessage.content),
+            dateLastMessage: newMessage.date
+          })
+        }
+      })
+      this.refDest.get().then(doc => {
+        if (!doc.exists) {
+          this.refDest.set({
+            userKey: user,
+            unreadMsgs: false,
+            numUnreadMsgs: 0,
+            lastMessage: "",
+            dateLastMessage: ""
+          })
+          this.refDest.get().then(conversa => {
+            const { numUnreadMsgs } = conversa.data()
+            this.refDest.update({
+              numUnreadMsgs: numUnreadMsgs + 1,
+              unreadMsgs: true
+            })
+          })
+        } else {
+          this.refDest.get().then(conversa => {
+            const { numUnreadMsgs } = conversa.data()
+            this.refDest.update({
+              numUnreadMsgs: numUnreadMsgs + 1,
+              unreadMsgs: true
+            })
+          })
+        }
       })
-      .then(() => true)
-      .catch(error => error)
 
-    const translator = TranslatorFactory.createTranslator()
-    translator.translate(messageText, "en").then(translated => {
-      this.refDest
+      this.ref
         .collection("messages")
         .add({
           content: newMessage.content,
           date: newMessage.date,
-          contentTranslated: translated,
-          source: "2"
+          source: newMessage.source
         })
         .then(() => true)
         .catch(error => error)
-    })
 
-    this.setState({ messageText: "", isValueNull: true })
+      const translator = TranslatorFactory.createTranslator()
+      translator.translate(messageText, "en").then(translated => {
+        this.refDest.update({
+          lastMessage: this.proccessLastMsg(translated),
+          dateLastMessage: newMessage.date
+        })
+
+        this.refDest
+          .collection("messages")
+          .add({
+            content: newMessage.content,
+            date: newMessage.date,
+            contentTranslated: translated,
+            source: "2"
+          })
+          .then(() => true)
+          .catch(error => error)
+      })
+
+      this.setState({ messageText: "", isValueNull: true })
+    }
   }
 
   render() {

src/Screens/Conversas/conversas.js

@@ -14,6 +14,7 @@ import { ListItem, Icon } from "react-native-elements"
 import LinearGradient from "react-native-linear-gradient"
 import firebase from "react-native-firebase"
 import AsyncStorage from "@react-native-community/async-storage"
+import getTime from "~/functions/getTime"
 
 export default class Conversas extends Component {
   constructor() {
@@ -39,7 +40,12 @@ export default class Conversas extends Component {
         myPicture: doc.data().profile_img_url
       })
     })
-    this.getData()
+    this.unsubscribe = firebase
+      .firestore()
+      .collection("users")
+      .onSnapshot(() => {
+        this.getData()
+      })
   }
 
   componentWillUnmount() {
@@ -58,11 +64,21 @@ export default class Conversas extends Component {
         querySnapshot.forEach(doc => {
           contacts.forEach(contact => {
             if (contact.key === doc.id) {
+              const {
+                numUnreadMsgs,
+                unreadMsgs,
+                lastMessage,
+                dateLastMessage
+              } = doc.data()
               conversas.push({
                 contact,
                 key: doc.id,
                 profileImage: contact.profile_img_url,
-                contactName: contact.contactName
+                contactName: contact.contactName,
+                unreadMsgs,
+                numUnreadMsgs,
+                lastMessage,
+                dateLastMessage
               })
             }
           })
@@ -94,17 +110,23 @@ export default class Conversas extends Component {
 
   deleteChat = item => {
     const { conversas } = this.state
-    
+
     conversas.map(conversa => {
-      if(conversa.key === item.key) {
-        this.ref.collection("conversas").doc(item.key).collection("messages")
-        .get()
-        .then(snapshot => {
-          snapshot.docs.forEach(docs => {
-            docs.ref.delete()
+      if (conversa.key === item.key) {
+        this.ref
+          .collection("conversas")
+          .doc(item.key)
+          .collection("messages")
+          .get()
+          .then(snapshot => {
+            snapshot.docs.forEach(docs => {
+              docs.ref.delete()
+            })
           })
-        })
-        this.ref.collection("conversas").doc(item.key).delete()
+        this.ref
+          .collection("conversas")
+          .doc(item.key)
+          .delete()
       }
       return true
     })
@@ -117,6 +139,24 @@ export default class Conversas extends Component {
 
   search = () => {}
 
+  parseTime = dateNanoScds => {
+    const date = dateNanoScds.toDate()
+    const atualDate = firebase.database().getServerTime()
+    let textDate = ""
+    if (atualDate.getDate() - date.getDate() === 0) {
+      textDate = getTime(date)
+    } else if (atualDate.getDate() - date.getDate() === 1) {
+      textDate = "Ontem"
+    } else if (atualDate.getDate() - date.getDate() >= 7) {
+      textDate = `${date
+        .getDate()
+        .toString()}/${date
+        .getMonth()
+        .toString()}/${date.getFullYear().toString()}`
+    }
+    return textDate
+  }
+
   render() {
     const { conversas, myName, myPicture } = this.state
     return (
@@ -153,13 +193,19 @@ export default class Conversas extends Component {
                     <Text style={styles.name}>{item.contactName}</Text>
                     <Text style={styles.lastMsg}>{item.lastMessage}</Text>
                     <View style={styles.rightInformation}>
-                      <Text style={styles.data}>{item.lastMessage}</Text>
-                      <LinearGradient
-                        colors={["#547BF0", "#6AC3FB"]}
-                        style={styles.cont}
-                      >
-                        <Text style={styles.unread}>{item.unread}</Text>
-                      </LinearGradient>
+                      <Text style={styles.data}>
+                        {this.parseTime(item.dateLastMessage)}
+                      </Text>
+                      {item.unreadMsgs && (
+                        <LinearGradient
+                          colors={["#547BF0", "#6AC3FB"]}
+                          style={styles.cont}
+                        >
+                          <Text style={styles.unread}>
+                            {item.numUnreadMsgs}
+                          </Text>
+                        </LinearGradient>
+                      )}
                     </View>
                   </View>
                 }