fix: account for scrollbar width

appsmithorg · Nov 14, 2024 · c741a2f · c741a2f
1 parent 2ecd266
commit c741a2f
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 2 deletions.
diff --git a/...onEditor/components/PluginActionResponse/components/QueryResponseTab/QueryResponseTab.tsx b/...onEditor/components/PluginActionResponse/components/QueryResponseTab/QueryResponseTab.tsx
@@ -438,7 +438,9 @@ export const QueryResponseTab = (props: Props) => {
                 data={output}
                 responseType={currentContentType}
                 tableBodyHeight={
-                  responseTabHeight + RESPONSE_TABLE_HEIGHT_OFFSET
+                  responseTabHeight +
+                  RESPONSE_TABLE_HEIGHT_OFFSET -
+                  scrollbarOffset
                 }
               />
             </Styled.Response>

diff --git a/.../PluginActionEditor/components/PluginActionResponse/components/QueryResponseTab/styles.ts b/.../PluginActionEditor/components/PluginActionResponse/components/QueryResponseTab/styles.ts
@@ -20,6 +20,8 @@ export const DataContainer = styled.div<{ $height: number }>`
 
 export const Response = styled.div`
   overflow: auto;
+  width: 100%;
+  height: 100%;
 `;
 
 export const StatusBar = styled.div`

diff --git a/app/client/src/PluginActionEditor/components/PluginActionResponse/components/Table.tsx b/app/client/src/PluginActionEditor/components/PluginActionResponse/components/Table.tsx
@@ -43,7 +43,7 @@ export const TableWrapper = styled.div<{ minColumnWidth?: number }>`
   display: flex;
   justify-content: space-between;
   flex-direction: column;
-  overflow: scroll;
+  overflow: auto;
   .tableWrap {
     height: 100%;
     display: block;