administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-04-12 18:17:36 +03:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

move camera switch button to header

Browse Source
This commit is contained in:
Josh Hawkins 2025-10-08 09:47:19 -05:00
parent 96a445a53e
commit 6bf8aa3d64
1 changed files with 37 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
web/src/pages/Settings.tsx
View File

@ -406,13 +406,36 @@ export default function Settings() {
return ( return (
<div className="flex h-full flex-col"> <div className="flex h-full flex-col">
<div className="border-b border-secondary p-4"> <div className="flex items-center justify-between border-b border-secondary p-3">
<Heading as="h3" className="mb-0"> <Heading as="h3" className="mb-0">
{t("settings", { ns: "common" })} {t("settings", { ns: "common" })}
</Heading> </Heading>
{[
"debug",
"cameras",
"masksAndZones",
"motionTuner",
"triggers",
].includes(page) && (
<div className="flex items-center gap-2">
{page == "masksAndZones" && (
<ZoneMaskFilterButton
selectedZoneMask={filterZoneMask}
updateZoneMaskFilter={setFilterZoneMask}
/>
)}
<CameraSelectButton
allCameras={cameras}
selectedCamera={selectedCamera}
setSelectedCamera={setSelectedCamera}
cameraEnabledStates={cameraEnabledStates}
currentPage={page}
/>
</div>
)}
</div> </div>
<SidebarProvider> <SidebarProvider className="md:h-dvh md:pb-24">
<Sidebar variant="inset" className="relative pt-0"> <Sidebar variant="inset" className="relative mb-8 pt-0">
<SidebarContent className="border-r-[1px] border-secondary bg-background pt-2"> <SidebarContent className="border-r-[1px] border-secondary bg-background pt-2">
<SidebarMenu> <SidebarMenu>
{settingsGroups.map((group) => { {settingsGroups.map((group) => {
@ -452,7 +475,7 @@ export default function Settings() {
<> <>
<SidebarGroupLabel <SidebarGroupLabel
className={cn( className={cn(
"cursor-default text-sm", "ml-0 cursor-default pl-0 text-sm",
filteredItems.some((item) => page === item.key) filteredItems.some((item) => page === item.key)
? "text-primary" ? "text-primary"
: "text-sidebar-foreground/80", : "text-sidebar-foreground/80",
@ -494,43 +517,18 @@ export default function Settings() {
</SidebarContent> </SidebarContent>
</Sidebar> </Sidebar>
<SidebarInset> <SidebarInset>
<div className="flex h-full flex-col"> <div className="flex-1 overflow-auto p-2">
{[ {(() => {
"debug", const CurrentComponent = getCurrentComponent(page);
"cameras", if (!CurrentComponent) return null;
"masksAndZones", return (
"motionTuner", <CurrentComponent
"triggers",
].includes(page) && (
<div className="flex items-center justify-end gap-2 border-b p-2">
{page == "masksAndZones" && (
<ZoneMaskFilterButton
selectedZoneMask={filterZoneMask}
updateZoneMaskFilter={setFilterZoneMask}
/>
)}
<CameraSelectButton
allCameras={cameras}
selectedCamera={selectedCamera} selectedCamera={selectedCamera}
setSelectedCamera={setSelectedCamera} setUnsavedChanges={setUnsavedChanges}
cameraEnabledStates={cameraEnabledStates} selectedZoneMask={filterZoneMask}
currentPage={page}
/> />
</div> );
)} })()}
<div className="flex-1 overflow-auto p-2">
{(() => {
const CurrentComponent = getCurrentComponent(page);
if (!CurrentComponent) return null;
return (
<CurrentComponent
selectedCamera={selectedCamera}
setUnsavedChanges={setUnsavedChanges}
selectedZoneMask={filterZoneMask}
/>
);
})()}
</div>
</div> </div>
</SidebarInset> </SidebarInset>
{confirmationDialogOpen && ( {confirmationDialogOpen && (