mirror of
https://github.com/blakeblackshear/frigate.git
synced 2024-11-21 19:07:46 +01:00
UI tweaks (#11795)
* 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:
parent
4313fd97aa
commit
9f181014a1
@ -69,7 +69,7 @@ export default function AutoUpdatingCameraImage({
|
||||
<CameraImage
|
||||
camera={camera}
|
||||
onload={handleLoad}
|
||||
searchParams={`cache=${key}${searchParams && `&${searchParams}`}`}
|
||||
searchParams={`cache=${key}${searchParams ? `&${searchParams}` : ""}`}
|
||||
className={cameraClasses}
|
||||
/>
|
||||
{showFps ? <span className="text-xs">Displaying at {fps}fps</span> : null}
|
||||
|
@ -84,7 +84,7 @@ export default function PreviewPlayer({
|
||||
return (
|
||||
<div
|
||||
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,
|
||||
)}
|
||||
>
|
||||
@ -322,7 +322,7 @@ function PreviewVideoPlayer({
|
||||
)}
|
||||
</video>
|
||||
{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
|
||||
</div>
|
||||
)}
|
||||
@ -535,7 +535,7 @@ function PreviewFramesPlayer({
|
||||
onLoad={onImageLoaded}
|
||||
/>
|
||||
{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
|
||||
</div>
|
||||
)}
|
||||
|
@ -30,7 +30,7 @@ import {
|
||||
useState,
|
||||
} from "react";
|
||||
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 useSWR from "swr";
|
||||
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) {
|
||||
return <ActivityIndicator />;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user