Merge branch 'develop' of https://github.com/devtron-labs/dashboard into feat/replace-conf-dialogs

Author: arunjaindev

.eslintignore

@@ -127,7 +127,6 @@ src/components/app/list/appList.modal.ts
 src/components/app/list/emptyView/Empty.tsx
 src/components/app/list/expandedRow/ExpandedRow.tsx
 src/components/app/service.ts
-src/components/app/types.ts
 src/components/bulkEdits/BulkEdits.tsx
 src/components/bulkEdits/bulkedit.utils.tsx
 src/components/cdPipeline/BuildCD.tsx

src/components/app/details/appDetails/AppDetails.tsx

@@ -32,6 +32,7 @@ import {
     getAppDetailsURL,
     getAppsInfoForEnv,
     getIsRequestAborted,
+    Icon,
     MODAL_TYPE,
     noop,
     processDeploymentStatusDetailsData,
@@ -87,6 +88,7 @@ import {
 } from './appDetails.type'
 import AppDetailsCDButton from './AppDetailsCDButton'
 import { AppMetrics } from './AppMetrics'
+import { AG_APP_DETAILS_GA_EVENTS, DA_APP_DETAILS_GA_EVENTS } from './constants'
 import HibernateModal from './HibernateModal'
 import IssuesListingModal from './IssuesListingModal'
 import { SourceInfo } from './SourceInfo'
@@ -524,7 +526,7 @@ const Details: React.FC<DetailsType> = ({
         setShowAppStatusModal(true)
     }
 
-    const renderAppDetailsCDButton = () =>
+    const renderSelectImageButton = () =>
         appDetails && (
             <AppDetailsCDButton
                 appId={appDetails.appId}
@@ -540,9 +542,17 @@ const Details: React.FC<DetailsType> = ({
                     deploymentUserActionState,
                     triggerType: appDetails.triggerType,
                 }}
-                isForEmptyState
                 handleSuccess={callAppDetailsAPI}
-                isAppView={isAppView}
+                gaEvent={
+                    isAppView
+                        ? DA_APP_DETAILS_GA_EVENTS.DeployButtonClicked
+                        : AG_APP_DETAILS_GA_EVENTS.DeployButtonClicked
+                }
+                buttonProps={{
+                    dataTestId: 'select-image-to-deploy',
+                    startIcon: <Icon name="ic-hand-pointing" color={null} />,
+                    text: 'Select Image to deploy',
+                }}
             />
         )
 
@@ -577,7 +587,7 @@ const Details: React.FC<DetailsType> = ({
                         image={noGroups}
                         title={ERROR_EMPTY_SCREEN.ALL_SET_GO_CONFIGURE}
                         subtitle={ERROR_EMPTY_SCREEN.DEPLOYEMENT_WILL_BE_HERE}
-                        renderCustomButton={renderAppDetailsCDButton}
+                        renderCustomButton={renderSelectImageButton}
                     />
                 )}
             </>

src/components/app/details/appDetails/AppDetailsCDButton.tsx

@@ -20,25 +20,19 @@ import { useHistory, useLocation } from 'react-router-dom'
 
 import {
     Button,
-    ButtonVariantType,
-    ComponentSizeType,
     DeploymentNodeType,
-    Icon,
     stopPropagation,
     useSearchString,
     VisibleModal,
 } from '@devtron-labs/devtron-fe-common-lib'
 
-import { BUTTON_TITLE } from '../../../ApplicationGroup/Constants'
 import { importComponentFromFELibrary } from '../../../common'
 import { URL_PARAM_MODE_TYPE } from '../../../common/helpers/types'
 import { getModuleInfo } from '../../../v2/devtronStackManager/DevtronStackManager.service'
 import { AppDetailsCDButtonType } from '../../types'
 import CDMaterial from '../triggerView/cdMaterial'
 import { TRIGGER_VIEW_PARAMS } from '../triggerView/Constants'
 import { MATERIAL_TYPE } from '../triggerView/types'
-import { AG_APP_DETAILS_GA_EVENTS, DA_APP_DETAILS_GA_EVENTS } from './constants'
-import { getDeployButtonConfig } from './utils'
 
 const ApprovalMaterialModal = importComponentFromFELibrary('ApprovalMaterialModal')
 
@@ -49,19 +43,19 @@ const AppDetailsCDButton = ({
     cdModal,
     deploymentAppType,
     isVirtualEnvironment,
-    deploymentUserActionState,
     loadingDetails,
     environmentName,
-    isForEmptyState = false,
     handleSuccess,
-    isAppView,
     isForRollback = false,
+    buttonProps,
+    gaEvent,
 }: AppDetailsCDButtonType): JSX.Element => {
     const history = useHistory()
     const { searchParams } = useSearchString()
     const location = useLocation()
     const queryParams = new URLSearchParams(location.search)
     const mode = queryParams.get('mode')
+
     // deriving from URL and not props as on app details multiple instances exist, but we are rendering only one at a time
     const materialType = queryParams.get('materialType')
 
@@ -78,42 +72,14 @@ const AppDetailsCDButton = ({
             search: new URLSearchParams(newParams).toString(),
         })
 
-        if (isForRollback) {
-            ReactGA.event(DA_APP_DETAILS_GA_EVENTS.RollbackButtonClicked)
-            return
-        }
-        ReactGA.event(
-            isAppView ? DA_APP_DETAILS_GA_EVENTS.DeployButtonClicked : AG_APP_DETAILS_GA_EVENTS.DeployButtonClicked,
-        )
+        ReactGA.event(gaEvent)
     }
 
     const closeCDModal = (e: React.MouseEvent): void => {
         stopPropagation(e)
         history.push({ search: '' })
     }
 
-    const { buttonStyle, iconName } = getDeployButtonConfig(deploymentUserActionState, isForEmptyState)
-
-    const renderDeployButton = () =>
-        isForRollback ? (
-            <Button
-                dataTestId="rollback-button"
-                text="Rollback"
-                variant={ButtonVariantType.text}
-                onClick={onClickDeployButton}
-                size={ComponentSizeType.small}
-            />
-        ) : (
-            <Button
-                dataTestId="deploy-button"
-                size={isForEmptyState ? ComponentSizeType.large : ComponentSizeType.small}
-                text={isForEmptyState ? 'Select Image to Deploy' : BUTTON_TITLE[DeploymentNodeType.CD]}
-                startIcon={iconName && <Icon name={iconName} color={null} />}
-                onClick={onClickDeployButton}
-                style={buttonStyle}
-            />
-        )
-
     const node = {
         environmentName,
         parentEnvironmentName: cdModal.parentEnvironmentName,
@@ -165,7 +131,7 @@ const AppDetailsCDButton = ({
 
     return (
         <>
-            {renderDeployButton()}
+            <Button {...buttonProps} onClick={onClickDeployButton} />
             {renderCDModal()}
             {renderApprovalMaterial()}
         </>