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)}