Create home page
This commit is contained in:
59
central_frontend/src/widgets/SolarEnergyNavList.tsx
Normal file
59
central_frontend/src/widgets/SolarEnergyNavList.tsx
Normal file
@ -0,0 +1,59 @@
|
||||
import {
|
||||
mdiAccountMultiple,
|
||||
mdiAccountMusic,
|
||||
mdiAlbum,
|
||||
mdiApi,
|
||||
mdiChartLine,
|
||||
mdiCog,
|
||||
mdiHome,
|
||||
mdiInbox,
|
||||
mdiMusic,
|
||||
} from "@mdi/js";
|
||||
import Icon from "@mdi/react";
|
||||
import {
|
||||
List,
|
||||
ListItemButton,
|
||||
ListItemIcon,
|
||||
ListItemSecondaryAction,
|
||||
ListItemText,
|
||||
ListSubheader,
|
||||
} from "@mui/material";
|
||||
import { useLocation } from "react-router-dom";
|
||||
import { useAuthInfo } from "./BaseAuthenticatedPage";
|
||||
import { RouterLink } from "./RouterLink";
|
||||
|
||||
export function SolarEnergyNavList(): React.ReactElement {
|
||||
const user = useAuthInfo().info;
|
||||
return (
|
||||
<List
|
||||
dense
|
||||
component="nav"
|
||||
sx={{
|
||||
minWidth: "200px",
|
||||
backgroundColor: "background.paper",
|
||||
}}
|
||||
>
|
||||
<NavLink label="Home" uri="/" icon={<Icon path={mdiHome} size={1} />} />
|
||||
</List>
|
||||
);
|
||||
}
|
||||
|
||||
function NavLink(p: {
|
||||
icon: React.ReactElement;
|
||||
uri: string;
|
||||
label: string;
|
||||
secondaryAction?: React.ReactElement;
|
||||
}): React.ReactElement {
|
||||
const location = useLocation();
|
||||
return (
|
||||
<RouterLink to={p.uri}>
|
||||
<ListItemButton selected={p.uri === location.pathname}>
|
||||
<ListItemIcon>{p.icon}</ListItemIcon>
|
||||
<ListItemText primary={p.label} />
|
||||
{p.secondaryAction && (
|
||||
<ListItemSecondaryAction>{p.secondaryAction}</ListItemSecondaryAction>
|
||||
)}
|
||||
</ListItemButton>
|
||||
</RouterLink>
|
||||
);
|
||||
}
|
Reference in New Issue
Block a user