diff --git a/web/src/components/ActivityIndicator.jsx b/web/src/components/ActivityIndicator.jsx index 4d08ce506..eefaae148 100644 --- a/web/src/components/ActivityIndicator.jsx +++ b/web/src/components/ActivityIndicator.jsx @@ -6,9 +6,9 @@ const sizes = { lg: 'h-16 w-16 border-8 border-t-8', }; -export default function ActivityIndicator({ size = 'md' }) { +export default function ActivityIndicator({ size = 'md', center = true }) { return ( -
+
); diff --git a/web/src/routes/System.jsx b/web/src/routes/System.jsx index e1ff56ed0..4b6b36f4d 100644 --- a/web/src/routes/System.jsx +++ b/web/src/routes/System.jsx @@ -21,7 +21,8 @@ export default function System() { const { value: { payload: stats }, } = useWs('stats'); - const { data: initialStats } = useSWR('stats'); + + const { data: initialStats, isValidating } = useSWR('stats'); const { cpu_usages, @@ -87,7 +88,12 @@ export default function System() { {service.last_updated && (

- Last refreshed: + Last refreshed: + {isValidating ? ( + + ) : ( + + )}

)} @@ -255,11 +261,15 @@ export default function System() { {(() => { if (cameras[camera]['pid'] && cameras[camera]['detection_enabled'] == 1) - return {cameras[camera]['detection_fps']} ({cameras[camera]['skipped_fps']} skipped) + return ( + + {cameras[camera]['detection_fps']} ({cameras[camera]['skipped_fps']} skipped) + + ); else if (cameras[camera]['pid'] && cameras[camera]['detection_enabled'] == 0) - return disabled + return disabled; - return - + return - ; })()} {cpu_usages[cameras[camera]['pid']]?.['cpu'] || '- '}%