diff --git a/frontend/src/components/TicketsList/index.js b/frontend/src/components/TicketsList/index.js
index e8b4823..0bf015a 100644
--- a/frontend/src/components/TicketsList/index.js
+++ b/frontend/src/components/TicketsList/index.js
@@ -55,6 +55,11 @@ const useStyles = makeStyles(theme => ({
padding: 8,
},
+ tab: {
+ minWidth: 120, // a number of your choice
+ width: 120, // a number of your choice
+ },
+
openTicketsList: {
height: "50%",
overflowY: "scroll",
@@ -172,10 +177,17 @@ const useStyles = makeStyles(theme => ({
contactNameWrapper: {
display: "flex",
- // display: "inline",
+ justifyContent: "space-between",
},
lastMessageTime: {
+ justifySelf: "flex-end",
+ },
+
+ closedBadge: {
+ alignSelf: "center",
+ justifySelf: "flex-end",
+ marginRight: 32,
marginLeft: "auto",
},
@@ -204,6 +216,21 @@ const useStyles = makeStyles(theme => ({
},
}));
+const TabPanel = ({ children, value, index, ...rest }) => {
+ if (value === index) {
+ return (
+
+ <>{children}>
+
+ );
+ } else return null;
+};
+
const TicketsList = () => {
const classes = useStyles();
const history = useHistory();
@@ -356,7 +383,12 @@ const TicketsList = () => {
};
const handleSearchContact = e => {
+ if (e.target.value === "") {
+ setTab("open");
+ return;
+ }
setSearchParam(e.target.value.toLowerCase());
+ setTab("search");
};
const handleChangeTab = (event, newValue) => {
@@ -391,7 +423,8 @@ const TicketsList = () => {
if (
(ticket.status === status && ticket.userId === userId) ||
(ticket.status === status && showAllTickets) ||
- (ticket.status === "closed" && status === "closed")
+ (ticket.status === "closed" && status === "closed") ||
+ searchParam
)
return (
@@ -423,6 +456,13 @@ const TicketsList = () => {
>
{ticket.contact.name}
+ {ticket.status === "closed" && (
+
+ )}
{ticket.lastMessage && (
{
>
{ticket.lastMessage ||
}
+
{
if (loading) {
return ;
- } else if (countTickets(status, userId) === "" && status !== "closed") {
- return (
-
-
- {status === "pending" ? "Tudo resolvido" : "Pronto pra mais?"}
-
-
- {status === "pending"
- ? "Nenhum ticket pendente por enquanto. Hora do café!"
- : "Aceite um ticket da fila para começar."}
-
-
- );
- } else {
+ }
+
+ // else if (countTickets(status, userId) === "" && status !== "closed") {
+ // return (
+ //
+ //
+ // {status === "pending" ? "Tudo resolvido" : "Pronto pra mais?"}
+ //
+ //
+ // {status === "pending"
+ // ? "Nenhum ticket pendente por enquanto. Hora do café!"
+ // : "Aceite um ticket da fila para começar."}
+ //
+ //
+ // );
+ // }
+ else {
return viewTickets;
}
};
@@ -510,14 +554,22 @@ const TicketsList = () => {
aria-label="icon label tabs example"
>
}
- label="Caixa de Entrada"
+ label="Inbox"
+ classes={{ root: classes.tab }}
/>
}
label="Resolvidos"
+ classes={{ root: classes.tab }}
+ />
+ }
+ label="Busca"
+ classes={{ root: classes.tab }}
/>
@@ -532,60 +584,70 @@ const TicketsList = () => {
/>
- {tab === "open" ? (
- <>
-
-
-
- Atendendo
-
- {countTickets("open", userId)}
-
-
-
- setShowAllTickets(prevState => !prevState)
- }
- name="showAllTickets"
- color="primary"
- />
- }
- />
- setNewTicketModalOpen(true)}
- style={{ marginLeft: 20 }}
- >
-
-
-
+
+
+
+
+ Atendendo
+
+ {countTickets("open", userId)}
+
+
+
setShowAllTickets(prevState => !prevState)}
+ name="showAllTickets"
+ color="primary"
+ />
+ }
+ />
+ setNewTicketModalOpen(true)}
+ style={{ marginLeft: 20 }}
+ >
+
+
- {renderTickets("open", userId)}
-
-
-
-
-
- Aguardando
-
- {countTickets("pending", null)}
-
-
- {renderTickets("pending", null)}
-
-
- >
- ) : (
+
+ {renderTickets("open", userId)}
+
+
+
+
+
+ Aguardando
+
+ {countTickets("pending", null)}
+
+
+ {renderTickets("pending", null)}
+
+
+
+
{renderTickets("closed", userId)}
- )}
+
+
+
+ {renderTickets()}
+
+