Apresentar a separação dos tickets na conversa

rtenorioh · Jun 8, 2022 · 9392361 · 9392361
1 parent 9b80e09
commit 9392361
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 1 deletion.
diff --git a/backend/src/services/MessageServices/ListMessagesService.ts b/backend/src/services/MessageServices/ListMessagesService.ts
@@ -30,14 +30,20 @@ const ListMessagesService = async ({
   const offset = limit * (+pageNumber - 1);
 
   const { count, rows: messages } = await Message.findAndCountAll({
-    where: { ticketId },
+    //where: { ticketId },
+    //where: {contactid : ticket.contactId},
     limit,
     include: [
       "contact",
       {
         model: Message,
         as: "quotedMsg",
         include: ["contact"]
+      },
+      {
+        model: Ticket,
+        where: {contactId: ticket.contactId  },
+        required: true
       }
     ],
     offset,

diff --git a/frontend/src/components/MessagesList/index.js b/frontend/src/components/MessagesList/index.js
@@ -39,6 +39,11 @@ const useStyles = makeStyles((theme) => ({
     flexGrow: 1,
   },
 
+  ticketNumber: {
+    color: theme.palette.secondary.main,
+    padding: 8,
+  },
+
   messagesList: {
     backgroundImage: theme.backgroundImage,
     display: "flex",
@@ -576,6 +581,22 @@ const MessagesList = ({ ticketId, isGroup }) => {
     }
   };
 
+  const renderNumberTicket = (message, index) => {
+    if (index < messagesList.length && index > 0) {
+      let messageTicket = message.ticketId;
+      let previousMessageTicket = messagesList[index - 1].ticketId;
+
+      if (messageTicket !== previousMessageTicket) {
+        return (
+          <div key={`ticket-${message.id}`} className={classes.ticketNumber}>
+            #ticket: {messageTicket}
+            <hr />
+          </div>
+        );
+      }
+    }
+  };
+
   const renderMessageDivider = (message, index) => {
     if (index < messagesList.length && index > 0) {
       let messageUser = messagesList[index].fromMe;
@@ -621,6 +642,7 @@ const MessagesList = ({ ticketId, isGroup }) => {
             <React.Fragment key={message.id}>
               {renderDailyTimestamps(message, index)}
               {renderMessageDivider(message, index)}
+              {renderNumberTicket(message, index)}
               <div className={classes.messageCenter}>
                 <IconButton
                   variant="contained"
@@ -651,6 +673,7 @@ const MessagesList = ({ ticketId, isGroup }) => {
             <React.Fragment key={message.id}>
               {renderDailyTimestamps(message, index)}
               {renderMessageDivider(message, index)}
+              {renderNumberTicket(message, index)}
               <div className={classes.messageLeft}>
                 <IconButton
                   variant="contained"
@@ -685,6 +708,7 @@ const MessagesList = ({ ticketId, isGroup }) => {
             <React.Fragment key={message.id}>
               {renderDailyTimestamps(message, index)}
               {renderMessageDivider(message, index)}
+              {renderNumberTicket(message, index)}
               <div className={classes.messageRight}>
                 <IconButton
                   variant="contained"