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

Contain scroll for camera group

Browse Source
This commit is contained in:
Nicolas Mowen 2024-04-29 13:59:00 -06:00
parent 218ec51a78
commit c8fbf6c9d7
1 changed files with 37 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
web/src/components/filter/CameraGroupSelector.tsx
View File

@ -282,7 +282,7 @@ function NewGroupDialog({
}}
>
<Content
className={`min-w-0 ${isMobile ? "w-full p-3 rounded-t-2xl max-h-[90%]" : "w-6/12 max-h-dvh overflow-y-auto"}`}
className={`min-w-0 ${isMobile ? "w-full p-3 rounded-t-2xl max-h-[90%]" : "w-6/12 max-h-dvh overflow-y-hidden"}`}
>
<div className="flex flex-col my-4 overflow-y-auto">
{editState === "none" && (
@ -535,7 +535,10 @@ export function CameraGroupEdit({
return (
<Form {...form}>
<form onSubmit={form.handleSubmit(onSubmit)} className="mt-2 space-y-6">
<form
onSubmit={form.handleSubmit(onSubmit)}
className="mt-2 space-y-6 overflow-y-hidden"
>
<FormField
control={form.control}
name="name"
@ -556,34 +559,38 @@ export function CameraGroupEdit({
/>
<Separator className="flex my-2 bg-secondary" />
<FormField
control={form.control}
name="cameras"
render={({ field }) => (
<FormItem>
<FormLabel>Cameras</FormLabel>
<FormDescription>Select cameras for this group.</FormDescription>
{[
...(birdseyeConfig?.enabled ? ["birdseye"] : []),
...Object.keys(config?.cameras ?? {}),
].map((camera) => (
<FormControl key={camera}>
<FilterSwitch
isChecked={field.value && field.value.includes(camera)}
label={camera.replaceAll("_", " ")}
onCheckedChange={(checked) => {
const updatedCameras = checked
? [...(field.value || []), camera]
: (field.value || []).filter((c) => c !== camera);
form.setValue("cameras", updatedCameras);
}}
/>
</FormControl>
))}
<FormMessage />
</FormItem>
)}
/>
<div className="max-h-[40vh] overflow-y-auto">
<FormField
control={form.control}
name="cameras"
render={({ field }) => (
<FormItem>
<FormLabel>Cameras</FormLabel>
<FormDescription>
Select cameras for this group.
</FormDescription>
{[
...(birdseyeConfig?.enabled ? ["birdseye"] : []),
...Object.keys(config?.cameras ?? {}),
].map((camera) => (
<FormControl key={camera}>
<FilterSwitch
isChecked={field.value && field.value.includes(camera)}
label={camera.replaceAll("_", " ")}
onCheckedChange={(checked) => {
const updatedCameras = checked
? [...(field.value || []), camera]
: (field.value || []).filter((c) => c !== camera);
form.setValue("cameras", updatedCameras);
}}
/>
</FormControl>
))}
<FormMessage />
</FormItem>
)}
/>
</div>
<Separator className="flex my-2 bg-secondary" />
<FormField