diff --git a/frontend/src/pages/Dashboard/index.js b/frontend/src/pages/Dashboard/index.js
index 5c56b77..b931f5e 100644
--- a/frontend/src/pages/Dashboard/index.js
+++ b/frontend/src/pages/Dashboard/index.js
@@ -13,12 +13,17 @@ import Avatar from "@mui/material/Avatar";
 import Tooltip from "@mui/material/Tooltip";
 import Zoom from "@mui/material/Zoom";
 import IconButton from "@mui/material/IconButton";
-import Info from "@material-ui/icons/Info";
 import Box from "@mui/material/Box";
 import InputLabel from "@mui/material/InputLabel";
 import MenuItem from "@mui/material/MenuItem";
 import FormControl from "@mui/material/FormControl";
 import Select from "@mui/material/Select";
+import TextField from "@mui/material/TextField";
+import Info from "@material-ui/icons/Info";
+import CancelIcon from "@material-ui/icons/Cancel";
+import CheckCircleIcon from "@material-ui/icons/CheckCircle";
+import ErrorIcon from "@material-ui/icons/Error";
+import RemoveCircleIcon from "@material-ui/icons/RemoveCircle";
 
 import useTickets from "../../hooks/useTickets";
 
@@ -35,6 +40,7 @@ import api from "../../services/api";
 import { Can } from "../../components/Can";
 
 import { Button } from "@material-ui/core";
