30 lines
927 B
TypeScript
30 lines
927 B
TypeScript
import { Tab, Tabs } from "@mui/material"
|
|
import { Link, matchPath, useLocation } from "react-router-dom"
|
|
|
|
function useRouteMatch(patterns: readonly string[]) {
|
|
const { pathname } = useLocation()
|
|
|
|
for (let i = 0; i < patterns.length; i += 1) {
|
|
const pattern = patterns[i]
|
|
const possibleMatch = matchPath(pattern, pathname)
|
|
if (possibleMatch !== null) {
|
|
return possibleMatch
|
|
}
|
|
}
|
|
|
|
return null
|
|
}
|
|
|
|
export default function NavTabs() {
|
|
const routeMatch = useRouteMatch(['/', '/user', '/role']);
|
|
const currentTab = routeMatch?.pattern?.path;
|
|
|
|
return (
|
|
<Tabs value={currentTab}>
|
|
<Tab label="Главная" value="/" to="/" component={Link} />
|
|
<Tab label="Пользователи" value="/user" to="/user" component={Link} />
|
|
<Tab label="Роли" value="/role" to="/role" component={Link} />
|
|
</Tabs>
|
|
);
|
|
|
|
} |