diff --git a/frontend/src/components/ContactDrawer/index.js b/frontend/src/components/ContactDrawer/index.js index 185d502..bb6dc9c 100644 --- a/frontend/src/components/ContactDrawer/index.js +++ b/frontend/src/components/ContactDrawer/index.js @@ -11,7 +11,6 @@ import Avatar from "@material-ui/core/Avatar"; import Button from "@material-ui/core/Button"; import Paper from "@material-ui/core/Paper"; - import { i18n } from "../../translate/i18n"; import LinkifyWithTargetBlank from "../LinkifyWithTargetBlank"; import ContactModal from "../ContactModal"; @@ -19,8 +18,6 @@ import ContactDrawerSkeleton from "../ContactDrawerSkeleton"; const drawerWidth = 320; - - const useStyles = makeStyles(theme => ({ drawer: { width: drawerWidth, @@ -151,7 +148,6 @@ const ContactDrawer = ({ open, handleDrawerClose, contact, loading }) => { variant="outlined" className={classes.contactExtraInfo} > - {info.name} diff --git a/frontend/src/components/TableRowSkeleton/index.js b/frontend/src/components/TableRowSkeleton/index.js index 4d808f5..411cb03 100644 --- a/frontend/src/components/TableRowSkeleton/index.js +++ b/frontend/src/components/TableRowSkeleton/index.js @@ -2,8 +2,18 @@ import React from "react"; import TableCell from "@material-ui/core/TableCell"; import TableRow from "@material-ui/core/TableRow"; import Skeleton from "@material-ui/lab/Skeleton"; +import { makeStyles } from "@material-ui/core"; + +const useStyles = makeStyles(theme => ({ + customTableCell: { + display: "flex", + alignItems: "center", + justifyContent: "center", + }, +})); const TableRowSkeleton = () => { + const classes = useStyles(); return ( <> @@ -13,13 +23,21 @@ const TableRowSkeleton = () => { - - + +
+ +
- - + +
+ +
+
+ +
+ +
-
); diff --git a/frontend/src/pages/Users/index.js b/frontend/src/pages/Users/index.js index 9e750c5..b260623 100644 --- a/frontend/src/pages/Users/index.js +++ b/frontend/src/pages/Users/index.js @@ -28,6 +28,7 @@ import { i18n } from "../../translate/i18n"; import TableRowSkeleton from "../../components/TableRowSkeleton"; import UserModal from "../../components/UserModal"; import ConfirmationModal from "../../components/ConfirmationModal"; +import { Avatar } from "@material-ui/core"; const reducer = (state, action) => { if (action.type === "LOAD_USERS") { @@ -110,7 +111,7 @@ const Users = () => { }); dispatch({ type: "LOAD_USERS", payload: data.users }); setHasMore(data.hasMore); - setLoading(false); + // setLoading(false); } catch (err) { const errorMsg = err.response?.data?.error; if (errorMsg) { @@ -252,10 +253,15 @@ const Users = () => { + {i18n.t("users.table.name")} - {i18n.t("users.table.email")} - {i18n.t("users.table.profile")} - + + {i18n.t("users.table.email")} + + + {i18n.t("users.table.profile")} + + {i18n.t("users.table.actions")} @@ -264,10 +270,13 @@ const Users = () => { <> {users.map(user => ( + + {} + {user.name} - {user.email} - {user.profile} - + {user.email} + {user.profile} + handleEditUser(user)}