Melhoria no carregamento dos Tickets

rtenorioh · Nov 30, 2024 · 1b2d352 · 1b2d352
1 parent c1d0fb5
commit 1b2d352
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 49 deletions.
diff --git a/backend/src/services/TicketServices/ListTicketsService.ts b/backend/src/services/TicketServices/ListTicketsService.ts
@@ -1,10 +1,10 @@
 import { endOfDay, parseISO, startOfDay } from "date-fns";
 import { col, Filterable, fn, Includeable, Op, where } from "sequelize";
-
 import Contact from "../../models/Contact";
 import Message from "../../models/Message";
 import Queue from "../../models/Queue";
 import Ticket from "../../models/Ticket";
+import User from "../../models/User";
 import Whatsapp from "../../models/Whatsapp";
 import ListSettingsServiceOne from "../SettingServices/ListSettingsServiceOne";
 import ShowUserService from "../UserServices/ShowUserService";
@@ -67,7 +67,12 @@ const ListTicketsService = async ({
     {
       model: Whatsapp,
       as: "whatsapp",
-      attributes: ["name", "type", "color"]
+      attributes: ["id", "name", "type", "color"]
+    },
+    {
+      model: User,
+      as: "user",
+      attributes: ["id", "name"]
     }
   ];
 
@@ -144,7 +149,7 @@ const ListTicketsService = async ({
     };
   }
 
-  const limit = 100;
+  const limit = 20;
   const offset = limit * (+pageNumber - 1);
 
   const listSettingsService = await ListSettingsServiceOne({ key: "ASC" });

diff --git a/frontend/src/components/TicketListItem/index.js b/frontend/src/components/TicketListItem/index.js
@@ -1,16 +1,3 @@
-import React, { useContext, useEffect, useRef, useState } from "react";
-
-import {
-	useHistory,
-	useParams
-} from "react-router-dom";
-
-import {
-	format,
-	isSameDay,
-	parseISO
-} from "date-fns";
-
 import {
 	Avatar,
 	Badge,
@@ -24,7 +11,7 @@ import {
 	Tooltip,
 	Typography
 } from "@material-ui/core";
-
+import { green } from "@material-ui/core/colors";
 import {
 	ClearOutlined,
 	Done,
@@ -37,20 +24,26 @@ import {
 	Visibility,
 	WhatsApp
 } from "@material-ui/icons";
-
-import { green } from "@material-ui/core/colors";
-
-import AcceptTicketWithouSelectQueue from "../AcceptTicketWithoutQueueModal";
-import ContactTag from "../ContactTag";
-import MarkdownWrapper from "../MarkdownWrapper";
-
 import clsx from "clsx";
+import {
+	format,
+	isSameDay,
+	parseISO
+} from "date-fns";
+import React, { useContext, useEffect, useRef, useState } from "react";
+import {
+	useHistory,
+	useParams
+} from "react-router-dom";
 import receiveIcon from "../../assets/receive.png";
 import sendIcon from "../../assets/send.png";
 import { AuthContext } from "../../context/Auth/AuthContext";
 import toastError from "../../errors/toastError";
 import api from "../../services/api";
 import { i18n } from "../../translate/i18n";
+import AcceptTicketWithouSelectQueue from "../AcceptTicketWithoutQueueModal";
+import ContactTag from "../ContactTag";
+import MarkdownWrapper from "../MarkdownWrapper";
 
 const useStyles = makeStyles(theme => ({
 	ticket: {
@@ -176,7 +169,6 @@ const useStyles = makeStyles(theme => ({
 	secondaryContentSecond: {
 		display: 'flex',
 		marginTop: 2,
-		//marginLeft: "5px",
 		alignItems: "flex-start",
 		flexWrap: "wrap",
 		flexDirection: "row",
@@ -200,7 +192,6 @@ const TicketListItem = ({ ticket, userId, filteredTags }) => {
 	const { user } = useContext(AuthContext);
 	const [acceptTicketWithouSelectQueueOpen, setAcceptTicketWithouSelectQueueOpen] = useState(false);
 	const [tag, setTag] = useState([]);
-	const [uName, setUserName] = useState(null);
 
 	useEffect(() => {
 		isMounted.current = true;
@@ -262,7 +253,6 @@ const TicketListItem = ({ ticket, userId, filteredTags }) => {
 		}
 	};
 
-
 	const queueName = selectedTicket => {
 		let name = null;
 		let color = null;
@@ -336,25 +326,6 @@ const TicketListItem = ({ ticket, userId, filteredTags }) => {
 		history.push(`/tickets/${id}`);
 	};
 
-	if (ticket.status === "pending") {
-
-	} else {
-		const fetchUserName = async () => {
-			if (!isMounted.current) return;
-			try {
-				const { data } = await api.get("/users/" + ticket.userId, {});
-				if (isMounted.current) {
-					setUserName(data['name']);
-				}
-			} catch (err) {
-				if (isMounted.current) {
-					toastError(err);
-				}
-			}
-		};
-		fetchUserName();
-	}
-
 	return (
 		<React.Fragment key={ticket.id}>
 			<AcceptTicketWithouSelectQueue
@@ -541,8 +512,7 @@ const TicketListItem = ({ ticket, userId, filteredTags }) => {
 									/>
 								</Tooltip>
 							)}
-
-							{uName && (
+							{ticket.status !== "pending" && ticket?.user?.name && (
 								<Tooltip title={i18n.t("ticketsList.items.user")}>
 									<Chip
 										className={classes.Radiusdot}
@@ -558,7 +528,7 @@ const TicketListItem = ({ ticket, userId, filteredTags }) => {
 											marginRight: "5px",
 											marginBottom: "3px",
 										}}
-										label={uName.toUpperCase()}
+										label={ticket?.user?.name.toUpperCase()}
 									/>
 								</Tooltip>
 							)}