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

use page toggle

Browse Source
This commit is contained in:
Josh Hawkins 2025-10-08 13:19:43 -05:00
parent dcc8003d53
commit f0d65c9f37
1 changed files with 15 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -159,7 +159,7 @@ function MobileMenuItem({
export default function Settings() { export default function Settings() {
const { t } = useTranslation(["views/settings"]); const { t } = useTranslation(["views/settings"]);
const [page, setPage] = useState<SettingsType>("ui"); const [page, setPage] = useState<SettingsType>("ui");
const [_, setPageToggle] = useOptimisticState(page, setPage, 100); const [pageToggle, setPageToggle] = useOptimisticState(page, setPage, 100);
const [contentMobileOpen, setContentMobileOpen] = useState(false); const [contentMobileOpen, setContentMobileOpen] = useState(false);
const { data: config } = useSWR<FrigateConfig>("config"); const { data: config } = useSWR<FrigateConfig>("config");
@ -236,7 +236,10 @@ export default function Settings() {
const firstEnabledCamera = const firstEnabledCamera =
cameras.find((cam) => cameraEnabledStates[cam.name]) || cameras[0]; cameras.find((cam) => cameraEnabledStates[cam.name]) || cameras[0];
setSelectedCamera(firstEnabledCamera.name); setSelectedCamera(firstEnabledCamera.name);
} else if (!cameraEnabledStates[selectedCamera] && page !== "cameras") { } else if (
!cameraEnabledStates[selectedCamera] &&
pageToggle !== "cameras"
) {
// Switch to first enabled camera if current one is disabled, unless on "camera settings" page // Switch to first enabled camera if current one is disabled, unless on "camera settings" page
const firstEnabledCamera = const firstEnabledCamera =
cameras.find((cam) => cameraEnabledStates[cam.name]) || cameras[0]; cameras.find((cam) => cameraEnabledStates[cam.name]) || cameras[0];
@ -245,15 +248,15 @@ export default function Settings() {
} }
} }
} }
}, [cameras, selectedCamera, cameraEnabledStates, page]); }, [cameras, selectedCamera, cameraEnabledStates, pageToggle]);
useSearchEffect("page", (page: string) => { useSearchEffect("page", (page: string) => {
if (allSettingsViews.includes(page as SettingsType)) { if (allSettingsViews.includes(page as SettingsType)) {
// Restrict viewer to UI settings // Restrict viewer to UI settings
if (!isAdmin && !allowedViewsForViewer.includes(page as SettingsType)) { if (!isAdmin && !allowedViewsForViewer.includes(page as SettingsType)) {
setPage("ui"); setPageToggle("ui");
} else { } else {
setPage(page as SettingsType); setPageToggle(page as SettingsType);
} }
} }
// don't clear url params if we're creating a new object mask // don't clear url params if we're creating a new object mask
@ -342,7 +345,7 @@ export default function Settings() {
"triggers", "triggers",
].includes(page) ? ( ].includes(page) ? (
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
{page == "masksAndZones" && ( {pageToggle == "masksAndZones" && (
<ZoneMaskFilterButton <ZoneMaskFilterButton
selectedZoneMask={filterZoneMask} selectedZoneMask={filterZoneMask}
updateZoneMaskFilter={setFilterZoneMask} updateZoneMaskFilter={setFilterZoneMask}
@ -420,7 +423,7 @@ export default function Settings() {
"triggers", "triggers",
].includes(page) && ( ].includes(page) && (
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
{page == "masksAndZones" && ( {pageToggle == "masksAndZones" && (
<ZoneMaskFilterButton <ZoneMaskFilterButton
selectedZoneMask={filterZoneMask} selectedZoneMask={filterZoneMask}
updateZoneMaskFilter={setFilterZoneMask} updateZoneMaskFilter={setFilterZoneMask}
@ -452,7 +455,7 @@ export default function Settings() {
<SidebarMenuItem> <SidebarMenuItem>
<SidebarMenuButton <SidebarMenuButton
className="ml-0 pl-0" className="ml-0 pl-0"
isActive={page === filteredItems[0].key} isActive={pageToggle === filteredItems[0].key}
onClick={() => { onClick={() => {
if ( if (
!isAdmin && !isAdmin &&
@ -479,7 +482,9 @@ export default function Settings() {
<SidebarGroupLabel <SidebarGroupLabel
className={cn( className={cn(
"ml-0 cursor-default pl-0 text-sm", "ml-0 cursor-default pl-0 text-sm",
filteredItems.some((item) => page === item.key) filteredItems.some(
(item) => pageToggle === item.key,
)
? "text-primary" ? "text-primary"
: "text-sidebar-foreground/80", : "text-sidebar-foreground/80",
)} )}
@ -490,7 +495,7 @@ export default function Settings() {
{filteredItems.map((item) => ( {filteredItems.map((item) => (
<SidebarMenuSubItem key={item.key}> <SidebarMenuSubItem key={item.key}>
<SidebarMenuSubButton <SidebarMenuSubButton
isActive={page === item.key} isActive={pageToggle === item.key}
onClick={() => { onClick={() => {
if ( if (
!isAdmin && !isAdmin &&