diff --git a/pkg/interface/src/views/components/Dropdown.tsx b/pkg/interface/src/views/components/Dropdown.tsx
index 7e2a1fb2c..deb3ac96d 100644
--- a/pkg/interface/src/views/components/Dropdown.tsx
+++ b/pkg/interface/src/views/components/Dropdown.tsx
@@ -66,13 +66,19 @@ export function Dropdown(props: DropdownProps) {
     [setOpen, updatePos]
   );
 
-  useEffect(() => {
+  const close = useCallback(() => {
     setOpen(false);
+  },[]);
+
+  useEffect(() => {
+    close();
   }, [pathname]);
 
-  useOutsideClick(dropdownRef, () => {
-    setOpen(false);
-  });
+  useOutsideClick(dropdownRef, close);
+
+  const onOptionsClick = useCallback((e: any) => {
+    e.stopPropagation();
+  }, []);
 
   return (
     <Box flexShrink={props?.flexShrink ? props.flexShrink : 1} position={open ? "relative" : "static"} minWidth='0' width={props?.width ? props.width : 'auto'}>
@@ -85,6 +91,7 @@ export function Dropdown(props: DropdownProps) {
             width={props?.dropWidth || "max-content"}
             {...coords}
             ref={dropdownRef}
+            onClick={onOptionsClick}
           >
             {options}
           </DropdownOptions>