Protei/PromucFlow_constructor
2
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

fix: rest api response box is unreachable via scroll (#29830)

Browse Source 
## Description
Scrollbar of API response is escaping the viewport. This PR fixes the
issue.

#### Media
<img width="872" alt="Screenshot 2023-12-24 at 3 20 21 PM"
src="https://github.com/appsmithorg/appsmith/assets/33133883/4059c3e3-fb7d-4fe5-875d-16cebcede2bd">

Fixes #29534  
_or_  
Fixes `Issue URL`
> [!WARNING]  
> _If no issue exists, please create an issue first, and check with the
maintainers if the issue is valid._

## Automation

/ok-to-test tags="@tag.Datasource"

### 🔍 Cypress test results
<!-- This is an auto-generated comment: Cypress test results  -->
> [!CAUTION]  
> If you modify the content in this section, you are likely to disrupt
the CI result for your PR.

<!-- end of auto-generated comment: Cypress test results  -->

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **Style**
- Improved the visual layout and padding of the `TabPanelWrapper`
component for better readability and user interface experience.
- Updated the layout or styling of the `DebuggerLogs` component to
enhance the user interface.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
Vaibhav Chobisa 2024-04-09 14:07:54 +05:30 committed by GitHub
parent 795b8a3aa1
commit 5870bd399d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 8 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/client/src/components/editorComponents/Debugger/DebuggerLogs.tsx
View File

@ -26,6 +26,7 @@ import { getDebuggerSelectedFilter } from "selectors/debuggerSelectors";
import { setDebuggerSelectedFilter } from "actions/debuggerActions";
export const LIST_HEADER_HEIGHT = "38px";
export const FOOTER_MARGIN = "40px";
const ContainerWrapper = styled.div`
overflow: hidden;

8
app/client/src/components/editorComponents/EntityBottomTabs.tsx
View File

@ -4,7 +4,7 @@ import AnalyticsUtil from "utils/AnalyticsUtil";
import { DEBUGGER_TAB_KEYS } from "./Debugger/helpers";
import { Tab, TabPanel, Tabs, TabsList } from "design-system";
import styled from "styled-components";
import { LIST_HEADER_HEIGHT } from "./Debugger/DebuggerLogs";
import { LIST_HEADER_HEIGHT, FOOTER_MARGIN } from "./Debugger/DebuggerLogs";
const TabPanelWrapper = styled(TabPanel)`
margin-top: 0;
@ -12,6 +12,12 @@ const TabPanelWrapper = styled(TabPanel)`
&.ads-v2-tabs__panel {
overflow: auto;
}
& .t--code-editor-wrapper.codeWrapper {
height: calc(100% - ${FOOTER_MARGIN});
& .CodeMirror-scroll {
box-sizing: border-box;
}
}
`;
const TabsListWrapper = styled(TabsList)`