mirror of
https://github.com/blakeblackshear/frigate.git
synced 2025-12-06 21:44:13 +03:00
5f15641b1b
* initial working konva * working multi polygons * multi zones * clean up * new zone dialog * clean up * relative coordinates and colors * fix color order * better motion tuner * objects for zones * progress * merge dev * edit pane * motion and object masks * filtering * add objects and unsaved to type * motion tuner, edit controls, tooltips * object and motion edit panes * polygon item component, switch color, object form, hover cards * working zone edit pane * working motion masks * object masks and deletion of all types * use FilterSwitch * motion tuner fixes and tweaks * clean up * tweaks * spaces in camera name * tweaks * allow dragging of points while drawing polygon * turn off editing mode when switching camera * limit interpolated coordinates and use crosshair cursor * padding * fix tooltip trigger for icons * konva tweaks * consolidate * fix top menu items on mobile
44 lines
1.4 KiB
TypeScript
44 lines
1.4 KiB
TypeScript
import Logo from "../Logo";
|
|
import NavItem from "./NavItem";
|
|
import { CameraGroupSelector } from "../filter/CameraGroupSelector";
|
|
import { useLocation } from "react-router-dom";
|
|
import GeneralSettings from "../menu/GeneralSettings";
|
|
import AccountSettings from "../menu/AccountSettings";
|
|
import useNavigation from "@/hooks/use-navigation";
|
|
|
|
function Sidebar() {
|
|
const location = useLocation();
|
|
|
|
const navbarLinks = useNavigation();
|
|
|
|
return (
|
|
<aside className="absolute w-[52px] z-10 left-o inset-y-0 overflow-y-auto scrollbar-hidden py-4 flex flex-col justify-between bg-background_alt border-r border-secondary-highlight">
|
|
<span tabIndex={0} className="sr-only" />
|
|
<div className="w-full flex flex-col gap-0 items-center">
|
|
<Logo className="w-8 h-8 mb-6" />
|
|
{navbarLinks.map((item) => {
|
|
const showCameraGroups =
|
|
item.id == 1 && item.url == location.pathname;
|
|
|
|
return (
|
|
<div key={item.id}>
|
|
<NavItem
|
|
className={`mx-[10px] ${showCameraGroups ? "mb-2" : "mb-4"}`}
|
|
item={item}
|
|
Icon={item.icon}
|
|
/>
|
|
{showCameraGroups && <CameraGroupSelector className="mb-4" />}
|
|
</div>
|
|
);
|
|
})}
|
|
</div>
|
|
<div className="flex flex-col items-center gap-4 mb-8">
|
|
<GeneralSettings />
|
|
<AccountSettings />
|
|
</div>
|
|
</aside>
|
|
);
|
|
}
|
|
|
|
export default Sidebar;
|