Mirrors/blakeblackshear.frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2024-11-21 19:07:46 +01:00
Code Issues Projects Releases Wiki Activity

UI tweaks (#11795)

Browse Source 
* Prevent "undefined" from being displayed in searchParams string

* Show message for no motion data

* Use theme colors for no preview found divs
This commit is contained in:
Josh Hawkins 2024-06-07 06:57:15 -05:00 committed by GitHub
parent 4313fd97aa
commit 9f181014a1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 14 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/components/camera/AutoUpdatingCameraImage.tsx
View File

@ -69,7 +69,7 @@ export default function AutoUpdatingCameraImage({
<CameraImage <CameraImage
camera={camera} camera={camera}
onload={handleLoad} onload={handleLoad}
searchParams={`cache=${key}${searchParams && `&${searchParams}`}`} searchParams={`cache=${key}${searchParams ? `&${searchParams}` : ""}`}
className={cameraClasses} className={cameraClasses}
/> />
{showFps ? <span className="text-xs">Displaying at {fps}fps</span> : null} {showFps ? <span className="text-xs">Displaying at {fps}fps</span> : null}

6
web/src/components/player/PreviewPlayer.tsx
View File

@ -84,7 +84,7 @@ export default function PreviewPlayer({
return ( return (
<div <div
className={cn( className={cn(
"flex size-full items-center justify-center rounded-lg text-white md:rounded-2xl", "flex size-full items-center justify-center rounded-lg bg-background_alt text-primary md:rounded-2xl",
className, className,
)} )}
> >
@ -322,7 +322,7 @@ function PreviewVideoPlayer({
)} )}
</video> </video>
{cameraPreviews && !currentPreview && ( {cameraPreviews && !currentPreview && (
<div className="absolute inset-0 flex items-center justify-center rounded-lg text-white md:rounded-2xl"> <div className="absolute inset-0 flex items-center justify-center rounded-lg bg-background_alt text-primary md:rounded-2xl">
No Preview Found No Preview Found
</div> </div>
)} )}
@ -535,7 +535,7 @@ function PreviewFramesPlayer({
onLoad={onImageLoaded} onLoad={onImageLoaded}
/> />
{previewFrames?.length === 0 && ( {previewFrames?.length === 0 && (
<div className="-y-translate-1/2 align-center absolute inset-x-0 top-1/2 rounded-lg bg-black text-center text-white md:rounded-2xl"> <div className="-y-translate-1/2 align-center absolute inset-x-0 top-1/2 rounded-lg bg-background_alt text-center text-primary md:rounded-2xl">
No Preview Found No Preview Found
</div> </div>
)} )}

11
web/src/views/events/EventView.tsx
View File

@ -30,7 +30,7 @@ import {
useState, useState,
} from "react"; } from "react";
import { isDesktop, isMobile } from "react-device-detect"; import { isDesktop, isMobile } from "react-device-detect";
import { LuFolderCheck } from "react-icons/lu"; import { LuFolderCheck, LuFolderX } from "react-icons/lu";
import { MdCircle } from "react-icons/md"; import { MdCircle } from "react-icons/md";
import useSWR from "swr"; import useSWR from "swr";
import MotionReviewTimeline from "@/components/timeline/MotionReviewTimeline"; import MotionReviewTimeline from "@/components/timeline/MotionReviewTimeline";
@ -858,6 +858,15 @@ function MotionReview({
], ],
); );
if (motionData?.length === 0) {
return (
<div className="absolute left-1/2 top-1/2 flex -translate-x-1/2 -translate-y-1/2 flex-col items-center justify-center text-center">
<LuFolderX className="size-16" />
No motion data found
</div>
);
}
if (!relevantPreviews) { if (!relevantPreviews) {
return <ActivityIndicator />; return <ActivityIndicator />;
} }