improvement: remove tickets logic from useTickets to improve notifications

This commit is contained in:
canove
2020-09-25 18:53:14 -03:00
parent c7d3807219
commit 5396837db4
10 changed files with 190 additions and 163 deletions

View File

@@ -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;