mirror of
https://github.com/cheveguerra/whaticket-community.git
synced 2026-04-18 19:59:20 +00:00
improvement: remove tickets logic from useTickets to improve notifications
This commit is contained in:
@@ -1,80 +1,8 @@
|
||||
import { useState, useEffect, useReducer } from "react";
|
||||
import openSocket from "socket.io-client";
|
||||
import { useState, useEffect } from "react";
|
||||
import { toast } from "react-toastify";
|
||||
|
||||
import api from "../../services/api";
|
||||
|
||||
const reducer = (state, action) => {
|
||||
if (action.type === "LOAD_TICKETS") {
|
||||
const newTickets = action.payload;
|
||||
|
||||
newTickets.forEach(ticket => {
|
||||
const ticketIndex = state.findIndex(t => t.id === ticket.id);
|
||||
if (ticketIndex !== -1) {
|
||||
state[ticketIndex] = ticket;
|
||||
if (ticket.unreadMessages > 0) {
|
||||
state.unshift(state.splice(ticketIndex, 1)[0]);
|
||||
}
|
||||
} else {
|
||||
state.push(ticket);
|
||||
}
|
||||
});
|
||||
|
||||
return [...state];
|
||||
}
|
||||
|
||||
if (action.type === "UPDATE_TICKETS") {
|
||||
const { ticket, status, loggedUser, withUnreadMessages } = action.payload;
|
||||
|
||||
const ticketIndex = state.findIndex(t => t.id === ticket.id);
|
||||
if (ticketIndex !== -1) {
|
||||
if (ticket.status !== state[ticketIndex].status) {
|
||||
state.splice(ticketIndex, 1);
|
||||
} else {
|
||||
state[ticketIndex] = ticket;
|
||||
state.unshift(state.splice(ticketIndex, 1)[0]);
|
||||
}
|
||||
} else if (
|
||||
ticket.status === status &&
|
||||
(ticket.userId === loggedUser ||
|
||||
!ticket.userId ||
|
||||
ticket.status === "closed")
|
||||
) {
|
||||
state.unshift(ticket);
|
||||
} else if (withUnreadMessages) {
|
||||
state.unshift(ticket);
|
||||
}
|
||||
return [...state];
|
||||
}
|
||||
|
||||
if (action.type === "DELETE_TICKET") {
|
||||
const ticketId = action.payload;
|
||||
|
||||
const ticketIndex = state.findIndex(t => t.id === ticketId);
|
||||
if (ticketIndex !== -1) {
|
||||
state.splice(ticketIndex, 1);
|
||||
}
|
||||
return [...state];
|
||||
}
|
||||
|
||||
if (action.type === "RESET_UNREAD") {
|
||||
const { ticketId, withUnreadMessages } = action.payload;
|
||||
|
||||
const ticketIndex = state.findIndex(t => t.id === ticketId);
|
||||
if (ticketIndex !== -1) {
|
||||
state[ticketIndex].unreadMessages = 0;
|
||||
if (withUnreadMessages) {
|
||||
state.splice(ticketIndex, 1);
|
||||
}
|
||||
}
|
||||
return [...state];
|
||||
}
|
||||
|
||||
if (action.type === "RESET") {
|
||||
return [];
|
||||
}
|
||||
};
|
||||
|
||||
const useTickets = ({
|
||||
searchParam,
|
||||
pageNumber,
|
||||
@@ -83,10 +11,9 @@ const useTickets = ({
|
||||
showAll,
|
||||
withUnreadMessages,
|
||||
}) => {
|
||||
const userId = +localStorage.getItem("userId");
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [hasMore, setHasMore] = useState(false);
|
||||
const [tickets, dispatch] = useReducer(reducer, []);
|
||||
const [tickets, setTickets] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
setLoading(true);
|
||||
@@ -103,10 +30,7 @@ const useTickets = ({
|
||||
withUnreadMessages,
|
||||
},
|
||||
});
|
||||
dispatch({
|
||||
type: "LOAD_TICKETS",
|
||||
payload: data.tickets,
|
||||
});
|
||||
setTickets(data.tickets);
|
||||
setHasMore(data.hasMore);
|
||||
setLoading(false);
|
||||
} catch (err) {
|
||||
@@ -121,57 +45,7 @@ const useTickets = ({
|
||||
return () => clearTimeout(delayDebounceFn);
|
||||
}, [searchParam, pageNumber, status, date, showAll, withUnreadMessages]);
|
||||
|
||||
useEffect(() => {
|
||||
const socket = openSocket(process.env.REACT_APP_BACKEND_URL);
|
||||
socket.emit("joinNotification");
|
||||
|
||||
socket.on("ticket", data => {
|
||||
if (data.action === "updateUnread") {
|
||||
dispatch({
|
||||
type: "RESET_UNREAD",
|
||||
payload: {
|
||||
ticketId: data.ticketId,
|
||||
withUnreadMessages: withUnreadMessages,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
if (data.action === "updateStatus" || data.action === "create") {
|
||||
dispatch({
|
||||
type: "UPDATE_TICKETS",
|
||||
payload: {
|
||||
ticket: data.ticket,
|
||||
status: status,
|
||||
loggedUser: userId,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
if (data.action === "delete") {
|
||||
dispatch({ type: "DELETE_TICKET", payload: data.ticketId });
|
||||
}
|
||||
});
|
||||
|
||||
socket.on("appMessage", data => {
|
||||
if (data.action === "create") {
|
||||
dispatch({
|
||||
type: "UPDATE_TICKETS",
|
||||
payload: {
|
||||
ticket: data.ticket,
|
||||
status: status,
|
||||
withUnreadMessages: withUnreadMessages,
|
||||
loggedUser: userId,
|
||||
},
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
return () => {
|
||||
socket.disconnect();
|
||||
};
|
||||
}, [status, withUnreadMessages, userId]);
|
||||
|
||||
return { loading, tickets, hasMore, dispatch };
|
||||
return { tickets, loading, hasMore };
|
||||
};
|
||||
|
||||
export default useTickets;
|
||||
|
||||
Reference in New Issue
Block a user