From 7dcd47ce9560430244450cae80bfee441365f10b Mon Sep 17 00:00:00 2001
From: shivani170 <shivani@devtron.ai>
Date: Mon, 13 Jan 2025 18:45:10 +0530
Subject: [PATCH 01/14] chore: scroll component fix

---
 src/components/app/details/AboutTagEditModal.tsx              | 2 +-
 .../app/details/appDetails/DeploymentStatusDetailModal.tsx    | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/app/details/AboutTagEditModal.tsx b/src/components/app/details/AboutTagEditModal.tsx
index 384862fe3d..79dcf97a5c 100644
--- a/src/components/app/details/AboutTagEditModal.tsx
+++ b/src/components/app/details/AboutTagEditModal.tsx
@@ -132,7 +132,7 @@ export default function AboutTagEditModal({
         return (
             <>
                 <div
-                    className="cn-7 p-20 dc__overflow-scroll"
+                    className="cn-7 p-20 dc__overflow-auto"
                     data-testid="tag-input-form"
                     style={{ height: 'calc(100vh - 122px)' }}
                 >
diff --git a/src/components/app/details/appDetails/DeploymentStatusDetailModal.tsx b/src/components/app/details/appDetails/DeploymentStatusDetailModal.tsx
index da91217cd5..c599f0c09b 100644
--- a/src/components/app/details/appDetails/DeploymentStatusDetailModal.tsx
+++ b/src/components/app/details/appDetails/DeploymentStatusDetailModal.tsx
@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import React, { useEffect, useRef } from 'react'
+import { useEffect, useRef } from 'react'
 import { useHistory } from 'react-router-dom'
 import { ReactComponent as Close } from '../../../../assets/icons/ic-close.svg'
 import { DeploymentStatusDetailModalType } from './appDetails.type'
@@ -101,7 +101,7 @@ export default function DeploymentStatusDetailModal({
                         </span>
                     </div>
                 </div>
-                <div className="bcn-1 dc__overflow-scroll pb-20 deployment-status-breakdown">
+                <div className="bcn-1 dc__overflow-auto pb-20 deployment-status-breakdown">
                     {isLoading ? (
                         <Progressing />
                     ) : (

From 7495b60e36c2f54821358dbbcf3155e8343aebf0 Mon Sep 17 00:00:00 2001
From: shivani170 <shivani@devtron.ai>
Date: Tue, 14 Jan 2025 15:05:20 +0530
Subject: [PATCH 02/14] chore: application overflow scroll converted to auto

---
 .../DevtronApps/Details/AppConfigurations/AppConfig.tsx   | 2 +-
 .../AppConfigurations/MainContent/ConfigDryRun.tsx        | 2 +-
 .../MainContent/DeploymentTemplate/DeploymentTemplate.tsx | 8 ++++----
 .../DeploymentTemplate/DeploymentTemplateForm.tsx         | 8 ++++----
 .../DeploymentTemplate/GUIView/GUIView.component.tsx      | 2 +-
 .../__test__/EnvironmentOverview.test.tsx                 | 2 +-
 .../List/__tests__/EnvironmentListView.test.tsx           | 4 ++--
 .../CreatePluginModal/CreatePluginFormContent.tsx         | 4 ++--
 .../CreatePluginModal/CreatePluginModal.component.tsx     | 2 +-
 src/components/CIPipelineN/PreBuild.tsx                   | 4 ++--
 src/components/CIPipelineN/TaskDetailComponent.tsx        | 2 +-
 src/components/app/details/cIDetails/CIDetails.tsx        | 2 +-
 src/components/app/details/cdDetails/CDDetails.tsx        | 2 +-
 src/components/app/details/main.tsx                       | 2 +-
 .../app/details/triggerView/BranchRegexModal.tsx          | 2 +-
 .../app/details/triggerView/CiWebhookDebuggingModal.tsx   | 2 +-
 src/components/app/details/triggerView/MaterialSource.tsx | 2 +-
 src/components/app/details/triggerView/cdMaterial.tsx     | 8 ++++----
 .../app/details/triggerView/workflow/Workflow.tsx         | 2 +-
 src/components/app/list-new/AppList.tsx                   | 2 +-
 src/components/app/list/TriggerUrl.tsx                    | 2 +-
 src/components/ciPipeline/ciPipeline.scss                 | 2 +-
 src/components/common/Description/GenericDescription.tsx  | 2 +-
 src/components/workflowEditor/Workflow.tsx                | 2 +-
 src/css/base.scss                                         | 4 ----
 25 files changed, 36 insertions(+), 40 deletions(-)

diff --git a/src/Pages/Applications/DevtronApps/Details/AppConfigurations/AppConfig.tsx b/src/Pages/Applications/DevtronApps/Details/AppConfigurations/AppConfig.tsx
index 4ef57fdcae..60cb89c957 100644
--- a/src/Pages/Applications/DevtronApps/Details/AppConfigurations/AppConfig.tsx
+++ b/src/Pages/Applications/DevtronApps/Details/AppConfigurations/AppConfig.tsx
@@ -500,7 +500,7 @@ export const AppConfig = ({ appName, resourceKind, filteredEnvIds }: AppConfigPr
             <>
                 <div className={`app-compose ${getAdditionalParentClass()}`}>
                     <div
-                        className={`app-compose__nav ${getAppComposeClasses()} flex column left top dc__overflow-scroll`}
+                        className={`app-compose__nav ${getAppComposeClasses()} flex column left top dc__overflow-auto`}
                     >
                         <AppNavigation />
                     </div>
diff --git a/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/ConfigDryRun.tsx b/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/ConfigDryRun.tsx
index 992adb2483..8c9897b17d 100644
--- a/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/ConfigDryRun.tsx
+++ b/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/ConfigDryRun.tsx
@@ -91,7 +91,7 @@ const ConfigDryRun = ({
     }
 
     return (
-        <div className={`dc__overflow-scroll ${showManifest ? 'dc__grid-half h-100' : 'flexbox-col w-100 h-100'}`}>
+        <div className={`dc__overflow-auto ${showManifest ? 'dc__grid-half h-100' : 'flexbox-col w-100 h-100'}`}>
             <div className="flexbox-col">
                 <div className="py-6 px-12 flexbox dc__content-space dc__border-bottom-n1">
                     <div className="flexbox dc__gap-8 dc__align-items-center">
diff --git a/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/DeploymentTemplate.tsx b/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/DeploymentTemplate.tsx
index 5a973adbb7..3d155bcc30 100644
--- a/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/DeploymentTemplate.tsx
+++ b/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/DeploymentTemplate.tsx
@@ -1497,7 +1497,7 @@ const DeploymentTemplate = ({
     const renderEditorComponent = () => {
         if (isResolvingVariables || isLoadingChangedChartDetails || !!isLoadingMergedTemplate) {
             return (
-                <div className="flex h-100 flex-grow-1 dc__overflow-scroll">
+                <div className="flex h-100 flex-grow-1 dc__overflow-auto">
                     <Progressing pageLoader />
                 </div>
             )
@@ -1527,7 +1527,7 @@ const DeploymentTemplate = ({
         if (isCompareView) {
             return (
                 <CompareConfigView
-                    className="flex-grow-1 dc__overflow-scroll"
+                    className="flex-grow-1 dc__overflow-auto"
                     compareFromSelectedOptionValue={compareFromSelectedOptionValue}
                     handleCompareFromOptionSelection={handleCompareFromOptionSelection}
                     isApprovalView={isApprovalView}
@@ -1693,7 +1693,7 @@ const DeploymentTemplate = ({
     }
 
     const renderValuesView = () => (
-        <div className="flexbox-col flex-grow-1 dc__overflow-scroll">
+        <div className="flexbox-col flex-grow-1 dc__overflow-auto">
             {window._env_.ENABLE_SCOPED_VARIABLES && (
                 <div className="app-config-variable-widget-position">
                     <FloatingVariablesSuggestions
@@ -1827,7 +1827,7 @@ const DeploymentTemplate = ({
         }
 
         return (
-            <div className="dc__border br-4 m-8 flexbox-col dc__content-space flex-grow-1 dc__overflow-scroll bg__primary">
+            <div className="dc__border br-4 m-8 flexbox-col dc__content-space flex-grow-1 dc__overflow-auto bg__primary">
                 {renderBody()}
 
                 {showDeleteOverrideDialog && (
diff --git a/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/DeploymentTemplateForm.tsx b/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/DeploymentTemplateForm.tsx
index fe24c335cb..96094fe395 100644
--- a/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/DeploymentTemplateForm.tsx
+++ b/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/DeploymentTemplateForm.tsx
@@ -87,19 +87,19 @@ const DeploymentTemplateForm = ({
     }
 
     return (
-        <div className={`dc__overflow-scroll flex-grow-1 ${showReadMe ? 'dc__grid-half' : 'flexbox-col'}`}>
+        <div className={`dc__overflow-auto flex-grow-1 ${showReadMe ? 'dc__grid-half' : 'flexbox-col'}`}>
             {showReadMe && (
-                <div className="flexbox-col dc__border-right dc__overflow-scroll">
+                <div className="flexbox-col dc__border-right dc__overflow-auto">
                     <div className="flexbox dc__gap-8 bg__primary px-12 py-6 dc__border-bottom-n1 flex left py-6">
                         <ICBookOpen className="icon-dim-16 dc__no-shrink scn-9" />
                         <span className="fs-12 fw-6 cn-9 lh-20">{`Readme ${selectedChart ? `(v${selectedChart.version})` : ''}`}</span>
                     </div>
 
-                    <MarkDown markdown={readMe} className="dc__overflow-scroll" />
+                    <MarkDown markdown={readMe} className="dc__overflow-auto" />
                 </div>
             )}
 
-            <div className="flexbox-col dc__overflow-scroll flex-grow-1">
+            <div className="flexbox-col dc__overflow-auto flex-grow-1">
                 <CodeEditor
                     value={editedDocument}
                     schemaURI={getEditorSchemaURIFromChartNameAndVersion(selectedChart?.name, selectedChart?.version)}
diff --git a/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/GUIView/GUIView.component.tsx b/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/GUIView/GUIView.component.tsx
index e6d5107156..ec7a5e0b6e 100644
--- a/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/GUIView/GUIView.component.tsx
+++ b/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/GUIView/GUIView.component.tsx
@@ -189,7 +189,7 @@ const GUIView = ({
         }
 
         return (
-            <div className="dc__overflow-scroll">
+            <div className="dc__overflow-auto">
                 <RJSFForm
                     schema={state.guiSchema}
                     className={!modelRef.current ? 'dc__mxw-960' : ''}
diff --git a/src/components/ApplicationGroup/Details/EnvironmentOverview/__test__/EnvironmentOverview.test.tsx b/src/components/ApplicationGroup/Details/EnvironmentOverview/__test__/EnvironmentOverview.test.tsx
index e288684c6b..806bfcec63 100644
--- a/src/components/ApplicationGroup/Details/EnvironmentOverview/__test__/EnvironmentOverview.test.tsx
+++ b/src/components/ApplicationGroup/Details/EnvironmentOverview/__test__/EnvironmentOverview.test.tsx
@@ -64,7 +64,7 @@ describe('EnvironmentOverview', () => {
         expect(component.getByText('devtron-ns')).toBeInTheDocument()
         expect(component.getByText('default_cluster')).toBeInTheDocument()
         //right side component
-        const rightInfoComponent = component.container.querySelector('.dc__overflow-scroll')
+        const rightInfoComponent = component.container.querySelector('.dc__overflow-auto')
         expect(rightInfoComponent).toBeInTheDocument()
         const infoRightRowComponent = rightInfoComponent.querySelector('.app-deployments-info-body')
         expect(infoRightRowComponent).toBeInTheDocument()
diff --git a/src/components/ApplicationGroup/List/__tests__/EnvironmentListView.test.tsx b/src/components/ApplicationGroup/List/__tests__/EnvironmentListView.test.tsx
index fbe85a03d5..093239ee10 100644
--- a/src/components/ApplicationGroup/List/__tests__/EnvironmentListView.test.tsx
+++ b/src/components/ApplicationGroup/List/__tests__/EnvironmentListView.test.tsx
@@ -33,7 +33,7 @@ describe('EnvironmentList', () => {
         const appGroupLoaderContainer = container.querySelector('.flex.dc__border-top-n1')
         expect(appGroupLoaderContainer).toBeInTheDocument()
 
-        const appGroupListContainer = container.querySelector('.dc__overflow-scroll')
+        const appGroupListContainer = container.querySelector('.dc__overflow-auto')
         expect(appGroupListContainer).not.toBeInTheDocument()
     })
 
@@ -47,7 +47,7 @@ describe('EnvironmentList', () => {
         })
 
         expect(component.container).toBeInTheDocument()
-        const appGroupListContainer = component.container.querySelector('.dc__overflow-scroll')
+        const appGroupListContainer = component.container.querySelector('.dc__overflow-auto')
         expect(appGroupListContainer).toBeInTheDocument()
         expect(component.getAllByText('a')[0]).toBeInTheDocument()
         expect(component.getByText('shubham')).toBeInTheDocument()
diff --git a/src/components/CIPipelineN/CreatePluginModal/CreatePluginFormContent.tsx b/src/components/CIPipelineN/CreatePluginModal/CreatePluginFormContent.tsx
index 6868eb1464..b1cbcb9444 100644
--- a/src/components/CIPipelineN/CreatePluginModal/CreatePluginFormContent.tsx
+++ b/src/components/CIPipelineN/CreatePluginModal/CreatePluginFormContent.tsx
@@ -146,7 +146,7 @@ const CreatePluginFormContent = ({
     }
 
     const renderExistingPluginVersionList = () => (
-        <div className="flexbox-col dc__gap-4 p-12 mxh-350 dc__overflow-scroll">
+        <div className="flexbox-col dc__gap-4 p-12 mxh-350 dc__overflow-auto">
             {selectedPluginVersions.map((version) => (
                 <div className="flexbox dc__align-items-center dc__gap-4" key={version}>
                     <ICTag className="icon-dim-16 dc__no-shrink" />
@@ -191,7 +191,7 @@ const CreatePluginFormContent = ({
     const showPluginDetailFields = currentTab !== CreatePluginFormViewType.EXISTING_PLUGIN || !!name
 
     return (
-        <div className="flexbox-col flex-grow-1 dc__overflow-scroll p-20 dc__gap-16">
+        <div className="flexbox-col flex-grow-1 dc__overflow-auto p-20 dc__gap-16">
             <StyledRadioGroup
                 className="gui-yaml-switch dc__no-shrink dc__content-start"
                 onChange={handleTabChange}
diff --git a/src/components/CIPipelineN/CreatePluginModal/CreatePluginModal.component.tsx b/src/components/CIPipelineN/CreatePluginModal/CreatePluginModal.component.tsx
index e5add98d85..40e6662488 100644
--- a/src/components/CIPipelineN/CreatePluginModal/CreatePluginModal.component.tsx
+++ b/src/components/CIPipelineN/CreatePluginModal/CreatePluginModal.component.tsx
@@ -401,7 +401,7 @@ const CreatePluginModal = ({ handleClose }: CreatePluginModalProps) => {
                 className="bg__primary dc__position-fixed dc__right-0 dc__top-0 h-100 flexbox-col dc__content-space w-800"
                 onClick={stopPropagation}
             >
-                <div className="flexbox-col flex-grow-1 dc__overflow-scroll">
+                <div className="flexbox-col flex-grow-1 dc__overflow-auto">
                     <div className="py-12 px-20 flexbox dc__content-space dc__border-bottom">
                         <h2 className="m-0 cn-9 fs-16 fw-6 lh-24">Save as plugin</h2>
 
diff --git a/src/components/CIPipelineN/PreBuild.tsx b/src/components/CIPipelineN/PreBuild.tsx
index 8f82c5fe5b..2f90c7f8e8 100644
--- a/src/components/CIPipelineN/PreBuild.tsx
+++ b/src/components/CIPipelineN/PreBuild.tsx
@@ -144,7 +144,7 @@ export const PreBuild: React.FC<PreBuildType> = ({ isJobView }) => {
 
     function renderPluginList(): JSX.Element {
         return (
-            <div className="px-20 pb-20 dc__overflow-scroll flexbox-col">
+            <div className="px-20 pb-20 dc__overflow-auto flexbox-col">
                 <div className="cn-9 fw-6 fs-14 pb-10 pt-20">What do you want this task to do?</div>
                 <div onClick={() => setPluginType(PluginType.INLINE, 0)}>
                     <CustomScriptCard />
@@ -203,7 +203,7 @@ export const PreBuild: React.FC<PreBuildType> = ({ isJobView }) => {
         }
 
         return (
-            <div className="flexbox-col flex-grow-1 dc__overflow-scroll">
+            <div className="flexbox-col flex-grow-1 dc__overflow-auto">
                 <TaskDetailComponent />
             </div>
         )
diff --git a/src/components/CIPipelineN/TaskDetailComponent.tsx b/src/components/CIPipelineN/TaskDetailComponent.tsx
index 2ec2787908..a71718945e 100644
--- a/src/components/CIPipelineN/TaskDetailComponent.tsx
+++ b/src/components/CIPipelineN/TaskDetailComponent.tsx
@@ -201,7 +201,7 @@ export const TaskDetailComponent = () => {
         <>
             <PluginDetailHeader handlePluginVersionChange={handlePluginVersionChange} />
 
-            <div className="p-20 dc__overflow-scroll">
+            <div className="p-20 dc__overflow-auto">
                 <div>
                     <div className="row-container mb-12">
                         <div className="fw-6 fs-13 lh-32 cn-7 dc__required-field">Task name</div>
diff --git a/src/components/app/details/cIDetails/CIDetails.tsx b/src/components/app/details/cIDetails/CIDetails.tsx
index 4d0e27b17c..eccf6341db 100644
--- a/src/components/app/details/cIDetails/CIDetails.tsx
+++ b/src/components/app/details/cIDetails/CIDetails.tsx
@@ -243,7 +243,7 @@ export default function CIDetails({ isJobView, filteredEnvIds }: { isJobView?: b
                 </div>
             )}
             <div className="ci-details__body">
-                <div className="flexbox-col flex-grow-1 dc__overflow-scroll" ref={scrollableParentRef}>
+                <div className="flexbox-col flex-grow-1 dc__overflow-auto" ref={scrollableParentRef}>
                     {!pipelineId ? (
                         // Empty state if there is no pipeline
                         <GenericEmptyState
diff --git a/src/components/app/details/cdDetails/CDDetails.tsx b/src/components/app/details/cdDetails/CDDetails.tsx
index 41609fcc7a..5ec74d1ea3 100644
--- a/src/components/app/details/cdDetails/CDDetails.tsx
+++ b/src/components/app/details/cdDetails/CDDetails.tsx
@@ -307,7 +307,7 @@ export default function CDDetails({ filteredEnvIds }: { filteredEnvIds: string }
                 </div>
             )}
             <div className="ci-details__body">
-                <div className="flexbox-col flex-grow-1 dc__overflow-scroll h-100" ref={scrollableRef}>
+                <div className="flexbox-col flex-grow-1 dc__overflow-auto h-100" ref={scrollableRef}>
                     {triggerHistory.size > 0 || fetchTriggerIdData ? (
                         <Route
                             path={`${path
diff --git a/src/components/app/details/main.tsx b/src/components/app/details/main.tsx
index 60a4e2a7f8..b871129be0 100644
--- a/src/components/app/details/main.tsx
+++ b/src/components/app/details/main.tsx
@@ -343,7 +343,7 @@ export default function AppDetailsPage({ isV2 }: AppDetailsProps) {
 
     const _filteredEnvIds = selectedAppList.length > 0 ? selectedAppList.map((app) => +app.value).join(',') : null
     return (
-        <div className="app-details-page dc__overflow-scroll">
+        <div className="app-details-page dc__overflow-auto">
             {!isV2 && (
                 <AppHeader
                     appName={appName}
diff --git a/src/components/app/details/triggerView/BranchRegexModal.tsx b/src/components/app/details/triggerView/BranchRegexModal.tsx
index ac824e6b94..cb569f3ab0 100644
--- a/src/components/app/details/triggerView/BranchRegexModal.tsx
+++ b/src/components/app/details/triggerView/BranchRegexModal.tsx
@@ -105,7 +105,7 @@ const BranchRegexModal = ({
     }
 
     const renderBranchRegexContent = () => (
-        <div className="ci-trigger__branch-regex-wrapper px-20 fs-13 dc__overflow-scroll mxh-500 mh-200">
+        <div className="ci-trigger__branch-regex-wrapper px-20 fs-13 dc__overflow-auto mxh-500 mh-200">
             <div className="bcn-2 flexbox-col dc__gap-1">
                 {material.map((mat, index) => {
                     const _regexValue = regexValue[mat.gitMaterialId] || {}
diff --git a/src/components/app/details/triggerView/CiWebhookDebuggingModal.tsx b/src/components/app/details/triggerView/CiWebhookDebuggingModal.tsx
index e2841cbced..a0e70b4ebd 100644
--- a/src/components/app/details/triggerView/CiWebhookDebuggingModal.tsx
+++ b/src/components/app/details/triggerView/CiWebhookDebuggingModal.tsx
@@ -257,7 +257,7 @@ export const CiWebhookModal = ({
     )
 
     const renderTimeStampDetailedDescription = () => (
-        <div className="flex column top dc__gap-16 h-100 dc__overflow-scroll">
+        <div className="flex column top dc__gap-16 h-100 dc__overflow-auto">
             <div className="flex column py-16 px-20 w-100 dc__gap-16">
                 {renderFilterTable()}
                 <div className="expand-incoming-payload  w-100 pb-20">{renderReceivedPayloadCodeEditor()}</div>
diff --git a/src/components/app/details/triggerView/MaterialSource.tsx b/src/components/app/details/triggerView/MaterialSource.tsx
index 5e90bf8706..45291b9f97 100644
--- a/src/components/app/details/triggerView/MaterialSource.tsx
+++ b/src/components/app/details/triggerView/MaterialSource.tsx
@@ -97,7 +97,7 @@ export default function MaterialSource({
 
     return (
         <div
-            className="select-material--trigger-view__sidebar dc__overflow-scroll"
+            className="select-material--trigger-view__sidebar dc__overflow-auto"
             style={{ height: fromTriggerInfo ? '100%' : 'calc(100% - 44px)' }}
         >
             {material.map((mat, index) => {
diff --git a/src/components/app/details/triggerView/cdMaterial.tsx b/src/components/app/details/triggerView/cdMaterial.tsx
index 68a11d6aab..a554658545 100644
--- a/src/components/app/details/triggerView/cdMaterial.tsx
+++ b/src/components/app/details/triggerView/cdMaterial.tsx
@@ -1466,7 +1466,7 @@ const CDMaterial = ({
     )
 
     const renderMaterialListBodyWrapper = (children: JSX.Element) => (
-        <div className="flexbox-col py-16 px-20 dc__overflow-scroll">{children}</div>
+        <div className="flexbox-col py-16 px-20 dc__overflow-auto">{children}</div>
     )
 
     const renderRuntimeParamsSidebar = (areTabsDisabled: boolean = false) => {
@@ -1511,7 +1511,7 @@ const CDMaterial = ({
 
         return (
             <div
-                className={`flex-grow-1 dc__overflow-scroll ${isPreOrPostCD && !isFromBulkCD ? 'display-grid cd-material__container-with-sidebar' : 'flexbox-col py-16 px-20'}`}
+                className={`flex-grow-1 dc__overflow-auto ${isPreOrPostCD && !isFromBulkCD ? 'display-grid cd-material__container-with-sidebar' : 'flexbox-col py-16 px-20'}`}
             >
                 {renderRuntimeParamsSidebar()}
 
@@ -1906,11 +1906,11 @@ const CDMaterial = ({
                 )}
 
                 <div
-                    className={`flexbox-col h-100 dc__overflow-scroll ${isPreOrPostCD && !isFromBulkCD ? 'display-grid cd-material__container-with-sidebar' : ''}`}
+                    className={`flexbox-col h-100 dc__overflow-auto ${isPreOrPostCD && !isFromBulkCD ? 'display-grid cd-material__container-with-sidebar' : ''}`}
                 >
                     {renderRuntimeParamsSidebar(true)}
 
-                    <div className="flexbox-col dc__overflow-scroll dc__gap-12 dc__align-items-center h-100 w-100 pl-20 pr-20">
+                    <div className="flexbox-col dc__overflow-auto dc__gap-12 dc__align-items-center h-100 w-100 pl-20 pr-20">
                         <div className="flexbox dc__align-items-center dc__content-space pt-20 pb-16 w-100">
                             <div className="shimmer-loading" style={{ width: '100px', height: '20px' }} />
                         </div>
diff --git a/src/components/app/details/triggerView/workflow/Workflow.tsx b/src/components/app/details/triggerView/workflow/Workflow.tsx
index f0bd05c52d..bbeb629d71 100644
--- a/src/components/app/details/triggerView/workflow/Workflow.tsx
+++ b/src/components/app/details/triggerView/workflow/Workflow.tsx
@@ -403,7 +403,7 @@ export class Workflow extends Component<WorkflowProps> {
                 </div>
                 {isExternalCiWorkflow && <DeprecatedPipelineWarning />}
                 <div
-                    className={`workflow__body bg__secondary dc__overflow-scroll dc__border-n1 br-4 ${this.props.isSelected ? 'eb-2' : ''}`}
+                    className={`workflow__body bg__secondary dc__overflow-auto dc__border-n1 br-4 ${this.props.isSelected ? 'eb-2' : ''}`}
                 >
                     <svg x={this.props.startX} y={0} height={this.props.height} width={this.props.width}>
                         {this.renderEdgeList()}
diff --git a/src/components/app/list-new/AppList.tsx b/src/components/app/list-new/AppList.tsx
index 3cc9a544ba..46a989e652 100644
--- a/src/components/app/list-new/AppList.tsx
+++ b/src/components/app/list-new/AppList.tsx
@@ -419,7 +419,7 @@ const AppList = ({ isArgoInstalled }: AppListPropType) => {
     }
 
     return (
-        <div className="flexbox-col h-100 dc__overflow-scroll">
+        <div className="flexbox-col h-100 dc__overflow-auto">
             <HeaderWithCreateButton headerName="Applications" />
             <AppListFilters
                 filterConfig={filterConfig}
diff --git a/src/components/app/list/TriggerUrl.tsx b/src/components/app/list/TriggerUrl.tsx
index 47125ba316..676a7a4a50 100644
--- a/src/components/app/list/TriggerUrl.tsx
+++ b/src/components/app/list/TriggerUrl.tsx
@@ -92,7 +92,7 @@ export const TriggerUrlModal = ({ appId, envId, installedAppId, isExternalApp, c
                     </button>
                 </div>
 
-                <div className="dc__overflow-scroll" style={{ height: 'calc(100% - 67px)' }}>
+                <div className="dc__overflow-auto" style={{ height: 'calc(100% - 67px)' }}>
                     {loading ? (
                         <Progressing pageLoader />
                     ) : Object.values(data).every((value) => !value.length) ? (
diff --git a/src/components/ciPipeline/ciPipeline.scss b/src/components/ciPipeline/ciPipeline.scss
index b3b35e0051..8292063412 100644
--- a/src/components/ciPipeline/ciPipeline.scss
+++ b/src/components/ciPipeline/ciPipeline.scss
@@ -199,7 +199,7 @@
 
 .ci-webhook-condition {
     display: grid;
-    grid-template-columns: 200px 500px 30px;
+    grid-template-columns: 200px 1fr 30px;
     gap: 16px;
 }
 
diff --git a/src/components/common/Description/GenericDescription.tsx b/src/components/common/Description/GenericDescription.tsx
index ea212ab7a7..588e1c6f15 100644
--- a/src/components/common/Description/GenericDescription.tsx
+++ b/src/components/common/Description/GenericDescription.tsx
@@ -339,7 +339,7 @@ export default function GenericDescription({
     }
 
     return (
-        <div className={`cluster__body-details ${initialEditDescriptionView ? 'pb-16 dc__overflow-scroll' : ''}`}>
+        <div className={`cluster__body-details ${initialEditDescriptionView ? 'pb-16 dc__overflow-auto' : ''}`}>
             <div
                 data-testid="cluster-note-wrapper"
                 className={!isEditDescriptionView ? 'dc__overflow-auto' : 'dc__overflow-hidden'}
diff --git a/src/components/workflowEditor/Workflow.tsx b/src/components/workflowEditor/Workflow.tsx
index 169ca2b0c4..7c11dfbdd6 100644
--- a/src/components/workflowEditor/Workflow.tsx
+++ b/src/components/workflowEditor/Workflow.tsx
@@ -867,7 +867,7 @@ export class Workflow extends Component<WorkflowProps, WorkflowState> {
                         className={
                             configDiffView
                                 ? 'workflow__body'
-                                : 'workflow__body dc__border-n1 bg__secondary dc__overflow-scroll br-4'
+                                : 'workflow__body dc__border-n1 bg__secondary dc__overflow-auto br-4'
                         }
                     >
                         {nodesWithBufferHeight.length === 0 && this.props.isJobView ? (
diff --git a/src/css/base.scss b/src/css/base.scss
index 8b7c0f9b46..7404340989 100644
--- a/src/css/base.scss
+++ b/src/css/base.scss
@@ -4114,10 +4114,6 @@ textarea {
     overflow: auto !important;
 }
 
-.dc__overflow-y-auto {
-    overflow: auto !important;
-}
-
 .dc__overflow-scroll {
     overflow: scroll !important;
 }

From 1b09e147129df1951b50d83163bbc134a41a41dd Mon Sep 17 00:00:00 2001
From: shivani170 <shivani@devtron.ai>
Date: Wed, 15 Jan 2025 08:05:50 +0530
Subject: [PATCH 03/14] chore: App group overflow scroll replaced to auto

---
 .../Authorization/APITokens/APITokenList.tsx                | 2 +-
 .../Shared/LinkedCIDetailsModal/LinkedCIDetailsModal.tsx    | 2 +-
 .../ApplicationGroup/Details/EnvCDDetails/EnvCDDetails.tsx  | 2 +-
 .../ApplicationGroup/Details/EnvCIDetails/EnvCIDetails.tsx  | 2 +-
 .../ApplicationGroup/List/EnvironmentListView.tsx           | 2 +-
 src/components/ApplicationGroup/List/EnvironmentsList.tsx   | 2 +-
 src/components/ClusterNodes/ClusterOverview.tsx             | 4 ++--
 src/components/charts/list/ChartListPopUp.tsx               | 2 +-
 src/components/ciConfig/CIConfigDiffView.tsx                | 2 +-
 .../common/FloatingVariablesSuggestions/Suggestions.tsx     | 6 +++---
 src/components/externalLinks/ExternalLinks.tsx              | 2 +-
 .../globalConfigurations/globalConfigurations.scss          | 4 ++--
 src/components/notifications/WebhookConfigModal.tsx         | 2 +-
 13 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/src/Pages/GlobalConfigurations/Authorization/APITokens/APITokenList.tsx b/src/Pages/GlobalConfigurations/Authorization/APITokens/APITokenList.tsx
index 85cfcd254e..124dd0fe60 100644
--- a/src/Pages/GlobalConfigurations/Authorization/APITokens/APITokenList.tsx
+++ b/src/Pages/GlobalConfigurations/Authorization/APITokens/APITokenList.tsx
@@ -88,7 +88,7 @@ const APITokenList = ({ tokenList, renderSearchToken, reload }: APITokenListType
                     <div>Expires on</div>
                     <div />
                 </div>
-                <div className="dc__overflow-scroll api__list__height dc__position-rel">
+                <div className="dc__overflow-auto api__list__height dc__position-rel">
                     {!tokenList || tokenList.length === 0
                         ? noMatchingResults()
                         : tokenList.map((list, index) => (
diff --git a/src/Pages/Shared/LinkedCIDetailsModal/LinkedCIDetailsModal.tsx b/src/Pages/Shared/LinkedCIDetailsModal/LinkedCIDetailsModal.tsx
index 4064b82c13..f0664c2dc8 100644
--- a/src/Pages/Shared/LinkedCIDetailsModal/LinkedCIDetailsModal.tsx
+++ b/src/Pages/Shared/LinkedCIDetailsModal/LinkedCIDetailsModal.tsx
@@ -156,7 +156,7 @@ const LinkedCIDetailsModal = ({ handleClose, workflows }: LinkedCIDetailModalPro
 
     return (
         <div className="bg__primary h-100 flexbox-col show-shimmer-loading">
-            <div className="flexbox-col flex-grow-1 dc__overflow-scroll">
+            <div className="flexbox-col flex-grow-1 dc__overflow-auto">
                 <div className="dc__position-sticky dc__top-0 bg__primary dc__zi-20">
                     <div className="flex flex-justify dc__border-bottom pt-10 pr-20 pb-10 pl-20">
                         <h2 className="fs-16 fw-6 lh-24 m-0 dc__ellipsis-right">{ciPipelineName}</h2>
diff --git a/src/components/ApplicationGroup/Details/EnvCDDetails/EnvCDDetails.tsx b/src/components/ApplicationGroup/Details/EnvCDDetails/EnvCDDetails.tsx
index f12c09372d..57e6113942 100644
--- a/src/components/ApplicationGroup/Details/EnvCDDetails/EnvCDDetails.tsx
+++ b/src/components/ApplicationGroup/Details/EnvCDDetails/EnvCDDetails.tsx
@@ -312,7 +312,7 @@ export default function EnvCDDetails({ filteredAppIds }: AppGroupDetailDefaultTy
                 </div>
             )}
             <div className="ci-details__body">
-                <div className="flexbox-col flex-grow-1 dc__overflow-scroll h-100" ref={scrollableRef}>
+                <div className="flexbox-col flex-grow-1 dc__overflow-auto h-100" ref={scrollableRef}>
                     {renderDetail()}
                 </div>
                 <LogResizeButton fullScreenView={fullScreenView} setFullScreenView={setFullScreenView} />
diff --git a/src/components/ApplicationGroup/Details/EnvCIDetails/EnvCIDetails.tsx b/src/components/ApplicationGroup/Details/EnvCIDetails/EnvCIDetails.tsx
index 1b5a48b923..d72374e532 100644
--- a/src/components/ApplicationGroup/Details/EnvCIDetails/EnvCIDetails.tsx
+++ b/src/components/ApplicationGroup/Details/EnvCIDetails/EnvCIDetails.tsx
@@ -293,7 +293,7 @@ export default function EnvCIDetails({ filteredAppIds }: AppGroupDetailDefaultTy
                 </div>
             )}
             <div className="ci-details__body">
-                <div className="flexbox-col flex-grow-1 dc__overflow-scroll" ref={scrollableParentRef}>
+                <div className="flexbox-col flex-grow-1 dc__overflow-auto" ref={scrollableParentRef}>
                     {!pipelineId ? (
                         <EmptyView
                             title="No application selected"
diff --git a/src/components/ApplicationGroup/List/EnvironmentListView.tsx b/src/components/ApplicationGroup/List/EnvironmentListView.tsx
index d33b58b485..b6116f4c2b 100644
--- a/src/components/ApplicationGroup/List/EnvironmentListView.tsx
+++ b/src/components/ApplicationGroup/List/EnvironmentListView.tsx
@@ -134,7 +134,7 @@ const EnvironmentsListView = ({
         !filteredEnvList.length ? (
             <LoadingShimmerList />
         ) : (
-            <div className="dc__overflow-scroll">
+            <div className="dc__overflow-auto">
                 {filteredEnvList?.map((envData) => (
                     <div
                         key={envData.id}
diff --git a/src/components/ApplicationGroup/List/EnvironmentsList.tsx b/src/components/ApplicationGroup/List/EnvironmentsList.tsx
index 9a8bbb3ea9..78d742c2e3 100644
--- a/src/components/ApplicationGroup/List/EnvironmentsList.tsx
+++ b/src/components/ApplicationGroup/List/EnvironmentsList.tsx
@@ -104,7 +104,7 @@ const EnvironmentsList = ({ isSuperAdmin }: AppGroupAdminType) => {
     )
 
     return (
-        <div className="flexbox-col h-100 dc__overflow-scroll">
+        <div className="flexbox-col h-100 dc__overflow-auto">
             <PageHeader headerName="Application Groups" showAnnouncementHeader />
             <div className="env-list bg__primary">
                 <div className="flex dc__content-space pl-20 pr-20 pt-16 pb-16" data-testid="search-env-and-cluster">
diff --git a/src/components/ClusterNodes/ClusterOverview.tsx b/src/components/ClusterNodes/ClusterOverview.tsx
index 1dd332d0d0..82b3b055fe 100644
--- a/src/components/ClusterNodes/ClusterOverview.tsx
+++ b/src/components/ClusterNodes/ClusterOverview.tsx
@@ -327,7 +327,7 @@ function ClusterOverview({ selectedCluster, addTab }: ClusterOverviewProps) {
                 {/* Commented to be used in future */}
                 {/* {cardDetailsInBar()} */}
                 <div className="dc__grid-row-one-half dc__gap-16 pb-16">
-                    <div className="flexbox dc__gap-12 dc__content-space dc__overflow-scroll bg__primary br-4 en-2 bw-1 pt-16 pl-16 pb-16 pr-16">
+                    <div className="flexbox dc__gap-12 dc__content-space dc__overflow-auto bg__primary br-4 en-2 bw-1 pt-16 pl-16 pb-16 pr-16">
                         <div>
                             <div className="dc__align-left fs-13 fw-4 cn-7 dc__ellipsis-right">CPU Usage</div>
                             <div className="dc__align-left fs-24 fw-4 cn-9">
@@ -354,7 +354,7 @@ function ClusterOverview({ selectedCluster, addTab }: ClusterOverviewProps) {
                         </div>
                     </div>
 
-                    <div className="flexbox dc__gap-12 dc__content-space dc__overflow-scroll bg__primary br-4 en-2 bw-1 pt-16 pl-16 pb-16 pr-16">
+                    <div className="flexbox dc__gap-12 dc__content-space dc__overflow-auto bg__primary br-4 en-2 bw-1 pt-16 pl-16 pb-16 pr-16">
                         <div>
                             <div className="dc__align-left fs-13 fw-4 cn-7 dc__ellipsis-right">Memory Usage</div>
                             <div className="dc__align-left fs-24 fw-4 cn-9">
diff --git a/src/components/charts/list/ChartListPopUp.tsx b/src/components/charts/list/ChartListPopUp.tsx
index 765ae30112..5fa4e4d938 100644
--- a/src/components/charts/list/ChartListPopUp.tsx
+++ b/src/components/charts/list/ChartListPopUp.tsx
@@ -165,7 +165,7 @@ const ChartListPopUp = ({
             return renderEmptyState(true)
         }
         return (
-            <div className="dc__overflow-scroll h-100 mxh-390-imp">
+            <div className="dc__overflow-auto h-100 mxh-390-imp">
                 {filteredChartList.map((list, index) => {
                     return (
                         list.id != 1 && (
diff --git a/src/components/ciConfig/CIConfigDiffView.tsx b/src/components/ciConfig/CIConfigDiffView.tsx
index f8f6d24419..5bbf6d4a8b 100644
--- a/src/components/ciConfig/CIConfigDiffView.tsx
+++ b/src/components/ciConfig/CIConfigDiffView.tsx
@@ -317,7 +317,7 @@ export default function CIConfigDiffView({
         <Drawer parentClassName="dc__overflow-hidden" position="right" width="87%" minWidth="1024px" maxWidth="1246px">
             <div className="modal__body modal__config-override-diff br-0 modal__body--p-0 dc__overflow-hidden">
                 {renderConfigDiffModalTitle()}
-                <div className="config-override-diff__view h-100 p-20 bg__tertiary dc__overflow-scroll">
+                <div className="config-override-diff__view h-100 p-20 bg__tertiary dc__overflow-auto">
                     {renderBodyContent()}
                 </div>
                 {showDeleteDialog && (
diff --git a/src/components/common/FloatingVariablesSuggestions/Suggestions.tsx b/src/components/common/FloatingVariablesSuggestions/Suggestions.tsx
index b3440ce6ae..5d59f964c5 100644
--- a/src/components/common/FloatingVariablesSuggestions/Suggestions.tsx
+++ b/src/components/common/FloatingVariablesSuggestions/Suggestions.tsx
@@ -123,7 +123,7 @@ const Suggestions = ({ handleDeActivation, loading, variables, reloadVariables,
 
     const renderSuggestions = (): JSX.Element => (
         <>
-            <div className="flexbox-col dc__align-self-stretch dc__overflow-scroll bg__primary flex-grow-1">
+            <div className="flexbox-col dc__align-self-stretch dc__overflow-auto bg__primary flex-grow-1">
                 {suggestions.length ? (
                     suggestions.map((variable) => (
                         <SuggestionItem
@@ -155,7 +155,7 @@ const Suggestions = ({ handleDeActivation, loading, variables, reloadVariables,
     const renderBody = (): JSX.Element => {
         if (loading) {
             return (
-                <div className="flexbox-col dc__align-self-stretch dc__overflow-scroll bg__primary flex-grow-1 h-200">
+                <div className="flexbox-col dc__align-self-stretch dc__overflow-auto bg__primary flex-grow-1 h-200">
                     <Progressing pageLoader size={32} />
                 </div>
             )
@@ -164,7 +164,7 @@ const Suggestions = ({ handleDeActivation, loading, variables, reloadVariables,
         if (variables?.length === 0) {
             return (
                 <>
-                    <div className="flexbox-col dc__align-self-stretch dc__overflow-scroll flex-grow-1 h-200">
+                    <div className="flexbox-col dc__align-self-stretch dc__overflow-auto flex-grow-1 h-250">
                         <GenericEmptyState title="No variables found" image={NoVariables} />
                     </div>
 
diff --git a/src/components/externalLinks/ExternalLinks.tsx b/src/components/externalLinks/ExternalLinks.tsx
index e974178a5e..c9fdf203e8 100644
--- a/src/components/externalLinks/ExternalLinks.tsx
+++ b/src/components/externalLinks/ExternalLinks.tsx
@@ -461,7 +461,7 @@ const ExternalLinks = ({ isAppConfigView, userRole }: ExternalLinksProps) => {
                             {filteredLinksLen > 0 && (
                                 <>
                                     {renderExternalLinksHeader()}
-                                    <div className="external-links__list dc__overflow-scroll">
+                                    <div className="external-links__list dc__overflow-auto">
                                         {renderExternalLinks(filteredLinksLen)}
                                     </div>
                                 </>
diff --git a/src/components/globalConfigurations/globalConfigurations.scss b/src/components/globalConfigurations/globalConfigurations.scss
index 842765eb8e..5b048d8f96 100644
--- a/src/components/globalConfigurations/globalConfigurations.scss
+++ b/src/components/globalConfigurations/globalConfigurations.scss
@@ -29,7 +29,7 @@
         border-right: solid 1px var(--N200);
         background: var(--bg-primary);
         height: 100%;
-        overflow: scroll;
+        overflow: auto;
 
         a {
             font-size: 13px;
@@ -59,7 +59,7 @@
 
     .global-configuration__component-wrapper {
         padding: 0;
-        overflow-y: auto;
+        overflow: auto;
         position: relative;
         max-height: 100%;
     }
diff --git a/src/components/notifications/WebhookConfigModal.tsx b/src/components/notifications/WebhookConfigModal.tsx
index 99f7dd47cc..c4092803f1 100644
--- a/src/components/notifications/WebhookConfigModal.tsx
+++ b/src/components/notifications/WebhookConfigModal.tsx
@@ -149,7 +149,7 @@ export const WebhookConfigModal = ({
 
     const renderConfigureLinkInfoColumn = () => (
         <div
-            className="h-100 w-280 flexbox-col left mh-0 p-16 dc__overflow-scroll dc__gap-16 fs-13"
+            className="h-100 w-280 flexbox-col left mh-0 p-16 dc__overflow-auto dc__gap-16 fs-13"
             data-testid="available-webhook-data"
         >
             <div className="flexbox lh-20 fw-6">

From 7b6afbb30949827beaa50317900c1c742f5452e6 Mon Sep 17 00:00:00 2001
From: shivani170 <shivani@devtron.ai>
Date: Wed, 15 Jan 2025 14:03:08 +0530
Subject: [PATCH 04/14] chore: chart & resource browser overflow scroll
 replaced

---
 package.json                                                  | 2 +-
 src/components/ClusterNodes/ClusterOverview.tsx               | 2 +-
 src/components/ClusterNodes/ClusterTerminal.tsx               | 2 +-
 .../ResourceBrowser/ResourceList/BaseResourceList.tsx         | 2 +-
 src/components/charts/charts.scss                             | 2 +-
 src/components/cluster/ClusterForm.tsx                        | 4 ++--
 src/components/cluster/ClusterInfoStepsModal.tsx              | 2 +-
 .../common/FloatingVariablesSuggestions/SuggestionItem.tsx    | 2 +-
 .../environmentStatus/HelmAppConfigApplyStatusCard.tsx        | 2 +-
 .../sourceInfo/environmentStatus/environmentStatus.scss       | 2 +-
 .../ChartDeploymentHistory.component.tsx                      | 2 +-
 .../v2/values/chartValuesDiff/ChartValuesGUIView.tsx          | 2 +-
 .../v2/values/chartValuesDiff/ChartValuesView.component.tsx   | 2 +-
 src/components/v2/values/chartValuesDiff/ChartValuesView.scss | 3 ---
 src/components/v2/values/chartValuesDiff/ChartValuesView.tsx  | 2 +-
 src/css/base.scss                                             | 4 ++++
 16 files changed, 19 insertions(+), 18 deletions(-)

diff --git a/package.json b/package.json
index 694f668ffd..7d7b08bd58 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
     "private": true,
     "homepage": "/dashboard",
     "dependencies": {
-        "@devtron-labs/devtron-fe-common-lib": "1.4.9",
+        "@devtron-labs/devtron-fe-common-lib": "1.4.9-beta-1",
         "@esbuild-plugins/node-globals-polyfill": "0.2.3",
         "@rjsf/core": "^5.13.3",
         "@rjsf/utils": "^5.13.3",
diff --git a/src/components/ClusterNodes/ClusterOverview.tsx b/src/components/ClusterNodes/ClusterOverview.tsx
index 82b3b055fe..7681e9f8c5 100644
--- a/src/components/ClusterNodes/ClusterOverview.tsx
+++ b/src/components/ClusterNodes/ClusterOverview.tsx
@@ -527,7 +527,7 @@ function ClusterOverview({ selectedCluster, addTab }: ClusterOverviewProps) {
     const renderClusterSummary = (): JSX.Element => {
         return (
             <div
-                className={`dc__border-left resource-details-container bg__primary dc__overflow-scroll ${
+                className={`dc__border-left resource-details-container bg__primary dc__overflow-auto ${
                     errorStatusCode || errorCode ? 'flex' : ''
                 }`}
             >
diff --git a/src/components/ClusterNodes/ClusterTerminal.tsx b/src/components/ClusterNodes/ClusterTerminal.tsx
index 9cf170a0a1..239bf7aa80 100644
--- a/src/components/ClusterNodes/ClusterTerminal.tsx
+++ b/src/components/ClusterNodes/ClusterTerminal.tsx
@@ -700,7 +700,7 @@ node-details-full-screen
                 {connectTerminal && terminalView}
             </div>
             {selectedTabIndex === 1 && (
-                <div className="h-100 dc__overflow-scroll">
+                <div className="h-100 dc__overflow-auto">
                     <ClusterEvents terminalAccessId={terminalAccessIdRef.current} reconnectStart={reconnectStart} />
                 </div>
             )}
diff --git a/src/components/ResourceBrowser/ResourceList/BaseResourceList.tsx b/src/components/ResourceBrowser/ResourceList/BaseResourceList.tsx
index b983ce429a..d1db538b93 100644
--- a/src/components/ResourceBrowser/ResourceList/BaseResourceList.tsx
+++ b/src/components/ResourceBrowser/ResourceList/BaseResourceList.tsx
@@ -575,7 +575,7 @@ const BaseResourceListContent = ({
                             'scrollable-resource-list',
                             showPaginatedView,
                             showStaleDataWarning,
-                        )} dc__overflow-scroll`}
+                        )} dc__overflow-auto`}
                     >
                         <div
                             className="scrollable-resource-list__row no-hover-bg h-36 fw-6 cn-7 fs-12 dc__gap-16 dc__zi-2 dc__position-sticky dc__border-bottom dc__uppercase bg__primary dc__top-0"
diff --git a/src/components/charts/charts.scss b/src/components/charts/charts.scss
index 1aec8ae38d..e4b3bf7695 100644
--- a/src/components/charts/charts.scss
+++ b/src/components/charts/charts.scss
@@ -186,7 +186,7 @@
 }
 
 .chart-grid--chart-group-snapshot {
-    height: 232px;
+    height: 228px;
     overflow: hidden;
 }
 
diff --git a/src/components/cluster/ClusterForm.tsx b/src/components/cluster/ClusterForm.tsx
index fe55842c9d..061b3be0e3 100644
--- a/src/components/cluster/ClusterForm.tsx
+++ b/src/components/cluster/ClusterForm.tsx
@@ -1081,7 +1081,7 @@ export default function ClusterForm({
                         <div data-testid="message_validate">MESSAGE</div>
                         <div />
                     </div>
-                    <div className="dc__overflow-scroll" style={{ height: 'calc(100vh - 161px)' }}>
+                    <div className="dc__overflow-auto" style={{ height: 'calc(100vh - 161px)' }}>
                         {!saveClusterList || saveClusterList.length === 0 ? (
                             <NoMatchingResults />
                         ) : (
@@ -1238,7 +1238,7 @@ export default function ClusterForm({
                         className="cluster-form dc__position-rel h-100 bg__primary"
                     >
                         <AddClusterHeader />
-                        <div className="dc__overflow-scroll" style={{ height: 'calc(100vh - 110px)' }}>
+                        <div className="dc__overflow-auto" style={{ height: 'calc(100vh - 110px)' }}>
                             <div className="api-token__list en-2 bw-1 bg__primary br-4 mr-20 ml-20 mt-16">
                                 <InfoColourBar
                                     message={
diff --git a/src/components/cluster/ClusterInfoStepsModal.tsx b/src/components/cluster/ClusterInfoStepsModal.tsx
index a0e5f0b530..eaac66d2fc 100644
--- a/src/components/cluster/ClusterInfoStepsModal.tsx
+++ b/src/components/cluster/ClusterInfoStepsModal.tsx
@@ -45,7 +45,7 @@ const ClusterInfoSteps = ({ command, clusterName }: ClusterStepModal) => {
             additionalInfo: (
                 <div className="dc__position-rel cluster-modal-container dc__align-left bcn-1 lh-20 mt-2 br-4">
                     <div
-                        className="fs-13 fw-4 h-100 dc__overflow-scroll mono pl-10 pt-10 pb-10 pr-36"
+                        className="fs-13 fw-4 h-100 dc__overflow-auto mono pl-10 pt-10 pb-10 pr-36"
                         id="command-code"
                     >
                         {command}
diff --git a/src/components/common/FloatingVariablesSuggestions/SuggestionItem.tsx b/src/components/common/FloatingVariablesSuggestions/SuggestionItem.tsx
index 279d4b58b9..29854ec782 100644
--- a/src/components/common/FloatingVariablesSuggestions/SuggestionItem.tsx
+++ b/src/components/common/FloatingVariablesSuggestions/SuggestionItem.tsx
@@ -89,7 +89,7 @@ export default function SuggestionItem({
         <Tippy
             className="default-tt dc__word-break-all"
             content={
-                <div className="mw-200 flex column dc__content-start dc__align-start mxh-140 dc__overflow-scroll">
+                <div className="mw-200 flex column dc__content-start dc__align-start mxh-140 dc__overflow-auto">
                     <div className="flex column dc__content-start dc__align-start">Value</div>
                     <div className="flex column dc__content-start dc__align-start">
                         {sanitiseVariableValue(variableValue)}
diff --git a/src/components/v2/appDetails/sourceInfo/environmentStatus/HelmAppConfigApplyStatusCard.tsx b/src/components/v2/appDetails/sourceInfo/environmentStatus/HelmAppConfigApplyStatusCard.tsx
index d67c201051..228610dab8 100644
--- a/src/components/v2/appDetails/sourceInfo/environmentStatus/HelmAppConfigApplyStatusCard.tsx
+++ b/src/components/v2/appDetails/sourceInfo/environmentStatus/HelmAppConfigApplyStatusCard.tsx
@@ -49,7 +49,7 @@ const HelmAppConfigApplyStatusCard = ({ releaseStatus, cardLoading }: HelmAppCon
                     </p>
                 </div>
                 <div className="flex br-4">
-                    <figure className={`${releaseStatus.status.toLowerCase()} icon-dim-24`} />
+                    <figure className={`${releaseStatus.status.toLowerCase()} icon-dim-24 dc__bs-contains`} />
                 </div>
             </div>
             <div className="app-details-info-card__bottom-container">
diff --git a/src/components/v2/appDetails/sourceInfo/environmentStatus/environmentStatus.scss b/src/components/v2/appDetails/sourceInfo/environmentStatus/environmentStatus.scss
index b9c58bbe83..887c7c5461 100644
--- a/src/components/v2/appDetails/sourceInfo/environmentStatus/environmentStatus.scss
+++ b/src/components/v2/appDetails/sourceInfo/environmentStatus/environmentStatus.scss
@@ -24,7 +24,7 @@
     margin: auto;
     margin-right: 0;
     height: 100%;
-    overflow: scroll;
+    overflow: auto;
 }
 
 .config-error-wrap {
diff --git a/src/components/v2/chartDeploymentHistory/ChartDeploymentHistory.component.tsx b/src/components/v2/chartDeploymentHistory/ChartDeploymentHistory.component.tsx
index 51417d3231..a8490a5331 100644
--- a/src/components/v2/chartDeploymentHistory/ChartDeploymentHistory.component.tsx
+++ b/src/components/v2/chartDeploymentHistory/ChartDeploymentHistory.component.tsx
@@ -748,7 +748,7 @@ const ChartDeploymentHistory = ({
                         {renderDeploymentCards()}
                     </div>
                 </div>
-                <div className="ci-details__body dc__overflow-scroll">{renderSelectedDeploymentDetail()}</div>
+                <div className="ci-details__body dc__overflow-auto">{renderSelectedDeploymentDetail()}</div>
                 {showRollbackConfirmation && (
                     <RollbackConfirmationDialog
                         deploying={deploying}
diff --git a/src/components/v2/values/chartValuesDiff/ChartValuesGUIView.tsx b/src/components/v2/values/chartValuesDiff/ChartValuesGUIView.tsx
index 89c431bc0b..d29de1e35b 100644
--- a/src/components/v2/values/chartValuesDiff/ChartValuesGUIView.tsx
+++ b/src/components/v2/values/chartValuesDiff/ChartValuesGUIView.tsx
@@ -79,7 +79,7 @@ const ChartValuesGUIForm = ({
     }
 
     return (
-        <div className="chart-values-view__gui-form-container">
+        <div className="chart-values-view__gui-form-container dc__overflow-auto">
             <InfoColourBar
                 classname="info_bar dc__no-border-radius dc__no-top-border dc__no-right-border dc__no-left-border"
                 Icon={ICInfoFilled}
diff --git a/src/components/v2/values/chartValuesDiff/ChartValuesView.component.tsx b/src/components/v2/values/chartValuesDiff/ChartValuesView.component.tsx
index 3362c4cef9..ae6ecbbc7f 100644
--- a/src/components/v2/values/chartValuesDiff/ChartValuesView.component.tsx
+++ b/src/components/v2/values/chartValuesDiff/ChartValuesView.component.tsx
@@ -620,7 +620,7 @@ export const ChartVersionValuesSelector = ({
 
 export const ActiveReadmeColumn = ({ fetchingReadMe, activeReadMe }: ActiveReadmeColumnProps) => {
     return (
-        <div className="chart-values-view__readme dc__overflow-scroll dc__border-right">
+        <div className="chart-values-view__readme dc__overflow-auto dc__border-right">
             <div
                 className="code-editor__header flex left fs-12 fw-6 cn-7 dc__position-sticky dc__top-0 dc__zi-1"
                 data-testid="readme-heading"
diff --git a/src/components/v2/values/chartValuesDiff/ChartValuesView.scss b/src/components/v2/values/chartValuesDiff/ChartValuesView.scss
index 13aa6ff7b1..1ad24ad442 100644
--- a/src/components/v2/values/chartValuesDiff/ChartValuesView.scss
+++ b/src/components/v2/values/chartValuesDiff/ChartValuesView.scss
@@ -95,8 +95,6 @@
         }
 
         .chart-values-view__details {
-            padding: 16px;
-            overflow: scroll;
 
             .chart-values__project-container .chart-values__project-label,
             .chart-values__environment-container .chart-values__environment-label,
@@ -240,7 +238,6 @@
 
         .chart-values-view__gui-form-container {
             border-bottom: 1px solid var(--N100);
-            overflow: scroll;
 
             & .rjsf-form-template__container {
                 max-width: 800px;
diff --git a/src/components/v2/values/chartValuesDiff/ChartValuesView.tsx b/src/components/v2/values/chartValuesDiff/ChartValuesView.tsx
index ce38407adf..fad4e8d7d8 100644
--- a/src/components/v2/values/chartValuesDiff/ChartValuesView.tsx
+++ b/src/components/v2/values/chartValuesDiff/ChartValuesView.tsx
@@ -1624,7 +1624,7 @@ const ChartValuesView = ({
             >
                 {renderValuesTabsContainer()}
                 <div className="chart-values-view__wrapper flexbox flex-grow-1 dc__overflow-hidden">
-                    <div className="flexbox-col dc__gap-16 chart-values-view__details dc__border-right dc__overflow-scroll">
+                    <div className="flexbox-col dc__gap-16 chart-values-view__details dc__border-right dc__overflow-auto p-16">
                         <div className="flexbox-col dc__gap-12">
                             {isCreateValueView && (
                                 <ValueNameInput
diff --git a/src/css/base.scss b/src/css/base.scss
index 7404340989..dcb74e3bcf 100644
--- a/src/css/base.scss
+++ b/src/css/base.scss
@@ -4105,6 +4105,10 @@ textarea {
     background: none !important;
 }
 
+.dc__bs-contains {
+    background-size: contain;
+}
+
 //Overflow
 .dc__overflow-hidden {
     overflow: hidden !important;

From 234590e90f80382b51580e38edf06638dac1ffe7 Mon Sep 17 00:00:00 2001
From: shivani170 <shivani@devtron.ai>
Date: Wed, 15 Jan 2025 15:54:43 +0530
Subject: [PATCH 05/14] chore: External component overflow scroll replaced

---
 .../AppConfigurations/MainContent/NoOverrideEmptyState.tsx    | 2 +-
 .../DeploymentCharts/List/DeploymentChartsList.component.tsx  | 2 +-
 .../externalLinks/ExternalLinksCRUD/AddExternalLink.scss      | 2 +-
 src/components/externalLinks/externalLinks.component.scss     | 2 +-
 src/components/scopedVariables/VariablesList.tsx              | 2 +-
 .../nodeDetail/NodeDetailTabs/Manifest.component.tsx          | 4 ++--
 .../sourceInfo/rotatePods/RotatePodsModal.component.tsx       | 2 +-
 src/components/workflowEditor/WorkflowOptionsModal.tsx        | 4 ++--
 8 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/NoOverrideEmptyState.tsx b/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/NoOverrideEmptyState.tsx
index 8928d2c3f4..312374669c 100644
--- a/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/NoOverrideEmptyState.tsx
+++ b/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/NoOverrideEmptyState.tsx
@@ -48,7 +48,7 @@ const NoOverrideEmptyState = ({
     handleCreateOverride,
     handleViewInheritedConfig,
 }: NoOverrideEmptyStateProps) => (
-    <div className="no-override-empty-state-container flexbox-col flex-grow-1 dc__overflow-scroll">
+    <div className="no-override-empty-state-container flexbox-col flex-grow-1 dc__overflow-auto">
         <GenericEmptyState
             image={cmCsEmptyState}
             title={getNoOverrideEmptyStateTitle({ componentType, environmentName, configName })}
diff --git a/src/Pages/GlobalConfigurations/DeploymentCharts/List/DeploymentChartsList.component.tsx b/src/Pages/GlobalConfigurations/DeploymentCharts/List/DeploymentChartsList.component.tsx
index 85a572e402..2ee439db27 100644
--- a/src/Pages/GlobalConfigurations/DeploymentCharts/List/DeploymentChartsList.component.tsx
+++ b/src/Pages/GlobalConfigurations/DeploymentCharts/List/DeploymentChartsList.component.tsx
@@ -117,7 +117,7 @@ const DeploymentChartsList = () => {
                         <span>Version</span>
                         <span>Description</span>
                     </div>
-                    <div className="h-100 dc__overflow-scroll">
+                    <div className="h-100 dc__overflow-auto">
                         {chartList.map((chartData) => (
                             <div
                                 key={`custom-chart_${chartData.name}`}
diff --git a/src/components/externalLinks/ExternalLinksCRUD/AddExternalLink.scss b/src/components/externalLinks/ExternalLinksCRUD/AddExternalLink.scss
index ad5b547379..f6c4a17d05 100644
--- a/src/components/externalLinks/ExternalLinksCRUD/AddExternalLink.scss
+++ b/src/components/externalLinks/ExternalLinksCRUD/AddExternalLink.scss
@@ -57,7 +57,7 @@
             .configure-link-action-container,
             .configure-link-info-container {
                 overflow-wrap: break-word;
-                overflow-y: scroll;
+                overflow-y: auto;
             }
 
             .configure-link-action-container {
diff --git a/src/components/externalLinks/externalLinks.component.scss b/src/components/externalLinks/externalLinks.component.scss
index a244db0b28..752a1837aa 100644
--- a/src/components/externalLinks/externalLinks.component.scss
+++ b/src/components/externalLinks/externalLinks.component.scss
@@ -55,7 +55,7 @@
             .configure-link-action-container,
             .configure-link-info-container {
                 overflow-wrap: break-word;
-                overflow-y: scroll;
+                overflow-y: auto;
             }
 
             .configure-link-action-container {
diff --git a/src/components/scopedVariables/VariablesList.tsx b/src/components/scopedVariables/VariablesList.tsx
index fc87486c77..2403dc97d1 100644
--- a/src/components/scopedVariables/VariablesList.tsx
+++ b/src/components/scopedVariables/VariablesList.tsx
@@ -55,7 +55,7 @@ export default function VariablesList({ variablesList, handleClearFilters }: { v
     }
 
     return (
-        <div className="dc__overflow-scroll h-100 flex column dc__content-start dc__align-start bg__primary dc__align-self-stretch flex-grow-1 dc__no-shrink">
+        <div className="dc__overflow-auto h-100 flex column dc__content-start dc__align-start bg__primary dc__align-self-stretch flex-grow-1 dc__no-shrink">
             <Grid container spacing={0} containerClass="w-100">
                 <Grid item xs={3} itemClass="dc__ellipsis-right">
                     {renderVariablesListItem({
diff --git a/src/components/v2/appDetails/k8Resource/nodeDetail/NodeDetailTabs/Manifest.component.tsx b/src/components/v2/appDetails/k8Resource/nodeDetail/NodeDetailTabs/Manifest.component.tsx
index 80ac3d3e16..70b76daedb 100644
--- a/src/components/v2/appDetails/k8Resource/nodeDetail/NodeDetailTabs/Manifest.component.tsx
+++ b/src/components/v2/appDetails/k8Resource/nodeDetail/NodeDetailTabs/Manifest.component.tsx
@@ -757,7 +757,7 @@ const ManifestComponent = ({
         </div>
     ) : (
         <div
-            className={`${isSuperAdmin && !isResourceBrowserView ? 'pb-28' : ' '} manifest-container flexbox-col flex-grow-1 dc__overflow-scroll`}
+            className={`${isSuperAdmin && !isResourceBrowserView ? 'pb-28' : ' '} manifest-container flexbox-col flex-grow-1 dc__overflow-auto`}
             data-testid="app-manifest-container"
             style={{ background: '#0B0F22' }}
         >
@@ -772,7 +772,7 @@ const ManifestComponent = ({
                 <div
                     className={`${
                         manifestFormConfigurationType === ConfigurationType.GUI ? 'bg__primary' : ''
-                    } flexbox-col flex-grow-1 dc__overflow-scroll h-100`}
+                    } flexbox-col flex-grow-1 dc__overflow-auto h-100`}
                 >
                     {isResourceMissing && !loading && !showManifestCompareView ? (
                         <MessageUI
diff --git a/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx b/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx
index 0a473f1705..9e2c3dc56b 100644
--- a/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx
+++ b/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx
@@ -268,7 +268,7 @@ export default function RotatePodsModal({ onClose, callAppDetailsAPI, isDeployme
         return (
             <div className="scale-worklists-container bg__primary dc__height-inherit dc__overflow-auto">
                 {isWorkloadPresent && (
-                    <div className="dc__overflow-scroll p-20">
+                    <div className="dc__overflow-auto p-20">
                         <div className="check-all-workloads cn-7 fw-6">
                             <Checkbox
                                 rootClassName="mb-0 fs-13 cursor bg__primary p"
diff --git a/src/components/workflowEditor/WorkflowOptionsModal.tsx b/src/components/workflowEditor/WorkflowOptionsModal.tsx
index 48e107d352..29e9f5369e 100644
--- a/src/components/workflowEditor/WorkflowOptionsModal.tsx
+++ b/src/components/workflowEditor/WorkflowOptionsModal.tsx
@@ -191,7 +191,7 @@ const WorkflowOptionsModal = ({
             onEscape={loadingWebhook ? null : handleFlowCompletion}
             close={loadingWebhook ? null : handleFlowCompletion}
         >
-            <div className="workflow-options-modal br-8 flexbox h-500 dc__overflow-scroll" onClick={stopPropagation}>
+            <div className="workflow-options-modal br-8 flexbox h-500 dc__overflow-auto" onClick={stopPropagation}>
                 {/* Sidebar */}
                 <div className="flexbox-col w-250 pt-32 bg__tertiary dc__content-space">
                     {/* Info */}
@@ -218,7 +218,7 @@ const WorkflowOptionsModal = ({
                 </div>
 
                 {/* Content */}
-                <div className="flexbox-col p-20 dc__gap-12 dc__overflow-scroll">
+                <div className="flexbox-col p-20 dc__gap-12 dc__overflow-auto">
                     <section className="flexbox-col dc__gap-8 dc__align-self-stretch">
                         <h3 className="m-0 cn-7 fs-11 fw-6 lh-16 dc__uppercase">
                             {WORKFLOW_OPTIONS_MODAL_TYPES.DEFAULT}

From 5cb5de8a46495db0860dc61527970fe414d161f0 Mon Sep 17 00:00:00 2001
From: shivani170 <shivani@devtron.ai>
Date: Wed, 15 Jan 2025 16:49:39 +0530
Subject: [PATCH 06/14] chore: remaining all dashboard overflow replaced

---
 .../MainContent/DeploymentTemplate/DTChartSelector.tsx          | 2 +-
 .../components/K8sObjectPermissions/K8sPermissionModal.tsx      | 2 +-
 src/Pages/GlobalConfigurations/BuildInfra/ProfileForm.tsx       | 2 +-
 .../DeploymentCharts/List/DownloadChartButton.tsx               | 2 +-
 src/Pages/Shared/ConfigMapSecret/ConfigMapSecretDryRun.tsx      | 2 +-
 .../ResourceList/ClusterUpgradeCompatibilityInfo.tsx            | 2 +-
 src/components/ResourceBrowser/ResourceList/EventList.tsx       | 2 +-
 src/components/material/MaterialView.tsx                        | 2 +-
 src/components/workflowEditor/nodes/CDNode.tsx                  | 2 +-
 9 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/DTChartSelector.tsx b/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/DTChartSelector.tsx
index 4fee9d3cb7..6cb08e43ad 100644
--- a/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/DTChartSelector.tsx
+++ b/src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/DTChartSelector.tsx
@@ -115,7 +115,7 @@ const ChartSelectorDropdown = ({
                     />
                 </div>
             </PopupMenu.Button>
-            <PopupMenu.Body rootClassName="dc__overflow-scroll mxh-350 w-400 dc__border br-4">
+            <PopupMenu.Body rootClassName="dc__overflow-auto mxh-350 w-400 dc__border br-4">
                 <>
                     {customCharts.length > 0 && (
                         <div
diff --git a/src/Pages/GlobalConfigurations/Authorization/Shared/components/K8sObjectPermissions/K8sPermissionModal.tsx b/src/Pages/GlobalConfigurations/Authorization/Shared/components/K8sObjectPermissions/K8sPermissionModal.tsx
index e5bc62e3e7..16922e54dc 100644
--- a/src/Pages/GlobalConfigurations/Authorization/Shared/components/K8sObjectPermissions/K8sPermissionModal.tsx
+++ b/src/Pages/GlobalConfigurations/Authorization/Shared/components/K8sObjectPermissions/K8sPermissionModal.tsx
@@ -159,7 +159,7 @@ const K8sPermissionModal = ({
                         <Close />
                     </span>
                 </div>
-                <div className="p-20 fs-13 dc__overflow-scroll flexbox-col flex-grow-1 bg__tertiary">
+                <div className="p-20 fs-13 dc__overflow-auto flexbox-col flex-grow-1 bg__tertiary">
                     {!selectedPermissionAction && (
                         <div className="flex left fs-13 fw-6">
                             <span className="flex cb-5 cursor dc__gap-12" onClick={addNewPermissionCard}>
diff --git a/src/Pages/GlobalConfigurations/BuildInfra/ProfileForm.tsx b/src/Pages/GlobalConfigurations/BuildInfra/ProfileForm.tsx
index 75a14c15a0..316116e4e3 100644
--- a/src/Pages/GlobalConfigurations/BuildInfra/ProfileForm.tsx
+++ b/src/Pages/GlobalConfigurations/BuildInfra/ProfileForm.tsx
@@ -65,7 +65,7 @@ const ProfileForm: FunctionComponent = () => {
             onKeyDown={handleKeyDown}
             onSubmit={handleSubmit}
         >
-            <div className="flexbox-col dc__gap-24 pt pr pb pl h-100 dc__overflow-scroll">
+            <div className="flexbox-col dc__gap-24 pt pr pb pl h-100 dc__overflow-auto">
                 <BuildInfraDescriptor breadCrumbs={breadcrumbs} />
 
                 <APIResponseHandler
diff --git a/src/Pages/GlobalConfigurations/DeploymentCharts/List/DownloadChartButton.tsx b/src/Pages/GlobalConfigurations/DeploymentCharts/List/DownloadChartButton.tsx
index 5e9e3fe1a6..a032869a92 100644
--- a/src/Pages/GlobalConfigurations/DeploymentCharts/List/DownloadChartButton.tsx
+++ b/src/Pages/GlobalConfigurations/DeploymentCharts/List/DownloadChartButton.tsx
@@ -61,7 +61,7 @@ const DownloadChartButton = ({ name, versions }: DownloadChartButtonProps) => {
                     >
                         Select Version
                     </div>
-                    <div className="mb-4 mxh-140 dc__overflow-scroll">
+                    <div className="mb-4 mxh-140 dc__overflow-auto">
                         {versions.map((versionsList) => (
                             <button
                                 type="button"
diff --git a/src/Pages/Shared/ConfigMapSecret/ConfigMapSecretDryRun.tsx b/src/Pages/Shared/ConfigMapSecret/ConfigMapSecretDryRun.tsx
index d98797cbc3..f907244270 100644
--- a/src/Pages/Shared/ConfigMapSecret/ConfigMapSecretDryRun.tsx
+++ b/src/Pages/Shared/ConfigMapSecret/ConfigMapSecretDryRun.tsx
@@ -232,7 +232,7 @@ export const ConfigMapSecretDryRun = ({
                     reload: reloadConfigMapSecretManifest,
                 }}
             >
-                <div className="flex-grow-1 dc__overflow-scroll">
+                <div className="flex-grow-1 dc__overflow-auto">
                     <CodeEditor value={configMapSecretManifest?.manifest} height="100%" mode={MODES.YAML} readOnly />
                 </div>
             </APIResponseHandler>
diff --git a/src/components/ResourceBrowser/ResourceList/ClusterUpgradeCompatibilityInfo.tsx b/src/components/ResourceBrowser/ResourceList/ClusterUpgradeCompatibilityInfo.tsx
index c8c7d20c42..c4c186ba7e 100644
--- a/src/components/ResourceBrowser/ResourceList/ClusterUpgradeCompatibilityInfo.tsx
+++ b/src/components/ResourceBrowser/ResourceList/ClusterUpgradeCompatibilityInfo.tsx
@@ -87,7 +87,7 @@ const ClusterUpgradeCompatibilityInfo = ({
 
     return (
         <div className="resource-browser">
-            <div className="dc__overflow-scroll p-8">
+            <div className="dc__overflow-auto p-8">
                 <CollapsibleList tabType="navLink" config={sidebarConfig} onCollapseBtnClick={onCollapseBtnClick} />
             </div>
             <BaseResourceList
diff --git a/src/components/ResourceBrowser/ResourceList/EventList.tsx b/src/components/ResourceBrowser/ResourceList/EventList.tsx
index 3871a88645..038f0c4820 100644
--- a/src/components/ResourceBrowser/ResourceList/EventList.tsx
+++ b/src/components/ResourceBrowser/ResourceList/EventList.tsx
@@ -33,7 +33,7 @@ export const EventList = ({
     searchText,
     setWidgetEventDetails,
 }: EventListType) => (
-    <div className="dc__overflow-scroll">
+    <div className="dc__overflow-auto">
         <div
             className={`event-list-row${ExplainEventButton ? '__explain' : ''} dc__zi-1 dc__min-width-fit-content dc__position-sticky bg__primary dc__top-0 fw-6 cn-7 fs-13 dc__border-bottom px-20 py-8 dc__uppercase h-36`}
         >
diff --git a/src/components/material/MaterialView.tsx b/src/components/material/MaterialView.tsx
index 6e04159659..54986b1607 100644
--- a/src/components/material/MaterialView.tsx
+++ b/src/components/material/MaterialView.tsx
@@ -168,7 +168,7 @@ export class MaterialView extends Component<MaterialViewProps, MaterialViewState
     regexInfoSteps = (): JSX.Element => {
         return (
             <div data-testid="exclude-include-use-regex-info" className="w-500 h-380 fs-13 bg__primary">
-                <div className="h-365 dc__align-start p-12 dc__gap-12 dc__position-sticky dc__overflow-scroll">
+                <div className="h-365 dc__align-start p-12 dc__gap-12 dc__position-sticky dc__overflow-auto">
                     <div className="w-476 h-112 flex column dc__align-start p-0 dc__gap-4">
                         {USE_REGEX_TIPPY_CONTENT.insructionsList.regexInfo.map((item, index) => (
                             <div
diff --git a/src/components/workflowEditor/nodes/CDNode.tsx b/src/components/workflowEditor/nodes/CDNode.tsx
index 2bef17ac90..0949e00d02 100644
--- a/src/components/workflowEditor/nodes/CDNode.tsx
+++ b/src/components/workflowEditor/nodes/CDNode.tsx
@@ -183,7 +183,7 @@ export class CDNode extends Component<CDNodeProps, CDNodeState> {
 
     renderReadOnlyCard() {
         return (
-            <div className="workflow-node dc__overflow-scroll">
+            <div className="workflow-node dc__overflow-auto">
                 <div className="workflow-node__title flex">
                     <div className="workflow-node__full-width-minus-Icon">
                         <span className="workflow-node__text-light">Deploy</span>

From 1805848f1f2539f975def84cca3d2b65a804f20f Mon Sep 17 00:00:00 2001
From: shivani170 <shivani@devtron.ai>
Date: Thu, 16 Jan 2025 17:18:20 +0530
Subject: [PATCH 07/14] chore: remaining taint overflow replacement

---
 src/Pages/Shared/LinkedCIDetailsModal/LinkedCIAppList.tsx     | 4 ++--
 src/components/ClusterNodes/NodeActions/EditTaintsModal.tsx   | 4 ++--
 .../sourceInfo/rotatePods/RotatePodsModal.component.tsx       | 2 +-
 .../scaleWorkloads/ScaleWorkloadsModal.component.tsx          | 2 +-
 src/css/base.scss                                             | 4 ++++
 5 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/src/Pages/Shared/LinkedCIDetailsModal/LinkedCIAppList.tsx b/src/Pages/Shared/LinkedCIDetailsModal/LinkedCIAppList.tsx
index e6b352ca84..552bf8ebb9 100644
--- a/src/Pages/Shared/LinkedCIDetailsModal/LinkedCIAppList.tsx
+++ b/src/Pages/Shared/LinkedCIDetailsModal/LinkedCIAppList.tsx
@@ -27,12 +27,12 @@ const AppListRow = ({ appId, appName, deploymentStatus, environmentName, trigger
         <div className="display-grid dc__align-items-center linked-ci-detail__table-row cn-9 pl-20 pr-20 pt-8 pb-8 fs-13 fw-4 dc__hover-n50 ">
             <span className="dc__truncate">
                 <Tippy className="default-tt" placement="right" arrow={false} content={appName}>
-                    <span className="dc__truncate dc__w-fit-content">{appName}</span>
+                    <span className="dc__truncate dc__w-fit-content cb-5">{appName}</span>
                 </Tippy>
             </span>
             {environmentName ? (
                 <>
-                    <span>{environmentName}</span>
+                    <span className="dc__truncate dc__w-fit-content">{environmentName}</span>
                     <span className="dc__first-letter-capitalize">{triggerMode}</span>
                     <AppStatus
                         appStatus={
diff --git a/src/components/ClusterNodes/NodeActions/EditTaintsModal.tsx b/src/components/ClusterNodes/NodeActions/EditTaintsModal.tsx
index e2e2a37f4b..462cb3f054 100644
--- a/src/components/ClusterNodes/NodeActions/EditTaintsModal.tsx
+++ b/src/components/ClusterNodes/NodeActions/EditTaintsModal.tsx
@@ -180,14 +180,14 @@ export default function EditTaintsModal({ name, version, kind, taints, closePopu
 
     return (
         <Drawer position="right" width="75%" minWidth="1024px" maxWidth="1200px">
-            <div className="bg__primary h-100">
+            <div className="flexbox-col bg__primary h-100 flex-grow-1 mh-0">
                 <div className="flex flex-align-center flex-justify bg__primary pt-16 pr-20 pb-16 pl-20 dc__border-bottom">
                     <h2 className="fs-16 fw-6 lh-1-43 m-0">{`${EDIT_TAINTS_MODAL_MESSAGING.titlePrefix} '${name}'`}</h2>
                     <button type="button" className="dc__transparent flex icon-dim-24" onClick={onClose}>
                         <Close className="icon-dim-24" />
                     </button>
                 </div>
-                <div className="pt-16 pr-20 pb-16 pl-20" style={{ height: 'calc(100vh - 125px)' }}>
+                <div className="flexbox-col pt-16 pr-20 pb-16 pl-20 dc__overflow-auto flex-grow-1">
                     <InfoColourBar
                         message={<RenderInfoMessage />}
                         classname="info_bar mb-16"
diff --git a/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx b/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx
index 9e2c3dc56b..93e85788d3 100644
--- a/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx
+++ b/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx
@@ -281,7 +281,7 @@ export default function RotatePodsModal({ onClose, callAppDetailsAPI, isDeployme
                                 </div>
                             </Checkbox>
                         </div>
-                        <div style={{ height: '192px', overflow: 'scroll' }}>
+                        <div className='dc__overflow-auto h-192'>
                             {Array.from(podsToRotate.values()).map((item) => (
                                 <div key={`${item.kind}/${item.name}`} className="check-single-workload mt-16">
                                     <Checkbox
diff --git a/src/components/v2/appDetails/sourceInfo/scaleWorkloads/ScaleWorkloadsModal.component.tsx b/src/components/v2/appDetails/sourceInfo/scaleWorkloads/ScaleWorkloadsModal.component.tsx
index 3c6b7e1c75..2927479b32 100644
--- a/src/components/v2/appDetails/sourceInfo/scaleWorkloads/ScaleWorkloadsModal.component.tsx
+++ b/src/components/v2/appDetails/sourceInfo/scaleWorkloads/ScaleWorkloadsModal.component.tsx
@@ -388,7 +388,7 @@ export default function ScaleWorkloadsModal({ appId, onClose, history }: ScaleWo
                                         </div>
                                     </Checkbox>
                                 </div>
-                                <div style={{ height: '192px', overflow: 'scroll' }}>
+                                <div  className="h-192 dc__overflow-auto">
                                     {Array.from(_workloadsList.values()).map((item) => (
                                         <div key={`${item.kind}/${item.name}`} className="check-single-workload">
                                             <Checkbox
diff --git a/src/css/base.scss b/src/css/base.scss
index dcb74e3bcf..62c0d4517a 100644
--- a/src/css/base.scss
+++ b/src/css/base.scss
@@ -3601,6 +3601,10 @@ textarea {
     height: 132px;
 }
 
+.h-192 {
+    height: 192px;
+}
+
 .h-200 {
     height: 200px;
 }

From 38da91958dca48f3a8b91100fff3c38238508de4 Mon Sep 17 00:00:00 2001
From: shivani170 <shivani@devtron.ai>
Date: Fri, 17 Jan 2025 14:28:23 +0530
Subject: [PATCH 08/14] chorE: removed unused css from components

---
 .../app/details/appDetails/appDetails.scss          |  2 +-
 .../app/details/triggerView/triggerView.scss        |  5 -----
 src/components/bulkEdits/bulkEdit.scss              | 13 +------------
 src/components/notifications/notifications.util.tsx |  2 +-
 .../v2/appDetails/k8Resource/k8resources.scss       |  2 +-
 src/components/v2/utils/tableUtils/Table.util.tsx   |  3 ++-
 src/css/base.scss                                   | 12 ------------
 7 files changed, 6 insertions(+), 33 deletions(-)

diff --git a/src/components/app/details/appDetails/appDetails.scss b/src/components/app/details/appDetails/appDetails.scss
index aad262c810..7143f936ed 100644
--- a/src/components/app/details/appDetails/appDetails.scss
+++ b/src/components/app/details/appDetails/appDetails.scss
@@ -1948,7 +1948,7 @@ table.resource-tree {
     margin: auto;
     margin-right: 0;
     height: 100%;
-    overflow: scroll;
+    overflow: auto;
 
     .issues-listing-modal__header {
         position: sticky;
diff --git a/src/components/app/details/triggerView/triggerView.scss b/src/components/app/details/triggerView/triggerView.scss
index 3c6da12af5..5a57576969 100644
--- a/src/components/app/details/triggerView/triggerView.scss
+++ b/src/components/app/details/triggerView/triggerView.scss
@@ -30,11 +30,6 @@
     height: calc(100vh - 130px);
 }
 
-.incoming-payload-bottom {
-    height: calc(100vh - 300px);
-    overflow: scroll;
-}
-
 .ci-trigger__webhook-wrapper{
     display: grid;
     grid-template-columns: 250px 1fr;
diff --git a/src/components/bulkEdits/bulkEdit.scss b/src/components/bulkEdits/bulkEdit.scss
index b127647cb8..855557c016 100644
--- a/src/components/bulkEdits/bulkEdit.scss
+++ b/src/components/bulkEdits/bulkEdit.scss
@@ -30,17 +30,6 @@
     align-items: flex-start;
 }
 
-.output-drawer {
-    position: fixed;
-    bottom: 0;
-    left: 64px;
-    width: calc(100vw - 64px);
-    display: grid;
-    z-index: var(--events-logs);
-    overflow: scroll;
-    height: 100%;
-}
-
 .right-readme {
     height: calc(100vh - 97px);
     overflow: auto;
@@ -93,7 +82,7 @@
 .bulk-output-body {
     letter-spacing: 0.2px;
     height: calc(40vh - 36px);
-    overflow: scroll;
+    overflow: auto;
     font-family: monospace;
 }
 
diff --git a/src/components/notifications/notifications.util.tsx b/src/components/notifications/notifications.util.tsx
index f380867868..7aa2c5c838 100644
--- a/src/components/notifications/notifications.util.tsx
+++ b/src/components/notifications/notifications.util.tsx
@@ -225,7 +225,7 @@ export const getSMTPDefaultConfiguration = (shouldBeDefault: boolean): SMTPFormT
 })
 
 export const renderText = (text: string, isLink: boolean = false, linkTo?: () => void, dataTestId?: string) => (
-    <Tooltip content={text} placement="bottom" showOnTruncate={!!text} className="mxh-210 dc__hscroll" interactive>
+    <Tooltip content={text} placement="bottom" showOnTruncate={!!text} className="mxh-210 dc__overflow-auto" interactive>
         {isLink ? (
             <button
                 type="button"
diff --git a/src/components/v2/appDetails/k8Resource/k8resources.scss b/src/components/v2/appDetails/k8Resource/k8resources.scss
index ddef938220..93660a2af0 100644
--- a/src/components/v2/appDetails/k8Resource/k8resources.scss
+++ b/src/components/v2/appDetails/k8Resource/k8resources.scss
@@ -31,7 +31,7 @@
     padding-right: 0;
     padding-left: 0;
     height: '600px';
-    overflow: 'scroll';
+    overflow: 'auto';
 }
 
 .node-row {
diff --git a/src/components/v2/utils/tableUtils/Table.util.tsx b/src/components/v2/utils/tableUtils/Table.util.tsx
index 9297e4da2a..8fa50e87c1 100644
--- a/src/components/v2/utils/tableUtils/Table.util.tsx
+++ b/src/components/v2/utils/tableUtils/Table.util.tsx
@@ -14,9 +14,10 @@
  * limitations under the License.
  */
 
-import React from 'react'
 import './table.scss'
 
+// TODO: Need to check if this component using anywhere
+
 const TableUtil = ({ table, bodyFont = '' }) => {
     return (
         <div className="node-container-fluid generic-table" style={{ minHeight: '600px' }}>
diff --git a/src/css/base.scss b/src/css/base.scss
index 62c0d4517a..a0be6a4d90 100644
--- a/src/css/base.scss
+++ b/src/css/base.scss
@@ -4122,18 +4122,6 @@ textarea {
     overflow: auto !important;
 }
 
-.dc__overflow-scroll {
-    overflow: scroll !important;
-}
-
-.dc__hide-hscroll {
-    overflow-x: hidden;
-}
-
-.dc__hscroll {
-    overflow-x: scroll;
-}
-
 .dc__overflow-initial {
     overflow: initial;
 

From ec51c02c5affc41edf1280e706d70119f332922b Mon Sep 17 00:00:00 2001
From: shivani170 <shivani@devtron.ai>
Date: Fri, 17 Jan 2025 16:09:40 +0530
Subject: [PATCH 09/14] chore: revert css

---
 src/css/base.scss | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/css/base.scss b/src/css/base.scss
index 1a36958e63..3107614c8e 100644
--- a/src/css/base.scss
+++ b/src/css/base.scss
@@ -4136,6 +4136,10 @@ textarea {
     overflow: auto !important;
 }
 
+.dc__hide-hscroll {
+    overflow-x: hidden;
+}
+
 .dc__overflow-initial {
     overflow: initial;
 

From f21691213c21626aa147733b4d7fa7a2a12f6873 Mon Sep 17 00:00:00 2001
From: shivani170 <shivani@devtron.ai>
Date: Fri, 17 Jan 2025 16:12:17 +0530
Subject: [PATCH 10/14] chore: removed unused component

---
 .../v2/utils/tableUtils/Table.util.tsx        | 53 -------------------
 src/components/v2/utils/tableUtils/table.scss | 23 --------
 .../v2/utils/tableUtils/table.type.ts         | 29 ----------
 3 files changed, 105 deletions(-)
 delete mode 100644 src/components/v2/utils/tableUtils/Table.util.tsx
 delete mode 100644 src/components/v2/utils/tableUtils/table.scss
 delete mode 100644 src/components/v2/utils/tableUtils/table.type.ts

diff --git a/src/components/v2/utils/tableUtils/Table.util.tsx b/src/components/v2/utils/tableUtils/Table.util.tsx
deleted file mode 100644
index 8fa50e87c1..0000000000
--- a/src/components/v2/utils/tableUtils/Table.util.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-/*
- * Copyright (c) 2024. Devtron Inc.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import './table.scss'
-
-// TODO: Need to check if this component using anywhere
-
-const TableUtil = ({ table, bodyFont = '' }) => {
-    return (
-        <div className="node-container-fluid generic-table" style={{ minHeight: '600px' }}>
-            <div className="row dc__border-bottom">
-                {table.tHead.map((cell, index) => {
-                    return (
-                        <div key={`th_${index}`} className={`${cell.className} fw-6 cn-9 col pt-8 pb-8`}>
-                            {cell.value}
-                        </div>
-                    )
-                })}
-            </div>
-            <div className="generic-body fs-13 cn-9" style={{ fontFamily: bodyFont }}>
-                {table.tBody.map((tRow, index) => {
-                    return (
-                        <div className="row" key={`tr_${index}`}>
-                            {tRow.map((cell, index) => {
-                                return (
-                                    <div key={`tr_cell_${index}`} className={`${cell.className} col pt-8 pb-8`}>
-                                        {' '}
-                                        {cell.value}{' '}
-                                    </div>
-                                )
-                            })}
-                        </div>
-                    )
-                })}
-            </div>
-        </div>
-    )
-}
-
-export default TableUtil
diff --git a/src/components/v2/utils/tableUtils/table.scss b/src/components/v2/utils/tableUtils/table.scss
deleted file mode 100644
index a95cd1da53..0000000000
--- a/src/components/v2/utils/tableUtils/table.scss
+++ /dev/null
@@ -1,23 +0,0 @@
-/*
- * Copyright (c) 2024. Devtron Inc.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-.generic-body > .row:hover {
-    background: var(--N100);
-}
-
-.generic-body > .row:nth-child(odd) {
-    /* background: var(--N100); */
-}
diff --git a/src/components/v2/utils/tableUtils/table.type.ts b/src/components/v2/utils/tableUtils/table.type.ts
deleted file mode 100644
index 153c0a0748..0000000000
--- a/src/components/v2/utils/tableUtils/table.type.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-/*
- * Copyright (c) 2024. Devtron Inc.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-export interface tCell {
-    value: string
-    icon: string
-    position: string
-    link: string
-    tooltip: string
-    className: string
-}
-
-export interface Table {
-    tHead: tCell[]
-    tBody: tCell[][]
-}

From 01132843f104d60bd8694732441498fd39c78eca Mon Sep 17 00:00:00 2001
From: shivani170 <shivani@devtron.ai>
Date: Fri, 17 Jan 2025 16:13:56 +0530
Subject: [PATCH 11/14] chore: table util component removed from eslint

---
 .eslintignore | 1 -
 1 file changed, 1 deletion(-)

diff --git a/.eslintignore b/.eslintignore
index aadf4dc155..47a0bc5e81 100755
--- a/.eslintignore
+++ b/.eslintignore
@@ -417,7 +417,6 @@ src/components/v2/headers/ChartHeader.component.tsx
 src/components/v2/headers/EAHeader.component.tsx
 src/components/v2/index.tsx
 src/components/v2/utils/tabUtils/useTab.ts
-src/components/v2/utils/tableUtils/Table.util.tsx
 src/components/v2/utils/useSharedState.ts
 src/components/v2/values/ChartValues.component.tsx
 src/components/v2/values/chartValuesDiff/ChartRepoSelector.tsx

From beddfedfce6bf58677bf0cbda7a15e06d7ba71a4 Mon Sep 17 00:00:00 2001
From: shivani170 <shivani@devtron.ai>
Date: Fri, 17 Jan 2025 17:29:53 +0530
Subject: [PATCH 12/14] chore: code typo fix

---
 src/components/app/details/appDetails/AppDetails.tsx      | 8 +++++---
 .../globalConfigurations/globalConfigurations.scss        | 2 +-
 .../sourceInfo/rotatePods/RotatePodsModal.component.tsx   | 6 +++---
 3 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/components/app/details/appDetails/AppDetails.tsx b/src/components/app/details/appDetails/AppDetails.tsx
index 272b06e9b8..6ca04015b3 100644
--- a/src/components/app/details/appDetails/AppDetails.tsx
+++ b/src/components/app/details/appDetails/AppDetails.tsx
@@ -745,20 +745,22 @@ export const Details: React.FC<DetailsType> = ({
         )
     }
 
+    const onClickRotatePodClose = () => setRotateModal(false)
+
     const renderRestartWorkload = () => {
         return (
             <RotatePodsModal
-                onClose={() => setRotateModal(false)}
+                onClose={onClickRotatePodClose}
                 callAppDetailsAPI={callAppDetailsAPI}
                 isDeploymentBlocked={isDeploymentBlocked}
             />
         )
     }
-    const isdeploymentAppDeleting = appDetails?.deploymentAppDeleteRequest || false
+    const isDeploymentAppDeleting = appDetails?.deploymentAppDeleteRequest || false
     return (
         <>
             <div
-                className={`w-100 pt-16 pr-20 pb-16 pl-20 dc__gap-16 ${isdeploymentAppDeleting ? 'app-info-bg' : 'app-info-bg-gradient'}`}
+                className={`w-100 pt-16 pr-20 pb-16 pl-20 dc__gap-16 ${isDeploymentAppDeleting ? 'app-info-bg' : 'app-info-bg-gradient'}`}
             >
                 <SourceInfo
                     appDetails={appDetails}
diff --git a/src/components/globalConfigurations/globalConfigurations.scss b/src/components/globalConfigurations/globalConfigurations.scss
index 135c80b987..7da865618d 100644
--- a/src/components/globalConfigurations/globalConfigurations.scss
+++ b/src/components/globalConfigurations/globalConfigurations.scss
@@ -59,7 +59,7 @@
 
     .global-configuration__component-wrapper {
         padding: 0;
-        overflow: auto;
+        overflow-y: auto;
         position: relative;
         max-height: 100%;
     }
diff --git a/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx b/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx
index 93e85788d3..75ac285257 100644
--- a/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx
+++ b/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx
@@ -62,7 +62,7 @@ export default function RotatePodsModal({ onClose, callAppDetailsAPI, isDeployme
     const [appDetails] = useSharedState(IndexStore.getAppDetails(), IndexStore.getAppDetailsObservable())
     const [showHelp, setShowHelp] = useState(false)
     const [strategy, setStrategy] = useState('')
-    const [deploymentWindowConfimationValue, setDeploymentWindowConfimationValue] = useState('')
+    const [deploymentWindowConfirmationValue, setDeploymentWindowConfirmationValue] = useState('')
     const [showDeploymentWindowConfirmationModal, setShowDeploymentWindowConfirmationModal] = useState(false)
     useEffect(() => {
         getStrategy()
@@ -238,8 +238,8 @@ export default function RotatePodsModal({ onClose, callAppDetailsAPI, isDeployme
         DeploymentWindowConfirmationDialog && (
             <DeploymentWindowConfirmationDialog
                 onClose={onClose}
-                value={deploymentWindowConfimationValue}
-                setValue={setDeploymentWindowConfimationValue}
+                value={deploymentWindowConfirmationValue}
+                setValue={setDeploymentWindowConfirmationValue}
                 isLoading={rotatingInProgress}
                 type={MODAL_TYPE.RESTART}
                 onClickActionButton={handlePodsRotation}

From 2e05d6d8b57d7af9c097eceb3e65d626773e900e Mon Sep 17 00:00:00 2001
From: shivani170 <shivani@devtron.ai>
Date: Mon, 20 Jan 2025 18:48:28 +0530
Subject: [PATCH 13/14] chore: double quotes

---
 .../sourceInfo/rotatePods/RotatePodsModal.component.tsx         | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx b/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx
index 75ac285257..e0b7858828 100644
--- a/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx
+++ b/src/components/v2/appDetails/sourceInfo/rotatePods/RotatePodsModal.component.tsx
@@ -281,7 +281,7 @@ export default function RotatePodsModal({ onClose, callAppDetailsAPI, isDeployme
                                 </div>
                             </Checkbox>
                         </div>
-                        <div className='dc__overflow-auto h-192'>
+                        <div className="dc__overflow-auto h-192">
                             {Array.from(podsToRotate.values()).map((item) => (
                                 <div key={`${item.kind}/${item.name}`} className="check-single-workload mt-16">
                                     <Checkbox

From 0a2103ee5476aedfbe3cdfa369a145aaec660e83 Mon Sep 17 00:00:00 2001
From: shivani170 <shivani@devtron.ai>
Date: Mon, 20 Jan 2025 21:26:22 +0530
Subject: [PATCH 14/14] chore: version bump

---
 package.json | 2 +-
 yarn.lock    | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/package.json b/package.json
index ff67d37be7..1931c3bdb9 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
     "private": true,
     "homepage": "/dashboard",
     "dependencies": {
-        "@devtron-labs/devtron-fe-common-lib": "1.5.2-beta-1",
+        "@devtron-labs/devtron-fe-common-lib": "1.5.3",
         "@esbuild-plugins/node-globals-polyfill": "0.2.3",
         "@rjsf/core": "^5.13.3",
         "@rjsf/utils": "^5.13.3",
diff --git a/yarn.lock b/yarn.lock
index 09efa8b87e..ba7bcceb17 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -981,10 +981,10 @@
   dependencies:
     "@jridgewell/trace-mapping" "0.3.9"
 
-"@devtron-labs/devtron-fe-common-lib@1.5.2":
-  version "1.5.2"
-  resolved "https://registry.yarnpkg.com/@devtron-labs/devtron-fe-common-lib/-/devtron-fe-common-lib-1.5.2.tgz#cabaf2eedaf1a31f28e20f7384f5969eb31a12ff"
-  integrity sha512-X6bjVnHDtHSOmgH2BBM5j81K3ueFN4rITsW2ghsZ29MBQ9WVc/X7Vhg8k/6c7J5yp9r/CKvzzN+vyVv6fsotOg==
+"@devtron-labs/devtron-fe-common-lib@1.5.3":
+  version "1.5.3"
+  resolved "https://registry.yarnpkg.com/@devtron-labs/devtron-fe-common-lib/-/devtron-fe-common-lib-1.5.3.tgz#c33af989de7c0b64101d2d103b46c0a79917cf77"
+  integrity sha512-BC69v4Bn6ymPtKUVzMgFoxzi1L7b/2EGyvllnZhc0GO8nwAVEoDOVx7K+a7VBFbMEQOuYNxJFhZVViFjjDz+jA==
   dependencies:
     "@types/react-dates" "^21.8.6"
     ansi_up "^5.2.1"