cheveguerra/whaticket-community
1
0
Fork 0
mirror of https://github.com/cheveguerra/whaticket-community.git synced 2026-04-18 19:59:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #69 from canove/pr58

Browse Source 
b0ef070921
This commit is contained in:
Cassio Santos
2020-11-13 07:13:52 -03:00
committed by GitHub
parent 6307c7f2b8 9e82c5cc1f
commit 7649a30666
3 changed files with 82 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/src/components/TableRowSkeleton/index.js
View File

@@ -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 (
<>
<TableRow>
@@ -13,13 +23,21 @@ const TableRowSkeleton = () => {
<TableCell>
<Skeleton animation="wave" height={20} width={80} />
</TableCell>
<TableCell>
<Skeleton animation="wave" height={20} width={80} />
<TableCell align="center">
<div className={classes.customTableCell}>
<Skeleton align="center" animation="wave" height={20} width={80} />
</div>
</TableCell>
<TableCell>
<Skeleton animation="wave" height={20} width={80} />
<TableCell align="center">
<div className={classes.customTableCell}>
<Skeleton align="center" animation="wave" height={20} width={80} />
</div>
</TableCell>
<TableCell align="center">
<div className={classes.customTableCell}>
<Skeleton align="center" animation="wave" height={20} width={80} />
</div>
</TableCell>
<TableCell></TableCell>
</TableRow>
</>
);

51
frontend/src/pages/Contacts/index.js
View File

@@ -12,7 +12,7 @@ import TableRow from "@material-ui/core/TableRow";
import Paper from "@material-ui/core/Paper";
import Button from "@material-ui/core/Button";
import Avatar from "@material-ui/core/Avatar";
import WhatsAppIcon from "@material-ui/icons/WhatsApp";
import SearchIcon from "@material-ui/icons/Search";
import TextField from "@material-ui/core/TextField";
import InputAdornment from "@material-ui/core/InputAdornment";
@@ -88,6 +88,7 @@ const useStyles = makeStyles(theme => ({
const Contacts = () => {
const classes = useStyles();
const history = useHistory();
const userId = +localStorage.getItem("userId");
const [loading, setLoading] = useState(false);
const [pageNumber, setPageNumber] = useState(1);
@@ -164,6 +165,31 @@ const Contacts = () => {
setContactModalOpen(false);
};
const handleSaveTicket = async contactId => {
if (!contactId) return;
setLoading(true);
try {
const { data: ticket } = await api.post("/tickets", {
contactId: contactId,
userId: userId,
status: "open",
});
history.push(`/tickets/${ticket.id}`);
} catch (err) {
const errorMsg = err.response?.data?.error;
if (errorMsg) {
if (i18n.exists(`backendErrors.${errorMsg}`)) {
toast.error(i18n.t(`backendErrors.${errorMsg}`));
} else {
toast.error(err.response.data.error);
}
} else {
toast.error("Unknown error");
}
}
setLoading(false);
};
const hadleEditContact = contactId => {
setSelectedContactId(contactId);
setContactModalOpen(true);
@@ -290,9 +316,13 @@ const Contacts = () => {
<TableRow>
<TableCell padding="checkbox" />
<TableCell>{i18n.t("contacts.table.name")}</TableCell>
<TableCell>{i18n.t("contacts.table.whatsapp")}</TableCell>
<TableCell>{i18n.t("contacts.table.email")}</TableCell>
<TableCell align="right">
<TableCell align="center">
{i18n.t("contacts.table.whatsapp")}
</TableCell>
<TableCell align="center">
{i18n.t("contacts.table.email")}
</TableCell>
<TableCell align="center">
{i18n.t("contacts.table.actions")}
</TableCell>
</TableRow>
@@ -305,16 +335,21 @@ const Contacts = () => {
{<Avatar src={contact.profilePicUrl} />}
</TableCell>
<TableCell>{contact.name}</TableCell>
<TableCell>{contact.number}</TableCell>
<TableCell>{contact.email}</TableCell>
<TableCell align="right">
<TableCell align="center">{contact.number}</TableCell>
<TableCell align="center">{contact.email}</TableCell>
<TableCell align="center">
<IconButton
size="small"
onClick={() => handleSaveTicket(contact.id)}
>
<WhatsAppIcon />
</IconButton>
<IconButton
size="small"
onClick={() => hadleEditContact(contact.id)}
>
<EditIcon />
</IconButton>
<IconButton
size="small"
onClick={e => {

23
frontend/src/pages/Users/index.js
View File

@@ -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 = () => {
<Table size="small">
<TableHead>
<TableRow>
<TableCell padding="checkbox" />
<TableCell>{i18n.t("users.table.name")}</TableCell>
<TableCell>{i18n.t("users.table.email")}</TableCell>
<TableCell>{i18n.t("users.table.profile")}</TableCell>
<TableCell align="right">
<TableCell align="center">
{i18n.t("users.table.email")}
</TableCell>
<TableCell align="center">
{i18n.t("users.table.profile")}
</TableCell>
<TableCell align="center">
{i18n.t("users.table.actions")}
</TableCell>
</TableRow>
@@ -264,10 +270,13 @@ const Users = () => {
<>
{users.map(user => (
<TableRow key={user.id}>
<TableCell style={{ paddingRight: 0 }}>
{<Avatar />}
</TableCell>
<TableCell>{user.name}</TableCell>
<TableCell>{user.email}</TableCell>
<TableCell>{user.profile}</TableCell>
<TableCell align="right">
<TableCell align="center">{user.email}</TableCell>
<TableCell align="center">{user.profile}</TableCell>
<TableCell align="center">
<IconButton
size="small"
onClick={() => handleEditUser(user)}