mirror of
https://github.com/traccar/traccar-web.git
synced 2025-01-07 03:26:42 +08:00
Extract MenuItem
This commit is contained in:
parent
736f6fd94c
commit
5e2b79a879
22
src/common/components/MenuItem.jsx
Normal file
22
src/common/components/MenuItem.jsx
Normal file
@ -0,0 +1,22 @@
|
||||
import makeStyles from '@mui/styles/makeStyles';
|
||||
import { ListItemButton, ListItemIcon, ListItemText } from '@mui/material';
|
||||
import { Link } from 'react-router-dom';
|
||||
import React from 'react';
|
||||
|
||||
const MenuItem = ({
|
||||
title, link, icon, selected,
|
||||
}) => {
|
||||
const classes = makeStyles({
|
||||
menuItemText: {
|
||||
whiteSpace: 'nowrap',
|
||||
},
|
||||
});
|
||||
return (
|
||||
<ListItemButton key={link} component={Link} to={link} selected={selected}>
|
||||
<ListItemIcon>{icon}</ListItemIcon>
|
||||
<ListItemText primary={title} className={classes.menuItemText} />
|
||||
</ListItemButton>
|
||||
);
|
||||
};
|
||||
|
||||
export default MenuItem;
|
@ -1,7 +1,5 @@
|
||||
import React from 'react';
|
||||
import {
|
||||
Divider, List, ListItemButton, ListItemIcon, ListItemText,
|
||||
} from '@mui/material';
|
||||
import { Divider, List } from '@mui/material';
|
||||
import StarIcon from '@mui/icons-material/Star';
|
||||
import TimelineIcon from '@mui/icons-material/Timeline';
|
||||
import PauseCircleFilledIcon from '@mui/icons-material/PauseCircleFilled';
|
||||
@ -13,28 +11,10 @@ import BarChartIcon from '@mui/icons-material/BarChart';
|
||||
import RouteIcon from '@mui/icons-material/Route';
|
||||
import EventRepeatIcon from '@mui/icons-material/EventRepeat';
|
||||
import NotesIcon from '@mui/icons-material/Notes';
|
||||
import { Link, useLocation } from 'react-router-dom';
|
||||
import makeStyles from '@mui/styles/makeStyles';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
import { useTranslation } from '../../common/components/LocalizationProvider';
|
||||
import { useAdministrator, useRestriction } from '../../common/util/permissions';
|
||||
|
||||
const useStyles = makeStyles({
|
||||
menuItemText: {
|
||||
whiteSpace: 'nowrap',
|
||||
},
|
||||
});
|
||||
|
||||
const MenuItem = ({
|
||||
title, link, icon, selected,
|
||||
}) => {
|
||||
const classes = useStyles();
|
||||
return (
|
||||
<ListItemButton key={link} component={Link} to={link} selected={selected}>
|
||||
<ListItemIcon>{icon}</ListItemIcon>
|
||||
<ListItemText primary={title} className={classes.menuItemText} />
|
||||
</ListItemButton>
|
||||
);
|
||||
};
|
||||
import MenuItem from '../../common/components/MenuItem';
|
||||
|
||||
const ReportsMenu = () => {
|
||||
const t = useTranslation();
|
||||
|
@ -15,32 +15,14 @@ import PublishIcon from '@mui/icons-material/Publish';
|
||||
import SmartphoneIcon from '@mui/icons-material/Smartphone';
|
||||
import HelpIcon from '@mui/icons-material/Help';
|
||||
import CampaignIcon from '@mui/icons-material/Campaign';
|
||||
import { Link, useLocation } from 'react-router-dom';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
import { useSelector } from 'react-redux';
|
||||
import makeStyles from '@mui/styles/makeStyles';
|
||||
import { useTranslation } from '../../common/components/LocalizationProvider';
|
||||
import {
|
||||
useAdministrator, useManager, useRestriction,
|
||||
} from '../../common/util/permissions';
|
||||
import useFeatures from '../../common/util/useFeatures';
|
||||
|
||||
const useStyles = makeStyles({
|
||||
menuItemText: {
|
||||
whiteSpace: 'nowrap',
|
||||
},
|
||||
});
|
||||
|
||||
const MenuItem = ({
|
||||
title, link, icon, selected,
|
||||
}) => {
|
||||
const classes = useStyles();
|
||||
return (
|
||||
<ListItemButton key={link} component={Link} to={link} selected={selected}>
|
||||
<ListItemIcon>{icon}</ListItemIcon>
|
||||
<ListItemText primary={title} className={classes.menuItemText} />
|
||||
</ListItemButton>
|
||||
);
|
||||
};
|
||||
import MenuItem from '../../common/components/MenuItem';
|
||||
|
||||
const SettingsMenu = () => {
|
||||
const t = useTranslation();
|
||||
|
Loading…
Reference in New Issue
Block a user