chris/frigate
1
0
Fork 0
forked from Github/frigate
Code Pull Requests Packages Activity

Add score filter to Explore view (#14397)

Browse Source 
* backend score filtering and sorting

* score filter frontend

* use input for score filtering

* use correct score on search thumbnail

* add popover to explain top_score

* revert sublabel score calc

* update filters logic

* fix rounding on score

* wait until default view is loaded

* don't turn button to selected style for similarity searches

* clarify language

* fix alert dialog buttons to use correct destructive variant

* use root level top_score for very old events

* better arrangement of thumbnail footer items on smaller screens
This commit is contained in:
Josh Hawkins
2024-10-17 06:30:52 -05:00
committed by GitHub
parent edaccd86d6
commit 8173cd7776
16 changed files with 353 additions and 136 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
web/src/components/input/DeleteSearchDialog.tsx
View File

@@ -8,6 +8,7 @@ import {
AlertDialogHeader,
AlertDialogTitle,
} from "@/components/ui/alert-dialog";
import { buttonVariants } from "../ui/button";
type DeleteSearchDialogProps = {
isOpen: boolean;
@@ -35,7 +36,7 @@ export function DeleteSearchDialog({
<AlertDialogCancel onClick={onClose}>Cancel</AlertDialogCancel>
<AlertDialogAction
onClick={onConfirm}
className="bg-destructive text-white"
className={buttonVariants({ variant: "destructive" })}
>
Delete
</AlertDialogAction>

47
web/src/components/input/InputWithTags.tsx
View File

@@ -201,10 +201,13 @@ export default function InputWithTags({
allSuggestions[type as FilterType]?.includes(value) ||
type == "before" ||
type == "after" ||
type == "time_range"
type == "time_range" ||
type == "min_score" ||
type == "max_score"
) {
const newFilters = { ...filters };
let timestamp = 0;
let score = 0;
switch (type) {
case "before":
@@ -244,6 +247,40 @@ export default function InputWithTags({
newFilters[type] = timestamp / 1000;
}
break;
case "min_score":
case "max_score":
score = parseInt(value);
if (score >= 0) {
// Check for conflicts between min_score and max_score
if (
type === "min_score" &&
filters.max_score !== undefined &&
score > filters.max_score * 100
) {
toast.error(
"The 'min_score' must be less than or equal to the 'max_score'.",
{
position: "top-center",
},
);
return;
}
if (
type === "max_score" &&
filters.min_score !== undefined &&
score < filters.min_score * 100
) {
toast.error(
"The 'max_score' must be greater than or equal to the 'min_score'.",
{
position: "top-center",
},
);
return;
}
newFilters[type] = score / 100;
}
break;
case "time_range":
newFilters[type] = value;
break;
@@ -302,6 +339,8 @@ export default function InputWithTags({
} - ${
config?.ui.time_format === "24hour" ? endTime : convertTo12Hour(endTime)
}`;
} else if (filterType === "min_score" || filterType === "max_score") {
return Math.round(Number(filterValues) * 100).toString() + "%";
} else {
return filterValues as string;
}
@@ -320,7 +359,11 @@ export default function InputWithTags({
isValidTimeRange(
trimmedValue.replace("-", ","),
config?.ui.time_format,
))
)) ||
((filterType === "min_score" || filterType === "max_score") &&
!isNaN(Number(trimmedValue)) &&
Number(trimmedValue) >= 50 &&
Number(trimmedValue) <= 100)
) {
createFilter(
filterType,