Merge branch 'release/v1_33_0-fixes' of github.com:blockscout/frontend into release/v1_33_0-fixes

ui/address/mud/AddressMudTable.tsx

@@ -76,7 +76,7 @@ const AddressMudTable = ({ scrollRef, tableId, isQueryEnabled = true }: Props) =
   }
 
   const filtersTags = hasActiveFilters ? (
-    <HStack gap={ 3 } mb={ 1 }>
+    <HStack gap={ 3 } mb={ 1 } flexWrap="wrap">
       { Object.entries(filters).map(([ key, value ]) => {
         const index = key as FilterKeys === 'filter_key0' ? 0 : 1;
         return (

ui/shared/filters/TableColumnFilterWrapper.tsx

@@ -5,6 +5,7 @@ import {
   useDisclosure,
   IconButton,
   chakra,
+  Portal,
 } from '@chakra-ui/react';
 import React from 'react';
 
@@ -32,7 +33,7 @@ const TableColumnFilterWrapper = ({ columnName, isActive, className, children, i
   );
 
   return (
-    <Popover isOpen={ isOpen } onClose={ onClose } placement="bottom-start" isLazy lazyBehavior="unmount" strategy="fixed">
+    <Popover isOpen={ isOpen } onClose={ onClose } placement="bottom-start" isLazy lazyBehavior="unmount">
       <PopoverTrigger>
         <IconButton
           onClick={ onToggle }
@@ -47,11 +48,13 @@ const TableColumnFilterWrapper = ({ columnName, isActive, className, children, i
           color="text_secondary"
         />
       </PopoverTrigger>
-      <PopoverContent className={ className }>
-        <PopoverBody px={ 4 } py={ 6 } display="flex" flexDir="column" rowGap={ 3 }>
-          { modifiedChildren }
-        </PopoverBody>
-      </PopoverContent>
+      <Portal>
+        <PopoverContent className={ className }>
+          <PopoverBody px={ 4 } py={ 6 } display="flex" flexDir="column" rowGap={ 3 }>
+            { modifiedChildren }
+          </PopoverBody>
+        </PopoverContent>
+      </Portal>
     </Popover>
   );
 };