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

Update sidebar to only sort cameras once

Browse Source
This commit is contained in:
Nick Mowen 2022-04-11 07:24:52 -06:00
parent 37ab7f6285
commit 600a53f704
1 changed files with 16 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
web/src/Sidebar.jsx
View File

@ -9,10 +9,21 @@ import NavigationDrawer, { Destination, Separator } from './components/Navigatio
export default function Sidebar() { export default function Sidebar() {
const { data: config } = useSWR('config'); const { data: config } = useSWR('config');
const sortedCameras = useMemo(() => {
if (!config) {
return [];
}
return Object.entries(config.cameras)
.filter(([_, conf]) => conf.ui.dashboard)
.sort(([_, aConf], [__, bConf]) => aConf.ui.order === bConf.ui.order ? 0 : (aConf.ui.order > bConf.ui.order ? 1 : -1));
}, [config]);
if (!config) { if (!config) {
return null; return null;
} }
const { cameras, birdseye } = config; const { birdseye } = config;
return ( return (
<NavigationDrawer header={<Header />}> <NavigationDrawer header={<Header />}>
@ -20,14 +31,14 @@ export default function Sidebar() {
<Match path="/cameras/:camera/:other?"> <Match path="/cameras/:camera/:other?">
{({ matches }) => {({ matches }) =>
matches ? ( matches ? (
<SortedCameras unsortedCameras={cameras} /> <CameraSection sortedCameras={sortedCameras} />
) : null ) : null
} }
</Match> </Match>
<Match path="/recording/:camera/:date?/:hour?/:seconds?"> <Match path="/recording/:camera/:date?/:hour?/:seconds?">
{({ matches }) => {({ matches }) =>
matches ? ( matches ? (
<SortedRecordingCameras unsortedCameras={cameras} /> <RecordingSection sortedCameras={sortedCameras} />
) : null ) : null
} }
</Match> </Match>
@ -48,13 +59,7 @@ export default function Sidebar() {
); );
} }
function SortedCameras({ unsortedCameras }) { function CameraSection({ sortedCameras }) {
const sortedCameras = useMemo(() =>
Object.entries(unsortedCameras)
.filter(([_, conf]) => conf.ui.dashboard)
.sort(([_, aConf], [__, bConf]) => aConf.ui.order === bConf.ui.order ? 0 : (aConf.ui.order > bConf.ui.order ? 1 : -1)),
[unsortedCameras]);
return ( return (
<Fragment> <Fragment>
@ -67,13 +72,7 @@ function SortedCameras({ unsortedCameras }) {
); );
} }
function SortedRecordingCameras({ unsortedCameras }) { function RecordingSection({ sortedCameras }) {
const sortedCameras = useMemo(() =>
Object.entries(unsortedCameras)
.filter(([_, conf]) => conf.ui.dashboard)
.sort(([_, aConf], [__, bConf]) => aConf.ui.order === bConf.ui.order ? 0 : (aConf.ui.order > bConf.ui.order ? 1 : -1)),
[unsortedCameras]);
return ( return (
<Fragment> <Fragment>