diff --git a/apps/studio/components/grid/components/header/HeaderNew.tsx b/apps/studio/components/grid/components/header/HeaderNew.tsx
index 9d03a76d271..c675bef87f5 100644
--- a/apps/studio/components/grid/components/header/HeaderNew.tsx
+++ b/apps/studio/components/grid/components/header/HeaderNew.tsx
@@ -65,15 +65,20 @@ export const HeaderNew = ({
 
   return (
     <div>
-      <div className="flex h-10 items-center justify-between bg-dash-sidebar dark:bg-surface-100 px-1.5 py-1.5 gap-2 overflow-x-auto ">
+      <div className="flex flex-wrap min-h-10 items-center bg-dash-sidebar dark:bg-surface-100 px-1.5 py-1.5 gap-2">
         {customHeader ? (
           customHeader
         ) : snap.selectedRows.size > 0 ? (
           <RowHeader tableQueriesEnabled={tableQueriesEnabled} />
         ) : (
-          <DefaultHeader tableQueriesEnabled={tableQueriesEnabled} isRefetching={isRefetching} />
+          <div className="flex-1 min-w-[300px] flex items-center gap-2">
+            <FilterPopoverNew isRefetching={isRefetching} />
+          </div>
         )}
-        <div className="flex items-center gap-2">
+        <div className="flex items-center gap-2 overflow-x-auto">
+          {!customHeader && snap.selectedRows.size === 0 && (
+            <SortPopover tableQueriesEnabled={tableQueriesEnabled} />
+          )}
           <GridHeaderActions table={snap.originalTable} isRefetching={isRefetching} />
           {showInsertButton && <InsertButton />}
         </div>
@@ -82,20 +87,6 @@ export const HeaderNew = ({
   )
 }
 
-const DefaultHeader = ({
-  tableQueriesEnabled = true,
-  isRefetching,
-}: Pick<HeaderProps, 'tableQueriesEnabled' | 'isRefetching'>) => {
-  return (
-    <>
-      <div className="flex-1 min-w-0 flex items-center gap-2">
-        <FilterPopoverNew isRefetching={isRefetching} />
-      </div>
-      <SortPopover tableQueriesEnabled={tableQueriesEnabled} />
-    </>
-  )
-}
-
 const InsertButton = () => {
   const { ref: projectRef } = useParams()
   const { data: org } = useSelectedOrganizationQuery()
diff --git a/apps/studio/components/grid/components/header/filter/FilterPopoverNew.tsx b/apps/studio/components/grid/components/header/filter/FilterPopoverNew.tsx
index 9a731fc4edf..58f21498df6 100644
--- a/apps/studio/components/grid/components/header/filter/FilterPopoverNew.tsx
+++ b/apps/studio/components/grid/components/header/filter/FilterPopoverNew.tsx
@@ -207,7 +207,7 @@ export const FilterPopoverNew = ({ isRefetching = false }: FilterPopoverProps) =
         actions={actions}
         isLoading={isGenerating}
         variant="pill"
-        className="bg-transparent border-0"
+        className="bg-transparent border-0 overflow-visible"
         icon={icon}
       />
     </div>
diff --git a/packages/ui-patterns/src/FilterBar/FilterGroup.tsx b/packages/ui-patterns/src/FilterBar/FilterGroup.tsx
index 0e2c1258c6f..c7ed5178693 100644
--- a/packages/ui-patterns/src/FilterBar/FilterGroup.tsx
+++ b/packages/ui-patterns/src/FilterBar/FilterGroup.tsx
@@ -143,7 +143,7 @@ export function FilterGroup({ group, path }: FilterGroupProps) {
     >
       <div
         className={cn(
-          'flex items-stretch',
+          'flex items-stretch flex-wrap',
           isRootGroup ? 'flex-1 min-w-0' : '',
           variant === 'pill' ? 'gap-1' : 'gap-0'
         )}