Fix exports (#10824)

* Avoid crash from opening motion time right now

* Cleanup export margins

* Fix mobile filter

* Fix export

* Improve spacing
This commit is contained in:
Nicolas Mowen 2024-04-04 09:43:54 -06:00 committed by GitHub
parent fbc0da6016
commit 80e330594b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 13 additions and 12 deletions

View File

@ -216,11 +216,11 @@ export function ExportContent({
<DialogHeader> <DialogHeader>
<DialogTitle>Export</DialogTitle> <DialogTitle>Export</DialogTitle>
</DialogHeader> </DialogHeader>
<SelectSeparator className="bg-secondary" /> <SelectSeparator className="my-4 bg-secondary" />
</> </>
)} )}
<RadioGroup <RadioGroup
className={`flex flex-col gap-3 ${isDesktop ? "" : "mt-4"}`} className={`flex flex-col gap-4 ${isDesktop ? "" : "mt-4"}`}
onValueChange={(value) => onSelectTime(value as ExportOption)} onValueChange={(value) => onSelectTime(value as ExportOption)}
> >
{EXPORT_OPTIONS.map((opt) => { {EXPORT_OPTIONS.map((opt) => {
@ -254,13 +254,13 @@ export function ExportContent({
/> />
)} )}
<Input <Input
className="mt-3" className="my-6"
type="search" type="search"
placeholder="Name the Export" placeholder="Name the Export"
value={name} value={name}
onChange={(e) => setName(e.target.value)} onChange={(e) => setName(e.target.value)}
/> />
{isDesktop && <SelectSeparator className="bg-secondary" />} {isDesktop && <SelectSeparator className="my-4 bg-secondary" />}
<DialogFooter <DialogFooter
className={isDesktop ? "" : "mt-3 flex flex-col-reverse gap-4"} className={isDesktop ? "" : "mt-3 flex flex-col-reverse gap-4"}
> >
@ -371,7 +371,7 @@ function CustomTimeSelector({
return ( return (
<div <div
className={`flex items-center bg-secondary rounded-lg ${isDesktop ? "mx-8 px-2 gap-2" : "pl-2 mt-3"}`} className={`mt-3 flex items-center bg-secondary rounded-lg ${isDesktop ? "mx-8 px-2 gap-2" : "pl-2"}`}
> >
<FaCalendarAlt /> <FaCalendarAlt />
<Popover <Popover

View File

@ -17,7 +17,6 @@ import axios from "axios";
import SaveExportOverlay from "./SaveExportOverlay"; import SaveExportOverlay from "./SaveExportOverlay";
import { isMobile } from "react-device-detect"; import { isMobile } from "react-device-detect";
const ATTRIBUTES = ["amazon", "face", "fedex", "license_plate", "ups"];
type DrawerMode = "none" | "select" | "export" | "calendar" | "filter"; type DrawerMode = "none" | "select" | "export" | "calendar" | "filter";
const DRAWER_FEATURES = ["export", "calendar", "filter"] as const; const DRAWER_FEATURES = ["export", "calendar", "filter"] as const;
@ -109,9 +108,7 @@ export default function MobileReviewSettingsDrawer({
cameras.forEach((camera) => { cameras.forEach((camera) => {
const cameraConfig = config.cameras[camera]; const cameraConfig = config.cameras[camera];
cameraConfig.objects.track.forEach((label) => { cameraConfig.objects.track.forEach((label) => {
if (!ATTRIBUTES.includes(label)) {
labels.add(label); labels.add(label);
}
}); });
if (cameraConfig.audio.enabled_in_config) { if (cameraConfig.audio.enabled_in_config) {

View File

@ -851,7 +851,7 @@ function MotionReview({
onClick={() => onClick={() =>
onOpenRecording({ onOpenRecording({
camera: camera.name, camera: camera.name,
startTime: currentTime, startTime: Math.min(currentTime, Date.now() / 1000 - 10),
severity: "significant_motion", severity: "significant_motion",
}) })
} }

View File

@ -142,7 +142,7 @@ export function RecordingView({
); );
useEffect(() => { useEffect(() => {
if (scrubbing) { if (scrubbing || exportRange) {
if ( if (
currentTime > currentTimeRange.before + 60 || currentTime > currentTimeRange.before + 60 ||
currentTime < currentTimeRange.after - 60 currentTime < currentTimeRange.after - 60
@ -157,6 +157,8 @@ export function RecordingView({
controller.scrubToTimestamp(currentTime); controller.scrubToTimestamp(currentTime);
}); });
} }
// we only want to seek when current time updates
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [ }, [
currentTime, currentTime,
scrubbing, scrubbing,
@ -486,7 +488,9 @@ function Timeline({
setExportRange({ after: exportStart, before: exportEnd }); setExportRange({ after: exportStart, before: exportEnd });
} }
}, [exportRange, exportStart, exportEnd, setExportRange, setCurrentTime]); // we only want to update when the export parts change
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [exportStart, exportEnd, setExportRange, setCurrentTime]);
return ( return (
<div <div