remove swap settings change

Author: cpcramer

src/swap/components/SwapSettings.tsx

@@ -1,8 +1,8 @@
 import { useCallback, useRef, useState } from 'react';
 import { useIcon } from '../../core-react/internal/hooks/useIcon';
-import { Popover } from '../../internal/primitives/Popover';
 import { background, border, cn, pressable, text } from '../../styles/theme';
 import { useBreakpoints } from '../../ui/react/internal/hooks/useBreakpoints';
+import { useOutsideClick } from '../../ui/react/internal/hooks/useOutsideClick';
 import type { SwapSettingsReact } from '../types';
 import { SwapSettingsSlippageLayout } from './SwapSettingsSlippageLayout';
 import { SwapSettingsSlippageLayoutBottomSheet } from './SwapSettingsSlippageLayoutBottomSheet';
@@ -17,11 +17,14 @@ export function SwapSettings({
   const [isOpen, setIsOpen] = useState(false);
   const dropdownRef = useRef<HTMLDivElement>(null);
 
-  const handleToggle = useCallback((e: React.MouseEvent) => {
-    e.stopPropagation();
+  const handleToggle = useCallback(() => {
     setIsOpen((prev) => !prev);
   }, []);
 
+  useOutsideClick(dropdownRef, () => {
+    setIsOpen(false);
+  });
+
   const iconSvg = useIcon({ icon });
 
   return (
@@ -61,28 +64,7 @@ export function SwapSettings({
             </SwapSettingsSlippageLayoutBottomSheet>
           </div>
         ) : (
-          // isOpen && (
-          //   <div
-          //     className={cn(
-          //       border.radius,
-          //       background.default,
-          //       pressable.shadow,
-          //       'absolute right-0 z-10 mt-1 w-[21.75rem] rounded-lg',
-          //     )}
-          //     data-testid="ockSwapSettingsDropdown"
-          //   >
-          //     <SwapSettingsSlippageLayout>
-          //       {children}
-          //     </SwapSettingsSlippageLayout>
-          //   </div>
-          // )
-          <Popover
-            isOpen={isOpen}
-            onClose={() => setIsOpen(false)}
-            anchorEl={dropdownRef.current}
-            position="bottom"
-            align="end"
-          >
+          isOpen && (
             <div
               className={cn(
                 border.radius,
@@ -96,7 +78,7 @@ export function SwapSettings({
                 {children}
               </SwapSettingsSlippageLayout>
             </div>
-          </Popover>
+          )
         )}
       </div>
     </div>