diff --git a/frontend/src/pages/Dashboard/index.js b/frontend/src/pages/Dashboard/index.js index d31aad6..4300242 100644 --- a/frontend/src/pages/Dashboard/index.js +++ b/frontend/src/pages/Dashboard/index.js @@ -1,11 +1,18 @@ -import React from "react"; +import React, { useContext } from "react" -import Paper from "@material-ui/core/Paper"; -import Container from "@material-ui/core/Container"; -import Grid from "@material-ui/core/Grid"; -import { makeStyles } from "@material-ui/core/styles"; +import Paper from "@material-ui/core/Paper" +import Container from "@material-ui/core/Container" +import Grid from "@material-ui/core/Grid" +import { makeStyles } from "@material-ui/core/styles" +import Typography from "@material-ui/core/Typography"; -import Chart from "./Chart"; +import useTickets from "../../hooks/useTickets" + +import { AuthContext } from "../../context/Auth/AuthContext"; + +import { i18n } from "../../translate/i18n"; + +import Chart from "./Chart" const useStyles = makeStyles(theme => ({ container: { @@ -19,14 +26,80 @@ const useStyles = makeStyles(theme => ({ flexDirection: "column", height: 240, }, -})); + customFixedHeightPaper: { + padding: theme.spacing(2), + display: "flex", + overflow: "auto", + flexDirection: "column", + height: 120, + }, + customFixedHeightPaperLg: { + padding: theme.spacing(2), + display: "flex", + overflow: "auto", + flexDirection: "column", + height: "100%", + }, +})) const Dashboard = () => { - const classes = useStyles(); + const classes = useStyles() + + const { user } = useContext(AuthContext); + + const userQueueIds = user.queues.map(q => q.id); + + const GetTickets = (status, showAll, withUnreadMessages) => { + + const { tickets } = useTickets({ + status: status, + showAll: showAll, + withUnreadMessages: withUnreadMessages, + queueIds: JSON.stringify(userQueueIds) + }); + return tickets.length; + } + return (