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

Fix list views

Browse Source
This commit is contained in:
Nicolas Mowen 2024-03-27 16:51:30 -06:00
parent ba8c89d6ab
commit 542f37febc
2 changed files with 32 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/components/overlay/SaveExportOverlay.tsx
View File

@ -1,4 +1,4 @@
import { LuDisc, LuDisc2, LuDisc3, LuX } from "react-icons/lu";
import { LuX } from "react-icons/lu";
import { Button } from "../ui/button";
import { FaCompactDisc } from "react-icons/fa";

66
web/src/views/events/RecordingView.tsx
View File

@ -385,7 +385,9 @@ export function RecordingView({
<Timeline
contentRef={contentRef}
mainCamera={mainCamera}
timelineType={timelineType ?? "timeline"}
timelineType={
(exportRange == undefined ? timelineType : "timeline") ?? "timeline"
}
timeRange={timeRange}
mainCameraReviewItems={mainCameraReviewItems}
currentTime={currentTime}
@ -448,15 +450,17 @@ function Timeline({
}
}, [exportRange, exportStart, exportEnd, setExportRange, setCurrentTime]);
if (exportRange != undefined || timelineType == "timeline") {
return (
<div
className={
isDesktop
? "w-[100px] mt-2 overflow-y-auto no-scrollbar"
: "flex-grow overflow-hidden"
}
>
return (
<div
className={`${
isDesktop
? `${timelineType == "timeline" ? "w-[100px]" : "w-60"} mt-2 overflow-y-auto no-scrollbar`
: "flex-grow overflow-hidden"
} relative`}
>
<div className="absolute top-0 inset-x-0 z-20 w-full h-[30px] bg-gradient-to-b from-secondary to-transparent pointer-events-none"></div>
<div className="absolute bottom-0 inset-x-0 z-20 w-full h-[30px] bg-gradient-to-t from-secondary to-transparent pointer-events-none"></div>
{timelineType == "timeline" ? (
<MotionReviewTimeline
segmentDuration={30}
timestampSpread={15}
@ -477,32 +481,24 @@ function Timeline({
contentRef={contentRef}
onHandlebarDraggingChange={(scrubbing) => setScrubbing(scrubbing)}
/>
</div>
);
}
) : (
<div className="h-full flex flex-col gap-4 overflow-auto p-4 bg-secondary">
{mainCameraReviewItems.map((review) => {
if (review.severity == "significant_motion") {
return;
}
return (
<div
className={`${isDesktop ? "w-60" : "w-full"} h-full relative p-4 flex flex-col gap-4 bg-secondary`}
>
<div className="absolute top-0 inset-x-0 z-20 w-full h-[30px] bg-gradient-to-b from-secondary to-transparent pointer-events-none"></div>
<div className="absolute bottom-0 inset-x-0 z-20 w-full h-[30px] bg-gradient-to-t from-secondary to-transparent pointer-events-none"></div>
<div className="h-full overflow-auto">
{mainCameraReviewItems.map((review) => {
if (review.severity == "significant_motion") {
return;
}
return (
<ReviewCard
key={review.id}
event={review}
currentTime={currentTime}
onClick={() => setCurrentTime(review.start_time)}
/>
);
})}
</div>
return (
<ReviewCard
key={review.id}
event={review}
currentTime={currentTime}
onClick={() => setCurrentTime(review.start_time)}
/>
);
})}
</div>
)}
</div>
);
}