Added click link menu and shrink it

pull/16/head
Renato Di Giacomo 2022-07-29 15:44:08 -03:00
parent 75fd79fc8d
commit b4edc7f99a
2 changed files with 20 additions and 41 deletions

View File

@ -9,8 +9,8 @@ import Divider from "@material-ui/core/Divider";
import { Badge } from "@material-ui/core"; import { Badge } from "@material-ui/core";
import DashboardOutlinedIcon from "@material-ui/icons/DashboardOutlined"; import DashboardOutlinedIcon from "@material-ui/icons/DashboardOutlined";
import ReportOutlinedIcon from "@material-ui/icons/ReportOutlined"; import ReportOutlinedIcon from "@material-ui/icons/ReportOutlined";
import SendOutlined from '@material-ui/icons/SendOutlined'; import SendOutlined from "@material-ui/icons/SendOutlined";
//import ReportOutlined from "@bit/mui-org.material-ui-icons.report-outlined"; //import ReportOutlined from "@bit/mui-org.material-ui-icons.report-outlined";
@ -32,10 +32,7 @@ function ListItemLink(props) {
const { icon, primary, to, className } = props; const { icon, primary, to, className } = props;
const renderLink = React.useMemo( const renderLink = React.useMemo(
() => () => React.forwardRef((itemProps, ref) => <RouterLink to={to} ref={ref} {...itemProps} />),
React.forwardRef((itemProps, ref) => (
<RouterLink to={to} ref={ref} {...itemProps} />
)),
[to] [to]
); );
@ -50,7 +47,7 @@ function ListItemLink(props) {
} }
const MainListItems = (props) => { const MainListItems = (props) => {
const { drawerClose } = props; const { drawerClose, setDrawerOpen, drawerOpen } = props;
const { whatsApps } = useContext(WhatsAppsContext); const { whatsApps } = useContext(WhatsAppsContext);
const { user } = useContext(AuthContext); const { user } = useContext(AuthContext);
const [connectionWarning, setConnectionWarning] = useState(false); const [connectionWarning, setConnectionWarning] = useState(false);
@ -78,9 +75,8 @@ const MainListItems = (props) => {
}, [whatsApps]); }, [whatsApps]);
return ( return (
<div onClick={drawerClose}> //Solicitado pelo Adriano: Click no LinkItem e fechar o menu!
<div onClick={() => setDrawerOpen(false)}>
<ListItemLink <ListItemLink
to="/tickets" to="/tickets"
primary={i18n.t("mainDrawer.listItems.tickets")} primary={i18n.t("mainDrawer.listItems.tickets")}
@ -92,11 +88,7 @@ const MainListItems = (props) => {
primary={i18n.t("mainDrawer.listItems.contacts")} primary={i18n.t("mainDrawer.listItems.contacts")}
icon={<ContactPhoneOutlinedIcon />} icon={<ContactPhoneOutlinedIcon />}
/> />
<ListItemLink <ListItemLink to="/schedulesReminder" primary="Lembretes" icon={<SendOutlined />} />
to="/schedulesReminder"
primary="Lembretes"
icon={<SendOutlined />}
/>
<ListItemLink <ListItemLink
to="/quickAnswers" to="/quickAnswers"
primary={i18n.t("mainDrawer.listItems.quickAnswers")} primary={i18n.t("mainDrawer.listItems.quickAnswers")}
@ -108,9 +100,7 @@ const MainListItems = (props) => {
yes={() => ( yes={() => (
<> <>
<Divider /> <Divider />
<ListSubheader inset> <ListSubheader inset>{i18n.t("mainDrawer.listItems.administration")}</ListSubheader>
{i18n.t("mainDrawer.listItems.administration")}
</ListSubheader>
<ListItemLink <ListItemLink
to="/users" to="/users"
primary={i18n.t("mainDrawer.listItems.users")} primary={i18n.t("mainDrawer.listItems.users")}
@ -132,32 +122,21 @@ const MainListItems = (props) => {
} }
/> />
<ListItemLink <ListItemLink to="/" primary="Dashboard" icon={<DashboardOutlinedIcon />} />
to="/"
primary="Dashboard"
icon={<DashboardOutlinedIcon />}
/>
<ListItemLink
to="/report"
primary="Relatório"
icon={<ReportOutlinedIcon />}
/>
<ListItemLink to="/report" primary="Relatório" icon={<ReportOutlinedIcon />} />
<Can <Can
role={user.profile} role={user.profile}
perform="settings-view:show" perform="settings-view:show"
yes={() => ( yes={() => (
<ListItemLink <ListItemLink
to="/settings" to="/settings"
primary={i18n.t("mainDrawer.listItems.settings")} primary={i18n.t("mainDrawer.listItems.settings")}
icon={<SettingsOutlinedIcon />} icon={<SettingsOutlinedIcon />}
/> />
)} )}
/> />
</> </>
)} )}
/> />

View File

@ -185,7 +185,7 @@ const LoggedInLayout = ({ children }) => {
</div> </div>
<Divider /> <Divider />
<List> <List>
<MainListItems drawerClose={drawerClose} /> <MainListItems drawerClose={drawerClose} setDrawerOpen={setDrawerOpen} drawerOpen={drawerOpen} />
</List> </List>
<Divider /> <Divider />
</Drawer> </Drawer>