SheepstarStudio/Dashboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Updated the Sidebar.jsx

Browse Source
This commit is contained in:
Mathias Wagner 2023-11-13 22:03:13 +01:00
parent 527a7f240f
commit 22a94cc4a3
Signed by: Mathias
GPG Key ID: B8DC354B0A1F5B44
1 changed files with 26 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
src/states/Manage/pages/Sidebar/Sidebar.jsx
View File

@ -4,28 +4,37 @@ import sidebar from "@/states/Manage/pages/pages.jsx";
import {useNavigate, useParams} from "react-router-dom";
import {getPage} from "@/states/Manage/Manage.jsx";
export const Sidebar = () => {
export const Sidebar = ({open, setOpen}) => {
const navigate = useNavigate();
const params = useParams();
const update = (path) => {
navigate(path.replace(":id", params.id));
setOpen(false);
}
return (
<aside>
<div className="header" onClick={() => navigate("/")}>
<img src="/assets/images/logo192.png" alt="sheepstar"/>
<h1>Sheepstar</h1>
</div>
<>
{open && <div className="sidebar-overlay" onClick={() => setOpen(false)}/>}
<aside className={open ? "active" : ""}>
<div className="header" onClick={() => update("/")}>
<img src="/assets/images/logo192.png" alt="sheepstar"/>
<h1>Sheepstar</h1>
</div>
{sidebar.map((page) => {
const current = getPage(window.location.pathname);
{sidebar.map((page) => {
const current = getPage(window.location.pathname);
return (
<div className={"sidebar-item" + (current.path === page.path ? " item-active" : "")} key={page.name}
onClick={() => navigate(page.path.replace(":id", params.id))}>
<FontAwesomeIcon icon={page.icon} />
<h1>{page.name}</h1>
</div>
)
})}
</aside>
return (
<div className={"sidebar-item" + (current.path === page.path ? " item-active" : "")}
key={page.name}
onClick={() => update(page.path)}>
<FontAwesomeIcon icon={page.icon}/>
<h1>{page.name}</h1>
</div>
)
})}
</aside>
</>
)
}