Criação de nova rule para que somente o administrador acesse as configurações(settings)

pull/1/head
adriano 2022-01-10 20:26:13 -03:00
parent 723f094e5e
commit 78074b0d09
2 changed files with 121 additions and 104 deletions

View File

@ -1,4 +1,4 @@
import React, { useState, useEffect, useReducer } from "react";
import React, { useState, useEffect, useReducer, useContext} from "react";
import { toast } from "react-toastify";
import openSocket from "socket.io-client";
@ -30,6 +30,10 @@ import UserModal from "../../components/UserModal";
import ConfirmationModal from "../../components/ConfirmationModal";
import toastError from "../../errors/toastError";
//--------
import { AuthContext } from "../../context/Auth/AuthContext";
import { Can } from "../../components/Can";
const reducer = (state, action) => {
if (action.type === "LOAD_USERS") {
const users = action.payload;
@ -86,6 +90,9 @@ const useStyles = makeStyles((theme) => ({
const Users = () => {
const classes = useStyles();
//--------
const { user: userA } = useContext(AuthContext);
const [loading, setLoading] = useState(false);
const [pageNumber, setPageNumber] = useState(1);
const [hasMore, setHasMore] = useState(false);
@ -183,112 +190,121 @@ const Users = () => {
};
return (
<MainContainer>
<ConfirmationModal
title={
deletingUser &&
`${i18n.t("users.confirmationModal.deleteTitle")} ${
deletingUser.name
}?`
}
open={confirmModalOpen}
onClose={setConfirmModalOpen}
onConfirm={() => handleDeleteUser(deletingUser.id)}
>
{i18n.t("users.confirmationModal.deleteMessage")}
</ConfirmationModal>
<UserModal
open={userModalOpen}
onClose={handleCloseUserModal}
aria-labelledby="form-dialog-title"
userId={selectedUser && selectedUser.id}
/>
<MainHeader>
<Title>{i18n.t("users.title")}</Title>
<MainHeaderButtonsWrapper>
<TextField
placeholder={i18n.t("contacts.searchPlaceholder")}
type="search"
value={searchParam}
onChange={handleSearch}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<SearchIcon style={{ color: "gray" }} />
</InputAdornment>
),
}}
/>
<Button
variant="contained"
color="primary"
onClick={handleOpenUserModal}
>
{i18n.t("users.buttons.add")}
</Button>
<Can
role={userA.profile}
perform="user-view:show"
yes={() => (
<MainContainer>
<ConfirmationModal
title={
deletingUser &&
`${i18n.t("users.confirmationModal.deleteTitle")} ${
deletingUser.name
}?`
}
open={confirmModalOpen}
onClose={setConfirmModalOpen}
onConfirm={() => handleDeleteUser(deletingUser.id)}
>
{i18n.t("users.confirmationModal.deleteMessage")}
</ConfirmationModal>
<UserModal
open={userModalOpen}
onClose={handleCloseUserModal}
aria-labelledby="form-dialog-title"
userId={selectedUser && selectedUser.id}
/>
<MainHeader>
<Title>{i18n.t("users.title")}</Title>
<MainHeaderButtonsWrapper>
<TextField
placeholder={i18n.t("contacts.searchPlaceholder")}
type="search"
value={searchParam}
onChange={handleSearch}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<SearchIcon style={{ color: "gray" }} />
</InputAdornment>
),
}}
/>
</MainHeaderButtonsWrapper>
</MainHeader>
<Paper
className={classes.mainPaper}
variant="outlined"
onScroll={handleScroll}
>
<Table size="small">
<TableHead>
<TableRow>
<TableCell align="center">{i18n.t("users.table.name")}</TableCell>
<TableCell align="center">
{i18n.t("users.table.email")}
</TableCell>
<TableCell align="center">
{i18n.t("users.table.profile")}
</TableCell>
<Button
variant="contained"
color="primary"
onClick={handleOpenUserModal}
>
{i18n.t("users.buttons.add")}
</Button>
<TableCell align="center">
{i18n.t("users.table.actions")}
</TableCell>
</MainHeaderButtonsWrapper>
</MainHeader>
<Paper
className={classes.mainPaper}
variant="outlined"
onScroll={handleScroll}
>
<Table size="small">
<TableHead>
<TableRow>
<TableCell align="center">{i18n.t("users.table.name")}</TableCell>
<TableCell align="center">
{i18n.t("users.table.email")}
</TableCell>
<TableCell align="center">
{i18n.t("users.table.profile")}
</TableCell>
</TableRow>
</TableHead>
<TableBody>
<>
{users.map((user) => (
<TableRow key={user.id}>
<TableCell align="center">{user.name}</TableCell>
<TableCell align="center">{user.email}</TableCell>
<TableCell align="center">{user.profile}</TableCell>
<TableCell align="center">
{i18n.t("users.table.actions")}
</TableCell>
<TableCell align="center">
</TableRow>
</TableHead>
<TableBody>
<>
{users.map((user) => (
<TableRow key={user.id}>
<TableCell align="center">{user.name}</TableCell>
<TableCell align="center">{user.email}</TableCell>
<TableCell align="center">{user.profile}</TableCell>
<IconButton
size="small"
onClick={() => handleEditUser(user)}
>
<EditIcon />
</IconButton>
<TableCell align="center">
<IconButton
size="small"
onClick={(e) => {
setConfirmModalOpen(true);
setDeletingUser(user);
}}
>
<DeleteOutlineIcon />
</IconButton>
<IconButton
size="small"
onClick={() => handleEditUser(user)}
>
<EditIcon />
</IconButton>
<IconButton
size="small"
onClick={(e) => {
setConfirmModalOpen(true);
setDeletingUser(user);
}}
>
<DeleteOutlineIcon />
</IconButton>
</TableCell>
</TableRow>
))}
{loading && <TableRowSkeleton columns={4} />}
</>
</TableBody>
</Table>
</Paper>
</MainContainer>
)}
/>
</TableCell>
</TableRow>
))}
{loading && <TableRowSkeleton columns={4} />}
</>
</TableBody>
</Table>
</Paper>
</MainContainer>
);
};

View File

@ -15,6 +15,7 @@ const rules = {
"connections-view:show",
"dashboard-view:show",
"queues-view:show",
"user-view:show",
],
},
};