From 09a019da5dd93882d064fb9b16d0041663ddb059 Mon Sep 17 00:00:00 2001
From: Aditya Pimpalkar <adipimpalkar@gmail.com>
Date: Wed, 26 Jul 2023 01:23:34 +0100
Subject: [PATCH] (fix): Filter/sort button positioning (#928)

---
 .../ui/table/components/EntityTable.tsx       | 38 +++++++++++++------
 1 file changed, 26 insertions(+), 12 deletions(-)

diff --git a/front/src/modules/ui/table/components/EntityTable.tsx b/front/src/modules/ui/table/components/EntityTable.tsx
index 116a912d8..6ed158fba 100644
--- a/front/src/modules/ui/table/components/EntityTable.tsx
+++ b/front/src/modules/ui/table/components/EntityTable.tsx
@@ -72,6 +72,18 @@ const StyledTableWithHeader = styled.div`
   width: 100%;
 `;
 
+const StyledTableContainer = styled.div`
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  overflow: auto;
+`;
+
+const StyledTableWrapper = styled.div`
+  flex: 1;
+  overflow: auto;
+`;
+
 type OwnProps<SortField> = {
   columns: Array<TableColumn>;
   viewName: string;
@@ -109,18 +121,20 @@ export function EntityTable<SortField>({
 
   return (
     <StyledTableWithHeader>
-      <TableHeader
-        viewName={viewName}
-        viewIcon={viewIcon}
-        availableSorts={availableSorts}
-        onSortsUpdate={onSortsUpdate}
-      />
-      <div ref={tableBodyRef}>
-        <StyledTable>
-          <EntityTableHeader columns={columns} />
-          <EntityTableBody columns={columns} />
-        </StyledTable>
-      </div>
+      <StyledTableContainer ref={tableBodyRef}>
+        <TableHeader
+          viewName={viewName}
+          viewIcon={viewIcon}
+          availableSorts={availableSorts}
+          onSortsUpdate={onSortsUpdate}
+        />
+        <StyledTableWrapper>
+          <StyledTable>
+            <EntityTableHeader columns={columns} />
+            <EntityTableBody columns={columns} />
+          </StyledTable>
+        </StyledTableWrapper>
+      </StyledTableContainer>
     </StyledTableWithHeader>
   );
 }