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

Add reset buttons and make calendar apply immediately

Browse Source
This commit is contained in:
Nicolas Mowen 2024-03-09 06:26:43 -07:00
parent 3215104306
commit 55f9cf3a21
1 changed files with 29 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
web/src/components/filter/ReviewFilterGroup.tsx
View File

@ -212,7 +212,7 @@ function CamerasFilterButton({
))} ))}
</div> </div>
<DropdownMenuSeparator /> <DropdownMenuSeparator />
<div className="flex justify-center items-center"> <div className="flex justify-evenly items-center">
<Button <Button
variant="select" variant="select"
onClick={() => { onClick={() => {
@ -222,6 +222,15 @@ function CamerasFilterButton({
> >
Apply Apply
</Button> </Button>
<Button
variant="secondary"
onClick={() => {
setCurrentCameras(undefined);
updateCameraFilter(undefined);
}}
>
Reset
</Button>
</div> </div>
</> </>
); );
@ -271,8 +280,6 @@ function CalendarFilterButton({
day, day,
updateSelectedDay, updateSelectedDay,
}: CalendarFilterButtonProps) { }: CalendarFilterButtonProps) {
const [open, setOpen] = useState(false);
const [selectedDay, setSelectedDay] = useState(day);
const disabledDates = useMemo(() => { const disabledDates = useMemo(() => {
const tomorrow = new Date(); const tomorrow = new Date();
tomorrow.setHours(tomorrow.getHours() + 24, -1, 0, 0); tomorrow.setHours(tomorrow.getHours() + 24, -1, 0, 0);
@ -298,22 +305,21 @@ function CalendarFilterButton({
<Calendar <Calendar
mode="single" mode="single"
disabled={disabledDates} disabled={disabledDates}
selected={selectedDay} selected={day}
showOutsideDays={false} showOutsideDays={false}
onSelect={(day) => { onSelect={(day) => {
setSelectedDay(day); updateSelectedDay(day);
}} }}
/> />
<DropdownMenuSeparator /> <DropdownMenuSeparator />
<div className="flex justify-center items-center"> <div className="flex justify-center items-center">
<Button <Button
variant="select" variant="secondary"
onClick={() => { onClick={() => {
updateSelectedDay(selectedDay); updateSelectedDay(undefined);
setOpen(false);
}} }}
> >
Apply Reset
</Button> </Button>
</div> </div>
</> </>
@ -321,16 +327,7 @@ function CalendarFilterButton({
if (isMobile) { if (isMobile) {
return ( return (
<Drawer <Drawer>
open={open}
onOpenChange={(open) => {
if (!open) {
setSelectedDay(day);
}
setOpen(open);
}}
>
<DrawerTrigger asChild>{trigger}</DrawerTrigger> <DrawerTrigger asChild>{trigger}</DrawerTrigger>
<DrawerContent>{content}</DrawerContent> <DrawerContent>{content}</DrawerContent>
</Drawer> </Drawer>
@ -338,16 +335,7 @@ function CalendarFilterButton({
} }
return ( return (
<Popover <Popover>
open={open}
onOpenChange={(open) => {
if (!open) {
setSelectedDay(day);
}
setOpen(open);
}}
>
<PopoverTrigger asChild>{trigger}</PopoverTrigger> <PopoverTrigger asChild>{trigger}</PopoverTrigger>
<PopoverContent>{content}</PopoverContent> <PopoverContent>{content}</PopoverContent>
</Popover> </Popover>
@ -433,7 +421,7 @@ function GeneralFilterButton({
))} ))}
</div> </div>
<DropdownMenuSeparator /> <DropdownMenuSeparator />
<div className="flex justify-center items-center"> <div className="flex justify-evenly items-center">
<Button <Button
variant="select" variant="select"
onClick={() => { onClick={() => {
@ -450,6 +438,17 @@ function GeneralFilterButton({
> >
Apply Apply
</Button> </Button>
<Button
variant="secondary"
onClick={() => {
setReviewed(0);
setShowReviewed(undefined);
setCurrentLabels(undefined);
updateLabelFilter(undefined);
}}
>
Reset
</Button>
</div> </div>
</> </>
); );