Merge pull request #453 from jhonnatanBezerra/master

fix bugs vcard

frontend/src/components/MessagesList/index.js

@@ -416,56 +416,56 @@ const MessagesList = ({ ticketId, isGroup }) => {
   };
 
   const checkMessageMedia = (message) => {
-	if(message.mediaType === "location" && message.body.split('|').length >= 2) {
-		let locationParts = message.body.split('|')
-		let imageLocation = locationParts[0]		
-		let linkLocation = locationParts[1]
-		
-		let descriptionLocation = null
-		
-		if(locationParts.length > 2)
-			descriptionLocation = message.body.split('|')[2]
-		
-		return <LocationPreview image={imageLocation} link={linkLocation} description={descriptionLocation} />
-	}
-	else if (message.mediaType === "vcard") {
-		//console.log("vcard")
-		//console.log(message)
-		let array = message.body.split("\n");
-		let obj = [];
-		let contact = "";
-		for (let index = 0; index < array.length; index++) {
-			const v = array[index];
-			let values = v.split(":");
-			for (let ind = 0; ind < values.length; ind++) {
-				if (values[ind].indexOf("+") !== -1) {
-					obj.push({ number: values[ind] });
-				}
-				if (values[ind].indexOf("FN") !== -1) {
-					contact = values[ind + 1];
-				}
-			}
-		}
-		return <VcardPreview contact={contact} numbers={obj[0].number} />
-	} 
-  /*else if (message.mediaType === "multi_vcard") {
-		console.log("multi_vcard")
-		console.log(message)
-		
-		if(message.body !== null && message.body !== "") {
-			let newBody = JSON.parse(message.body)
-			return (
-				<>
-				  {
-					newBody.map(v => (
-					  <VcardPreview contact={v.name} numbers={v.number} />
-					))
-				  }
-				</>
-			)
-		} else return (<></>)
-	}*/
-  else if (message.mediaType === "image") {
+    if (message.mediaType === "location" && message.body.split('|').length >= 2) {
+      let locationParts = message.body.split('|')
+      let imageLocation = locationParts[0]
+      let linkLocation = locationParts[1]
+
+      let descriptionLocation = null
+
+      if (locationParts.length > 2)
+        descriptionLocation = message.body.split('|')[2]
+
+      return <LocationPreview image={imageLocation} link={linkLocation} description={descriptionLocation} />
+    }
+    else if (message.mediaType === "vcard") {
+      //console.log("vcard")
+      //console.log(message)
+      let array = message.body.split("\n");
+      let obj = [];
+      let contact = "";
+      for (let index = 0; index < array.length; index++) {
+        const v = array[index];
+        let values = v.split(":");
+        for (let ind = 0; ind < values.length; ind++) {
+          if (values[ind].indexOf("+") !== -1) {
+            obj.push({ number: values[ind] });
+          }
+          if (values[ind].indexOf("FN") !== -1) {
+            contact = values[ind + 1];
+          }
+        }
+      }
+      return <VcardPreview contact={contact} numbers={obj[0]?.number} />
+    }
+    /*else if (message.mediaType === "multi_vcard") {
+      console.log("multi_vcard")
+      console.log(message)
+    	
+      if(message.body !== null && message.body !== "") {
+        let newBody = JSON.parse(message.body)
+        return (
+          <>
+            {
+            newBody.map(v => (
+              <VcardPreview contact={v.name} numbers={v.number} />
+            ))
+            }
+          </>
+        )
+      } else return (<></>)
+    }*/
+    else if (message.mediaType === "image") {
       return <ModalImageCors imageUrl={message.mediaUrl} />;
     } else if (message.mediaType === "audio") {
       return <Audio url={message.mediaUrl} />
@@ -614,8 +614,8 @@ const MessagesList = ({ ticketId, isGroup }) => {
                     {message.contact?.name}
                   </span>
                 )}
-                {(message.mediaUrl || message.mediaType === "location" || message.mediaType === "vcard" 
-                //|| message.mediaType === "multi_vcard" 
+                {(message.mediaUrl || message.mediaType === "location" || message.mediaType === "vcard"
+                  //|| message.mediaType === "multi_vcard" 
                 ) && checkMessageMedia(message)}
                 <div className={classes.textContentItem}>
                   {message.quotedMsg && renderQuotedMessage(message)}
@@ -643,8 +643,8 @@ const MessagesList = ({ ticketId, isGroup }) => {
                 >
                   <ExpandMore />
                 </IconButton>
-                {(message.mediaUrl || message.mediaType === "location" || message.mediaType === "vcard" 
-                //|| message.mediaType === "multi_vcard" 
+                {(message.mediaUrl || message.mediaType === "location" || message.mediaType === "vcard"
+                  //|| message.mediaType === "multi_vcard" 
                 ) && checkMessageMedia(message)}
                 <div
                   className={clsx(classes.textContentItem, {

frontend/src/components/VcardPreview/index.js

@@ -23,11 +23,12 @@ const VcardPreview = ({ contact, numbers }) => {
 
     useEffect(() => {
         const delayDebounceFn = setTimeout(() => {
-            const fetchContacts = async() => {
+            const fetchContacts = async () => {
                 try {
                     let contactObj = {
                         name: contact,
-                        number: numbers.replace(/\D/g, ""),
+                        // number: numbers.replace(/\D/g, ""),
+                        number: numbers !== undefined && numbers.replace(/\D/g, ""),
                         email: ""
                     }
                     const { data } = await api.post("/contact", contactObj);
@@ -43,7 +44,7 @@ const VcardPreview = ({ contact, numbers }) => {
         return () => clearTimeout(delayDebounceFn);
     }, [contact, numbers]);
 
-    const handleNewChat = async() => {
+    const handleNewChat = async () => {
         try {
             const { data: ticket } = await api.post("/tickets", {
                 contactId: selectedContact.id,
@@ -57,32 +58,32 @@ const VcardPreview = ({ contact, numbers }) => {
     }
 
     return (
-		<>
-			<div style={{
-				minWidth: "250px",
-			}}>
-				<Grid container spacing={1}>
-					<Grid item xs={2}>
-						<Avatar src={selectedContact.profilePicUrl} />
-					</Grid>
-					<Grid item xs={9}>
-						<Typography style={{ marginTop: "12px", marginLeft: "10px" }} variant="subtitle1" color="primary" gutterBottom>
-							{selectedContact.name}
-						</Typography>
-					</Grid>
-					<Grid item xs={12}>
-						<Divider />
-						<Button
-							fullWidth
-							color="primary"
-							onClick={handleNewChat}
-							disabled={!selectedContact.number}
-						>Conversar</Button>
-					</Grid>
-				</Grid>
-			</div>
-		</>
-	);
+        <>
+            <div style={{
+                minWidth: "250px",
+            }}>
+                <Grid container spacing={1}>
+                    <Grid item xs={2}>
+                        <Avatar src={selectedContact.profilePicUrl} />
+                    </Grid>
+                    <Grid item xs={9}>
+                        <Typography style={{ marginTop: "12px", marginLeft: "10px" }} variant="subtitle1" color="primary" gutterBottom>
+                            {selectedContact.name}
+                        </Typography>
+                    </Grid>
+                    <Grid item xs={12}>
+                        <Divider />
+                        <Button
+                            fullWidth
+                            color="primary"
+                            onClick={handleNewChat}
+                            disabled={!selectedContact.number}
+                        >Conversar</Button>
+                    </Grid>
+                </Grid>
+            </div>
+        </>
+    );
 
 };