✨ Show the connection currently being used

frontend/src/components/TicketListItem/index.js

@@ -99,6 +99,21 @@ const useStyles = makeStyles(theme => ({
 		top: "0%",
 		left: "0%",
 	},
+
+	userTag: {
+		position: "absolute",
+		marginRight: 5,
+		right: 5,
+		bottom: 5,
+		background:"#2576D2",
+		color: "#ffffff",
+		border:"1px solid #CCC",
+		padding: 1,
+		paddingLeft: 5,
+		paddingRight: 5,
+		borderRadius: 10,
+		fontSize: "1em"
+	},
 }));
 
 const TicketListItem = ({ ticket }) => {
@@ -196,6 +211,9 @@ const TicketListItem = ({ ticket }) => {
 									)}
 								</Typography>
 							)}
+							{ticket.whatsappId && (
+								<div className={classes.userTag} title={i18n.t("ticketsList.connectionTitle")}>{ticket.whatsapp.name}</div>
+							)}
 						</span>
 					}
 					secondary={

frontend/src/translate/languages/en.js

@@ -263,6 +263,7 @@ const messages = {
         assignedHeader: "Working on",
         noTicketsTitle: "Nothing here!",
         noTicketsMessage: "No tickets found with this status or search term.",
+        connectionTitle: "Connection that is currently being used.",
         buttons: {
           accept: "Accept",
         },

frontend/src/translate/languages/es.js

@@ -265,6 +265,7 @@ const messages = {
         pendingHeader: "Cola",
         assignedHeader: "Trabajando en",
         noTicketsTitle: "¡Nada acá!",
+        connectionTitle: "Conexión que se está utilizando actualmente.",
         noTicketsMessage:
           "No se encontraron tickets con este estado o término de búsqueda",
         buttons: {

frontend/src/translate/languages/pt.js

@@ -266,6 +266,7 @@ const messages = {
         noTicketsTitle: "Nada aqui!",
         noTicketsMessage:
           "Nenhum ticket encontrado com esse status ou termo pesquisado",
+        connectionTitle: "Conexão que está sendo utilizada atualmente.",
         buttons: {
           accept: "Aceitar",
         },