mirror of
https://github.com/blakeblackshear/frigate.git
synced 2025-12-06 21:44:13 +03:00
fbf4388b37
Some checks failed
CI / AMD64 Build (push) Has been cancelled
CI / ARM Build (push) Has been cancelled
CI / Jetson Jetpack 6 (push) Has been cancelled
CI / Assemble and push default build (push) Has been cancelled
CI / AMD64 Extra Build (push) Has been cancelled
CI / ARM Extra Build (push) Has been cancelled
CI / Synaptics Build (push) Has been cancelled
* don't flatten the search result cache when updating this would cause an infinite swr fetch if something was mutated and then fetch was called again * Properly sort keys for recording summary in StorageMetrics * tracked object description box tweaks * Remove ability to right click on elements inside of face popup * Update reprocess message * don't show object track until video metadata is loaded * fix blue line height calc for in progress events * Use timeline tab by default for notifications but add a query arg for customization * Try and improve notification opening behavior * Reduce review item buffering behavior * ensure logging config is passed to camera capture and tracker processes * ensure on demand recording stops when browser closes * improve active line progress height with resize observer * remove icons and duplicate find similar link in explore context menu * fix for initial broken image when creating trigger from explore * display friendly names for triggers in toasts * lpr and triggers docs updates * remove icons from dropdowns in face and classification * fix comma dangle linter issue * re-add incorrectly removed face library button icons * fix sidebar nav links on < 768px desktop layout * allow text to wrap on mark as reviewed button * match exact pixels * clarify LPR docs --------- Co-authored-by: Nicolas Mowen <nickmowen213@gmail.com>
74 lines
1.6 KiB
TypeScript
74 lines
1.6 KiB
TypeScript
import { NavLink } from "react-router-dom";
|
|
import {
|
|
Tooltip,
|
|
TooltipContent,
|
|
TooltipTrigger,
|
|
} from "@/components/ui/tooltip";
|
|
import { isDesktop } from "react-device-detect";
|
|
import { TooltipPortal } from "@radix-ui/react-tooltip";
|
|
import { NavData } from "@/types/navigation";
|
|
import { IconType } from "react-icons";
|
|
import { cn } from "@/lib/utils";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
const variants = {
|
|
primary: {
|
|
active: "font-bold text-white bg-selected hover:bg-selected/80",
|
|
inactive: "text-secondary-foreground bg-secondary hover:bg-muted",
|
|
},
|
|
secondary: {
|
|
active: "font-bold text-selected",
|
|
inactive: "text-secondary-foreground",
|
|
},
|
|
};
|
|
|
|
type NavItemProps = {
|
|
className?: string;
|
|
item: NavData;
|
|
Icon: IconType;
|
|
onClick?: () => void;
|
|
};
|
|
|
|
export default function NavItem({
|
|
className,
|
|
item,
|
|
Icon,
|
|
onClick,
|
|
}: NavItemProps) {
|
|
const { t } = useTranslation(["common"]);
|
|
if (item.enabled == false) {
|
|
return;
|
|
}
|
|
|
|
const content = (
|
|
<NavLink
|
|
to={item.url}
|
|
onClick={onClick}
|
|
className={({ isActive }) =>
|
|
cn(
|
|
"flex flex-col items-center justify-center rounded-lg p-[6px]",
|
|
className,
|
|
variants[item.variant ?? "primary"][isActive ? "active" : "inactive"],
|
|
)
|
|
}
|
|
>
|
|
<Icon className="size-5" />
|
|
</NavLink>
|
|
);
|
|
|
|
if (isDesktop) {
|
|
return (
|
|
<Tooltip>
|
|
<TooltipTrigger>{content}</TooltipTrigger>
|
|
<TooltipPortal>
|
|
<TooltipContent side="right">
|
|
<p>{t(item.title)}</p>
|
|
</TooltipContent>
|
|
</TooltipPortal>
|
|
</Tooltip>
|
|
);
|
|
}
|
|
|
|
return content;
|
|
}
|