From a1abaed9b3ca5a651cf84e1411d52ff6d11ecaea Mon Sep 17 00:00:00 2001
From: Nicolas Mowen <nickmowen213@gmail.com>
Date: Tue, 15 Oct 2024 17:32:09 -0600
Subject: [PATCH] Fix scroll

---
 web/src/components/overlay/dialog/PlatformAwareDialog.tsx | 4 +---
 web/src/components/overlay/dialog/SearchFilterDialog.tsx  | 8 ++++++--
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/web/src/components/overlay/dialog/PlatformAwareDialog.tsx b/web/src/components/overlay/dialog/PlatformAwareDialog.tsx
index 56fa7fb33..79ee64f71 100644
--- a/web/src/components/overlay/dialog/PlatformAwareDialog.tsx
+++ b/web/src/components/overlay/dialog/PlatformAwareDialog.tsx
@@ -78,9 +78,7 @@ export function PlatformAwareSheet({
             >
               <MobilePageTitle>More Filters</MobilePageTitle>
             </MobilePageHeader>
-            <div className="scrollbar-container h-full overflow-auto px-4 pb-20">
-              {content}
-            </div>
+            <div className={contentClassName}>{content}</div>
           </MobilePageContent>
         </MobilePage>
       </div>
diff --git a/web/src/components/overlay/dialog/SearchFilterDialog.tsx b/web/src/components/overlay/dialog/SearchFilterDialog.tsx
index 291e8aa5e..9fd66a162 100644
--- a/web/src/components/overlay/dialog/SearchFilterDialog.tsx
+++ b/web/src/components/overlay/dialog/SearchFilterDialog.tsx
@@ -16,13 +16,14 @@ import {
   PopoverContent,
   PopoverTrigger,
 } from "@/components/ui/popover";
-import { isDesktop } from "react-device-detect";
+import { isDesktop, isMobile, isMobileOnly } from "react-device-detect";
 import { useFormattedHour } from "@/hooks/use-date-utils";
 import Heading from "@/components/ui/heading";
 import FilterSwitch from "@/components/filter/FilterSwitch";
 import { Switch } from "@/components/ui/switch";
 import { Label } from "@/components/ui/label";
 import { DropdownMenuSeparator } from "@/components/ui/dropdown-menu";
+import { cn } from "@/lib/utils";
 
 type SearchFilterDialogProps = {
   config?: FrigateConfig;
@@ -116,7 +117,10 @@ export default function SearchFilterDialog({
     <PlatformAwareSheet
       trigger={trigger}
       content={content}
-      contentClassName="w-auto lg:w-[300px]"
+      contentClassName={cn(
+        "w-auto lg:w-[300px] scrollbar-container h-full overflow-auto px-4",
+        isMobileOnly && "pb-20",
+      )}
       open={open}
       onOpenChange={(open) => {
         if (!open) {