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

Add useMemo to cameras as well

Browse Source
This commit is contained in:
Nick Mowen 2022-03-12 10:20:53 -07:00
parent 20633975c6
commit 5bc875db1d
2 changed files with 23 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
web/src/Sidebar.jsx
View File

@ -53,8 +53,8 @@ function SortedCameras({ unsortedCameras }) {
const sortedCameras = useMemo(() => const sortedCameras = useMemo(() =>
Object.entries(unsortedCameras) Object.entries(unsortedCameras)
.filter(([_, conf]) => conf.ui.show) .filter(([_, conf]) => conf.ui.show)
.sort(([_, aConf], [__, bConf]) => aConf.ui.order === bConf.ui.order ? 0 : (aConf.ui.order > bConf.ui.order ? 1 : -1)) .sort(([_, aConf], [__, bConf]) => aConf.ui.order === bConf.ui.order ? 0 : (aConf.ui.order > bConf.ui.order ? 1 : -1)),
, [unsortedCameras]); [unsortedCameras]);
return ( return (
<Fragment> <Fragment>
@ -72,8 +72,8 @@ function SortedRecordingCameras({ unsortedCameras }) {
const sortedCameras = useMemo(() => const sortedCameras = useMemo(() =>
Object.entries(unsortedCameras) Object.entries(unsortedCameras)
.filter(([_, conf]) => conf.ui.show) .filter(([_, conf]) => conf.ui.show)
.sort(([_, aConf], [__, bConf]) => aConf.ui.order === bConf.ui.order ? 0 : (aConf.ui.order > bConf.ui.order ? 1 : -1)) .sort(([_, aConf], [__, bConf]) => aConf.ui.order === bConf.ui.order ? 0 : (aConf.ui.order > bConf.ui.order ? 1 : -1)),
, [unsortedCameras]); [unsortedCameras]);
return ( return (
<Fragment> <Fragment>

22
web/src/routes/Cameras.jsx
View File

@ -1,4 +1,4 @@
import { h } from 'preact'; import { h, Fragment } from 'preact';
import ActivityIndicator from '../components/ActivityIndicator'; import ActivityIndicator from '../components/ActivityIndicator';
import Card from '../components/Card'; import Card from '../components/Card';
import CameraImage from '../components/CameraImage'; import CameraImage from '../components/CameraImage';
@ -16,13 +16,25 @@ export default function Cameras() {
<ActivityIndicator /> <ActivityIndicator />
) : ( ) : (
<div className="grid grid-cols-1 3xl:grid-cols-3 md:grid-cols-2 gap-4 p-2 px-4"> <div className="grid grid-cols-1 3xl:grid-cols-3 md:grid-cols-2 gap-4 p-2 px-4">
{Object.entries(config.cameras) <SortedCameras unsortedCameras={config.cameras} />
</div>
);
}
function SortedCameras({ unsortedCameras }) {
const sortedCameras = useMemo(() =>
Object.entries(unsortedCameras)
.filter(([_, conf]) => conf.ui.show) .filter(([_, conf]) => conf.ui.show)
.sort(([_, aConf], [__, bConf]) => aConf.ui.order === bConf.ui.order ? 0 : (aConf.ui.order > bConf.ui.order ? 1 : -1)) .sort(([_, aConf], [__, bConf]) => aConf.ui.order === bConf.ui.order ? 0 : (aConf.ui.order > bConf.ui.order ? 1 : -1)),
.map(([camera, conf]) => ( [unsortedCameras]);
return (
<Fragment>
{sortedCameras.map(([camera, conf]) => (
<Camera key={camera} name={camera} conf={conf} /> <Camera key={camera} name={camera} conf={conf} />
))} ))}
</div> </Fragment>
); );
} }