+import { id } from "date-fns/locale";
 
 const useStyles = makeStyles((theme) => ({
   container: {
@@ -62,6 +68,14 @@ const useStyles = makeStyles((theme) => ({
     flexDirection: "column",
     height: "100%",
   },
+  containerPaperFix: {
+    width: "100%",
+    textTransform: "capitalize",
+    padding: theme.spacing(2),
+    paddingBottom: theme.spacing(4),
+    height: "auto",
+    overflowY: "hidden",
+  },
   cardPaperFix: {
     textTransform: "capitalize",
     padding: theme.spacing(2),
@@ -179,6 +193,7 @@ const reducer = (state, action) => {
 const Dashboard = () => {
   const classes = useStyles();
   const [usersOnlineInfo, dispatch] = useReducer(reducer, []);
+  const [search, setSearch] = useState("");
   const [filterStatus, setFilterStatus] = useState(null);
   const { user } = useContext(AuthContext);
   var userQueueIds = [];
@@ -265,191 +280,328 @@ const Dashboard = () => {
   const handleFilterChange = (event) => {
     setFilterStatus(event.target.value);
   };
+  const handlesearch = (event) => {
+    setSearch(event.target.value.toLowerCase());
+  };
 
   return (
     <Can
       role={user.profile}
       perform="dashboard-view:show"
       yes={() => (
-        <div>
-          <Container maxWidth="lg" className={classes.container}>
-            <Grid container spacing={3}>
-              <Grid item xs={12} sm={6} md={6} lg={4}>
-                <Paper className={classes.customFixedHeightPaper} style={{ overflow: "hidden" }}>
-                  <Typography component="h3" variant="h6" color="primary" paragraph>
-                    {i18n.t("dashboard.messages.inAttendance.title")}
-                  </Typography>
-                  <Grid item>
-                    <Typography component="h1" variant="h4">
-                      {GetTickets("open", "true", "false", "true")}
-                    </Typography>
-                  </Grid>
-                </Paper>
-              </Grid>
-              <Grid item xs={12} sm={6} md={6} lg={4}>
-                <Paper className={classes.customFixedHeightPaper} style={{ overflow: "hidden" }}>
-                  <Typography component="h3" variant="h6" color="primary" paragraph>
-                    {i18n.t("dashboard.messages.waiting.title")}
-                  </Typography>
-                  <Grid item>
-                    <Typography component="h1" variant="h4">
-                      {GetTickets("pending", "true", "false", "true")}
-                    </Typography>
-                  </Grid>
-                </Paper>
-              </Grid>
-              <Grid item xs={12} sm={6} md={6} lg={4}>
-                <Paper className={classes.customFixedHeightPaper} style={{ overflow: "hidden" }}>
-                  <Typography component="h3" variant="h6" color="primary" paragraph>
-                    {i18n.t("dashboard.messages.closed.title")}
-                  </Typography>
-                  <Grid item>
-                    <Typography component="h1" variant="h4">
-                      {GetTickets("closed", "true", "false", "true")}
-                    </Typography>
-                  </Grid>
-                </Paper>
-              </Grid>
-            </Grid>
-          </Container>
-          <Container maxWidth="lg" className={classes.container}>
-            <Paper className={classes.cardPaperFix}>
-              <Grid container justifyContent="space-between">
-                <Grid item>
-                  <Typography
-                    component="h3"
-                    variant="h6"
+        <Container maxWidth="lg" className={classes.container}>
+          <Grid container spacing={3}>
+            <Paper className={classes.containerPaperFix} sx={12}>
+              <Grid item sx={4}>
+                <Typography
+                  component="h1"
+                  variant="h4"
+                  color="primary"
+                  style={{ marginBottom: "16px" }}
+                >
+                  tickets
+                  <Tooltip
+                    title={`Os dados informados abaixo é baseado na data: ${new Date().toLocaleDateString()}`}
                     color="primary"
-                    style={{ marginBottom: "16px" }}
+                    TransitionComponent={Zoom}
                   >
-                    Usuários
-                    <Tooltip
-                      title={`Os dados informados abaixo é baseado na data: ${new Date().toLocaleDateString()}`}
-                      color="primary"
-                      TransitionComponent={Zoom}
-                    >
-                      <IconButton>
-                        <Info />
-                      </IconButton>
-                    </Tooltip>
-                  </Typography>
-                </Grid>
-                <Grid item>
-                  <Box sx={{ minWidth: 120, marginBottom: 2 }}>
-                    <FormControl fullWidth>
-                      <InputLabel id="demo-simple-select-label">Status</InputLabel>
-                      <Select
-                        labelId="demo-simple-select-label"
-                        id="demo-simple-select"
-                        value={filterStatus}
-                        label="Status"
-                        onChange={handleFilterChange}
-                      >
-                        <MenuItem value={null}>-Online/Offline-</MenuItem>
-                        <MenuItem value={"online"}>Online</MenuItem>
-                        <MenuItem value={"offline"}>Offline</MenuItem>
-                        <MenuItem value={"not"}>Não entrou</MenuItem>
-                      </Select>
-                    </FormControl>
-                  </Box>
-                </Grid>
+                    <IconButton>
+                      <Info />
+                    </IconButton>
+                  </Tooltip>
+                </Typography>
               </Grid>
-
               <Grid container spacing={3}>
-                {usersOnlineInfo &&
-                  usersOnlineInfo
-                    .filter((e) => {
-                      if (filterStatus === null) return e;
-                      if (filterStatus === "not") return !e.statusOnline;
-                      return e.statusOnline && e.statusOnline.status === filterStatus;
-                    })
-                    .map((user, index) => (
-                      <Grid
-                        item
-                        xs={12}
-                        sm={6}
-                        md={6}
-                        lg={3}
-                        key={index}
-                        style={{ position: "relative" }}
-                      >
-                        <Card variant="outlined">
-                          <CardHeader
-                            avatar={
-                              <Avatar
-                                sx={
-                                  user.statusOnline && user.statusOnline.status === "online"
-                                    ? { backgroundColor: "green" }
-                                    : { backgroundColor: "red" }
-                                }
-                                aria-label="recipe"
-                              >
-                                {user.name[0].toUpperCase()}
-                              </Avatar>
-                            }
-                            title={
-                              <Typography variant="h5" component="div">
-                                {user.name}
-                              </Typography>
-                            }
-                          />
-
-                          <CardContent>
-                            <Typography variant="h6" component="h1" color="textPrimary">
-                              Em atendimento:
-                              <Typography component="p" color="textPrimary" paragraph>
-                                {user.sumOpen && user.sumOpen.count ? user.sumOpen.count : 0}
-                              </Typography>
-                            </Typography>
-
-                            <Typography variant="h6" component="h1" color="textPrimary">
-                              Finalizado:
-                              <Typography component="p" color="textPrimary" paragraph>
-                                {user.sumClosed && user.sumClosed.count ? user.sumClosed.count : 0}
-                              </Typography>
-                            </Typography>
-
-                            <Typography variant="h6" component="h1" color="textPrimary">
-                              Tempo online:
-                              <Typography component="p" color="textPrimary" paragraph>
-                                {user.sumOnlineTime && user.sumOnlineTime.sum
-                                  ? user.sumOnlineTime.sum
-                                  : "Não entrou Hoje"}
-                              </Typography>
-                            </Typography>
-                          </CardContent>
-                          <CardActions>
-                            {user.statusOnline &&
-                              user.statusOnline.status === "online" &&
-                              user.statusOnline && (
-                                <Button
-                                  className={classes.logginBtn}
-                                  variant="contained"
-                                  color="primary"
-                                  onClick={(e) => {
-                                    handleLogouOnlineUser(user.id);
-                                  }}
-                                >
-                                  {"Deslogar"}
-                                </Button>
-                              )}
-                          </CardActions>
-                        </Card>
-                      </Grid>
-                    ))}
+                <Grid item xs={12} sm={6} md={6} lg={4}>
+                  <Paper
+                    className={classes.customFixedHeightPaper}
+                    style={{ overflow: "hidden" }}
+                    variant="outlined"
+                  >
+                    <Typography component="h3" variant="h6" color="primary" paragraph>
+                      {i18n.t("dashboard.messages.inAttendance.title")}
+                    </Typography>
+                    <Grid item>
+                      <Typography component="h1" variant="h4">
+                        {GetTickets("open", "true", "false", "true")}
+                      </Typography>
+                    </Grid>
+                  </Paper>
+                </Grid>
+                <Grid item xs={12} sm={6} md={6} lg={4}>
+                  <Paper
+                    className={classes.customFixedHeightPaper}
+                    style={{ overflow: "hidden" }}
+                    variant="outlined"
+                  >
+                    <Typography component="h3" variant="h6" color="primary" paragraph>
+                      {i18n.t("dashboard.messages.waiting.title")}
+                    </Typography>
+                    <Grid item>
+                      <Typography component="h1" variant="h4">
+                        {GetTickets("pending", "true", "false", "true")}
+                      </Typography>
+                    </Grid>
+                  </Paper>
+                </Grid>
+                <Grid item xs={12} sm={6} md={6} lg={4}>
+                  <Paper
+                    className={classes.customFixedHeightPaper}
+                    style={{ overflow: "hidden" }}
+                    variant="outlined"
+                  >
+                    <Typography component="h3" variant="h6" color="primary" paragraph>
+                      {i18n.t("dashboard.messages.closed.title")}
+                    </Typography>
+                    <Grid item>
+                      <Typography component="h1" variant="h4">
+                        {GetTickets("closed", "true", "false", "true")}
+                      </Typography>
+                    </Grid>
+                  </Paper>
+                </Grid>
+                <Grid item xs={12}>
+                  <Paper className={classes.fixedHeightPaper} variant="outlined">
+                    <Chart />
+                  </Paper>
+                </Grid>
               </Grid>
             </Paper>
-          </Container>
-          <Container maxWidth="lg" className={classes.container}>
-            <Grid container className={classes.cardStyleFix}>
-              <Grid item xs={12}>
-                <Paper className={classes.fixedHeightPaper}>
-                  <Chart />
-                </Paper>
+            <Paper className={classes.containerPaperFix} style={{ marginTop: "21px" }} sx={12}>
+              <Grid item sx={4}>
+                <Typography
+                  component="h1"
+                  variant="h4"
+                  color="primary"
+                  style={{ marginBottom: "16px" }}
+                >
+                  Usuários
+                  <Tooltip
+                    title={`Os dados informados abaixo é baseado na data: ${new Date().toLocaleDateString()}`}
+                    color="primary"
+                    TransitionComponent={Zoom}
+                  >
+                    <IconButton>
+                      <Info />
+                    </IconButton>
+                  </Tooltip>
+                </Typography>
               </Grid>
-            </Grid>
-          </Container>
-        </div>
+              <Grid container spacing={3}>
+                <Grid item xs={12} sm={6} md={6} lg={4}>
+                  <Paper
+                    className={classes.customFixedHeightPaper}
+                    style={{ overflow: "hidden" }}
+                    variant="outlined"
+                  >
+                    <Typography component="h3" variant="h6" color="primary" paragraph>
+                      Total de Agentes
+                    </Typography>
+                    <Grid item>
+                      <Typography component="h1" variant="h4">
+                        {usersOnlineInfo.length}
+                      </Typography>
+                    </Grid>
+                  </Paper>
+                </Grid>
+                <Grid item xs={12} sm={6} md={6} lg={4}>
+                  <Paper
+                    className={classes.customFixedHeightPaper}
+                    style={{ overflow: "hidden" }}
+                    variant="outlined"
+                  >
+                    <Typography component="h3" variant="h6" color="primary" paragraph>
+                      Online
+                    </Typography>
+                    <Grid item>
+                      <Typography component="h1" variant="h4">
+                        {
+                          usersOnlineInfo.filter(
+                            (status) =>
+                              status.statusOnline && status.statusOnline.status === "online"
+                          ).length
+                        }
+                      </Typography>
+                    </Grid>
+                  </Paper>
+                </Grid>
+                <Grid item xs={12} sm={6} md={6} lg={4}>
+                  <Paper
+                    className={classes.customFixedHeightPaper}
+                    style={{ overflow: "hidden" }}
+                    variant="outlined"
+                  >
+                    <Typography component="h3" variant="h6" color="primary" paragraph>
+                      Offline
+                    </Typography>
+                    <Grid item>
+                      <Typography component="h1" variant="h4">
+                        {
+                          usersOnlineInfo.filter(
+                            (status) =>
+                              !status.statusOnline || status.statusOnline.status === "offline"
+                          ).length
+                        }
+                      </Typography>
+                    </Grid>
+                  </Paper>
+                </Grid>
+                <Grid item xs={12}>
+                  <Paper className={classes.cardPaperFix} sx={12} variant="outlined">
+                    <Grid container sx={12} justifyContent="space-between">
+                      <Grid item sx={4}>
+                        <Typography
+                          component="h4"
+                          variant="h6"
+                          color="primary"
+                          style={{ marginBottom: "16px" }}
+                        >
+                          Lista de Usuários
+                        </Typography>
+                      </Grid>
+                      <Grid item sx={8} width="100%">
+                        <Box sx={{ marginBottom: 2, display: "flex", gap: "12px" }}>
+                          <TextField
+                            id="outlined-basic"
+                            label="Usuário"
+                            variant="standard"
+                            value={search}
+                            onChange={handlesearch}
+                          />
+                          <FormControl fullWidth variant="standard">
+                            <InputLabel id="status">Status</InputLabel>
+                            <Select
+                              labelId="status"
+                              id="status"
+                              value={filterStatus}
+                              label="Status"
+                              onChange={handleFilterChange}
+                            >
+                              <MenuItem value={null}>Todos</MenuItem>
+                              <MenuItem value={"online"}>Online</MenuItem>
+                              <MenuItem value={"offline"}>Offline</MenuItem>
+                              <MenuItem value={"not"}>Não entrou</MenuItem>
+                            </Select>
+                          </FormControl>
+                        </Box>
+                      </Grid>
+                    </Grid>
+
+                    <Grid container spacing={3}>
+                      {usersOnlineInfo &&
+                        usersOnlineInfo
+                          .filter((e) => {
+                            if (filterStatus === null) return e;
+                            if (filterStatus === "not") return !e.statusOnline;
+                            return e.statusOnline && e.statusOnline.status === filterStatus;
+                          })
+                          .filter((e) => {
+                            return e.name.toLowerCase().includes(search);
+                          }).sort((a) => {
+                                if (a.statusOnline) {
+                                  if (a.statusOnline.status === "online") {
+                                    return -1;
+                                  }
+                                  return 0;
+                                }
+                                return 0;
+                              })
+                          .map((user, index) => (
+                            <Grid
+                              item
+                              xs={12}
+                              sm={6}
+                              md={6}
+                              lg={3}
+                              key={index}
+                              style={{ position: "relative" }}
+                            >
+                              <Card variant="outlined">
+                                <CardHeader
+                                  avatar={
+                                    <Avatar
+                                      style={{
+                                        backgroundColor: user.statusOnline
+                                          ? user.statusOnline.status === "online"
+                                            ? "green"
+                                            : user.statusOnline.status === "offline"
+                                            ? "red"
+                                            : "black"
+                                          : "grey",
+                                      }}
+                                    >
+                                      {user.statusOnline ? (
+                                        user.statusOnline.status === "online" ? (
+                                          <CheckCircleIcon style={{ color: "white" }} />
+                                        ) : user.statusOnline.status === "offline" ? (
+                                          <CancelIcon style={{ color: "white" }} />
+                                        ) : (
+                                          <ErrorIcon style={{ color: "yellow" }} />
+                                        )
+                                      ) : (
+                                        <RemoveCircleIcon style={{ color: "black" }} />
+                                      )}
+                                    </Avatar>
+                                  }
+                                  title={
+                                    <Typography variant="h5" component="div">
+                                      {user.name}
+                                    </Typography>
+                                  }
+                                />
+
+                                <CardContent>
+                                  <Typography variant="h6" component="h1" color="textPrimary">
+                                    Em atendimento:
+                                    <Typography component="p" color="textPrimary" paragraph>
+                                      {user.sumOpen && user.sumOpen.count ? user.sumOpen.count : 0}
+                                    </Typography>
+                                  </Typography>
+
+                                  <Typography variant="h6" component="h1" color="textPrimary">
+                                    Finalizado:
+                                    <Typography component="p" color="textPrimary" paragraph>
+                                      {user.sumClosed && user.sumClosed.count
+                                        ? user.sumClosed.count
+                                        : 0}
+                                    </Typography>
+                                  </Typography>
+
+                                  <Typography variant="h6" component="h1" color="textPrimary">
+                                    Tempo online:
+                                    <Typography component="p" color="textPrimary" paragraph>
+                                      {user.sumOnlineTime && user.sumOnlineTime.sum
+                                        ? user.sumOnlineTime.sum
+                                        : "Não entrou Hoje"}
+                                    </Typography>
+                                  </Typography>
+                                </CardContent>
+                                <CardActions>
+                                  {user.statusOnline &&
+                                    user.statusOnline.status === "online" &&
+                                    user.statusOnline && (
+                                      <Button
+                                        className={classes.logginBtn}
+                                        variant="contained"
+                                        color="primary"
+                                        onClick={(e) => {
+                                          handleLogouOnlineUser(user.id);
+                                        }}
+                                      >
+                                        {"Deslogar"}
+                                      </Button>
+                                    )}
+                                </CardActions>
+                              </Card>
+                            </Grid>
+                          ))}
+                    </Grid>
+                  </Paper>
+                </Grid>
+              </Grid>
+            </Paper>
+          </Grid>
+        </Container>
       )}
     />