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

add quick answers

Browse Source
This commit is contained in:
ertprs
2021-09-05 22:30:57 -03:00
parent 85fe927385
commit 258b5db4a1
19 changed files with 2853 additions and 1789 deletions
Download Patch File Download Diff File Expand all files Collapse all files

196
frontend/src/layout/MainListItems.js
View File

@@ -14,6 +14,7 @@ import SettingsOutlinedIcon from "@material-ui/icons/SettingsOutlined";
import PeopleAltOutlinedIcon from "@material-ui/icons/PeopleAltOutlined";
import ContactPhoneOutlinedIcon from "@material-ui/icons/ContactPhoneOutlined";
import AccountTreeOutlinedIcon from "@material-ui/icons/AccountTreeOutlined";
import QuestionAnswerOutlinedIcon from "@material-ui/icons/QuestionAnswerOutlined";
import { i18n } from "../translate/i18n";
import { WhatsAppsContext } from "../context/WhatsApp/WhatsAppsContext";
@@ -21,109 +22,114 @@ import { AuthContext } from "../context/Auth/AuthContext";
import { Can } from "../components/Can";
function ListItemLink(props) {
const { icon, primary, to, className } = props;
const { icon, primary, to, className } = props;
const renderLink = React.useMemo(
() =>
React.forwardRef((itemProps, ref) => (
<RouterLink to={to} ref={ref} {...itemProps} />
)),
[to]
);
const renderLink = React.useMemo(
() =>
React.forwardRef((itemProps, ref) => (
<RouterLink to={to} ref={ref} {...itemProps} />
)),
[to]
);
return (
<li>
<ListItem button component={renderLink} className={className}>
{icon ? <ListItemIcon>{icon}</ListItemIcon> : null}
<ListItemText primary={primary} />
</ListItem>
</li>
);
return (
<li>
<ListItem button component={renderLink} className={className}>
{icon ? <ListItemIcon>{icon}</ListItemIcon> : null}
<ListItemText primary={primary} />
</ListItem>
</li>
);
}
const MainListItems = () => {
const { whatsApps } = useContext(WhatsAppsContext);
const { user } = useContext(AuthContext);
const [connectionWarning, setConnectionWarning] = useState(false);
const { whatsApps } = useContext(WhatsAppsContext);
const { user } = useContext(AuthContext);
const [connectionWarning, setConnectionWarning] = useState(false);
useEffect(() => {
const delayDebounceFn = setTimeout(() => {
if (whatsApps.length > 0) {
const offlineWhats = whatsApps.filter(whats => {
return (
whats.status === "qrcode" ||
whats.status === "PAIRING" ||
whats.status === "DISCONNECTED" ||
whats.status === "TIMEOUT" ||
whats.status === "OPENING"
);
});
if (offlineWhats.length > 0) {
setConnectionWarning(true);
} else {
setConnectionWarning(false);
}
}
}, 2000);
return () => clearTimeout(delayDebounceFn);
}, [whatsApps]);
useEffect(() => {
const delayDebounceFn = setTimeout(() => {
if (whatsApps.length > 0) {
const offlineWhats = whatsApps.filter((whats) => {
return (
whats.status === "qrcode" ||
whats.status === "PAIRING" ||
whats.status === "DISCONNECTED" ||
whats.status === "TIMEOUT" ||
whats.status === "OPENING"
);
});
if (offlineWhats.length > 0) {
setConnectionWarning(true);
} else {
setConnectionWarning(false);
}
}
}, 2000);
return () => clearTimeout(delayDebounceFn);
}, [whatsApps]);
return (
<div>
<ListItemLink
to="/"
primary="Dashboard"
icon={<DashboardOutlinedIcon />}
/>
<ListItemLink
to="/connections"
primary={i18n.t("mainDrawer.listItems.connections")}
icon={
<Badge badgeContent={connectionWarning ? "!" : 0} color="error">
<SyncAltIcon />
</Badge>
}
/>
<ListItemLink
to="/tickets"
primary={i18n.t("mainDrawer.listItems.tickets")}
icon={<WhatsAppIcon />}
/>
return (
<div>
<ListItemLink
to="/"
primary="Dashboard"
icon={<DashboardOutlinedIcon />}
/>
<ListItemLink
to="/connections"
primary={i18n.t("mainDrawer.listItems.connections")}
icon={
<Badge badgeContent={connectionWarning ? "!" : 0} color="error">
<SyncAltIcon />
</Badge>
}
/>
<ListItemLink
to="/tickets"
primary={i18n.t("mainDrawer.listItems.tickets")}
icon={<WhatsAppIcon />}
/>
<ListItemLink
to="/contacts"
primary={i18n.t("mainDrawer.listItems.contacts")}
icon={<ContactPhoneOutlinedIcon />}
/>
<Can
role={user.profile}
perform="drawer-admin-items:view"
yes={() => (
<>
<Divider />
<ListSubheader inset>
{i18n.t("mainDrawer.listItems.administration")}
</ListSubheader>
<ListItemLink
to="/users"
primary={i18n.t("mainDrawer.listItems.users")}
icon={<PeopleAltOutlinedIcon />}
/>
<ListItemLink
to="/queues"
primary={i18n.t("mainDrawer.listItems.queues")}
icon={<AccountTreeOutlinedIcon />}
/>
<ListItemLink
to="/settings"
primary={i18n.t("mainDrawer.listItems.settings")}
icon={<SettingsOutlinedIcon />}
/>
</>
)}
/>
</div>
);
<ListItemLink
to="/contacts"
primary={i18n.t("mainDrawer.listItems.contacts")}
icon={<ContactPhoneOutlinedIcon />}
/>
<ListItemLink
to="/quickAnswers"
primary={i18n.t("mainDrawer.listItems.quickAnswers")}
icon={<QuestionAnswerOutlinedIcon />}
/>
<Can
role={user.profile}
perform="drawer-admin-items:view"
yes={() => (
<>
<Divider />
<ListSubheader inset>
{i18n.t("mainDrawer.listItems.administration")}
</ListSubheader>
<ListItemLink
to="/users"
primary={i18n.t("mainDrawer.listItems.users")}
icon={<PeopleAltOutlinedIcon />}
/>
<ListItemLink
to="/queues"
primary={i18n.t("mainDrawer.listItems.queues")}
icon={<AccountTreeOutlinedIcon />}
/>
<ListItemLink
to="/settings"
primary={i18n.t("mainDrawer.listItems.settings")}
icon={<SettingsOutlinedIcon />}
/>
</>
)}
/>
</div>
);
};
export default MainListItems;