refactor: clean up deployment status handling and remove deprecated constants

Author: AbhishekA1509

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

@@ -26,6 +26,8 @@ import {
     Button,
     ButtonComponentType,
     DeploymentAppTypes,
+    DeploymentStatusDetailsBreakdownDataType,
+    DeploymentStatusDetailsType,
     GenericEmptyState,
     getAppDetailsURL,
     getAppsInfoForEnv,
@@ -51,12 +53,10 @@ import noGroups from '@Images/[email protected]'
 
 import {
     DEFAULT_STATUS,
-    DEFAULT_STATUS_TEXT,
     DEPLOYMENT_STATUS,
     DEPLOYMENT_STATUS_QUERY_PARAM,
     DOCUMENTATION,
     getAppTriggerURL,
-    HELM_DEPLOYMENT_STATUS_TEXT,
     RESOURCES_NOT_FOUND,
 } from '../../../../config'
 import { APP_DETAILS, ERROR_EMPTY_SCREEN } from '../../../../config/constantMessaging'
@@ -84,8 +84,6 @@ import { getDeploymentStatusDetail } from './appDetails.service'
 import {
     AppDetailProps,
     DeletedAppComponentType,
-    DeploymentStatusDetailsBreakdownDataType,
-    DeploymentStatusDetailsType,
     DetailsType,
     ErrorItem,
     HibernationModalTypes,
@@ -288,7 +286,6 @@ const Details: React.FC<DetailsType> = ({
                 ? processVirtualEnvironmentDeploymentData()
                 : processDeploymentStatusDetailsData()),
             deploymentStatus: DEFAULT_STATUS,
-            deploymentStatusText: DEFAULT_STATUS_TEXT,
         })
     const isConfigDriftEnabled: boolean = window._env_.FEATURE_CONFIG_DRIFT_ENABLE && !!ConfigDriftModal
     const isExternalToolAvailable: boolean =
@@ -487,10 +484,7 @@ const Details: React.FC<DetailsType> = ({
                             ...deploymentStatusDetailsBreakdownData,
                             deploymentStatus:
                                 DEPLOYMENT_STATUS[deploymentStatusDetailRes.result.wfrStatus?.toUpperCase()],
-                            deploymentStatusText:
-                                deploymentStatusDetailRes.result.wfrStatus === HELM_DEPLOYMENT_STATUS_TEXT.PROGRESSING
-                                    ? HELM_DEPLOYMENT_STATUS_TEXT.INPROGRESS
-                                    : deploymentStatusDetailRes.result.wfrStatus,
+                            // TODO: Need to confirm while review why we parse progressing to in progress?
                             deploymentTriggerTime: deploymentStatusDetailRes.result.deploymentStartedOn,
                             deploymentEndTime: deploymentStatusDetailRes.result.deploymentFinishedOn,
                             triggeredBy: deploymentStatusDetailRes.result.triggeredBy,

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

@@ -18,10 +18,12 @@ import React from 'react'
 import { useHistory } from 'react-router-dom'
 import Tippy from '@tippyjs/react'
 
+import { DEPLOYMENT_STATUS_TEXT_MAP, PROGRESSING_DEPLOYMENT_STATUS } from '@devtron-labs/devtron-fe-common-lib'
+
 import { ReactComponent as CD } from '../../../../assets/icons/ic-CD.svg'
 import { ReactComponent as ICHelpOutline } from '../../../../assets/icons/ic-help-outline.svg'
 import { ReactComponent as Rocket } from '../../../../assets/icons/ic-paper-rocket.svg'
-import { DEPLOYMENT_STATUS, DEPLOYMENT_STATUS_QUERY_PARAM } from '../../../../config'
+import { DEPLOYMENT_STATUS_QUERY_PARAM } from '../../../../config'
 import { DeploymentStatusCardType } from './appDetails.type'
 import LoadingCard from './LoadingCard'
 import { validateMomentDate } from './utils'
@@ -41,16 +43,9 @@ const DeploymentStatusCard = ({
             search: DEPLOYMENT_STATUS_QUERY_PARAM,
         })
     }
-    const ProgressingStateList: string[] = [
-        DEPLOYMENT_STATUS.INPROGRESS,
-        DEPLOYMENT_STATUS.PROGRESSING,
-        DEPLOYMENT_STATUS.STARTING,
-        DEPLOYMENT_STATUS.INITIATING,
-        DEPLOYMENT_STATUS.CHECKING,
-    ]
+
     const renderDeploymentStatus = () => {
-        const { triggeredBy, deploymentStatus, deploymentTriggerTime, deploymentStatusText } =
-            deploymentStatusDetailsBreakdownData
+        const { triggeredBy, deploymentStatus, deploymentTriggerTime } = deploymentStatusDetailsBreakdownData
         return (
             <>
                 <div className="app-details-info-card__top-container flex">
@@ -73,10 +68,10 @@ const DeploymentStatusCard = ({
                             <span
                                 data-testid="deployment-status-name"
                                 className={`app-summary__status-name fs-13 mr-8 fw-6 f-${deploymentStatus?.toLowerCase()} ${
-                                    ProgressingStateList.includes(deploymentStatus) ? 'dc__loading-dots' : ''
+                                    PROGRESSING_DEPLOYMENT_STATUS.includes(deploymentStatus) ? 'dc__loading-dots' : ''
                                 }`}
                             >
-                                {deploymentStatusText}
+                                {DEPLOYMENT_STATUS_TEXT_MAP[deploymentStatus] || deploymentStatus}
                             </span>
                         </div>
                     </div>

src/components/app/details/appDetails/appDetails.service.ts

@@ -14,7 +14,13 @@
  * limitations under the License.
  */
 
-import { get, getUrlWithSearchParams, ResponseType, trash } from '@devtron-labs/devtron-fe-common-lib'
+import {
+    DeploymentStatusDetailsResponse,
+    get,
+    getUrlWithSearchParams,
+    ResponseType,
+    trash,
+} from '@devtron-labs/devtron-fe-common-lib'
 
 import { Routes } from '../../../../config'
 import { fetchWithFullRoute } from '../../../../services/fetchWithFullRoute'
@@ -24,7 +30,6 @@ import {
     DataSourceDetailsDTO,
     DataSourceDetailsQueryParams,
     DataSourceDetailsType,
-    DeploymentStatusDetailsResponse,
     ModuleConfigResponse,
 } from './appDetails.type'
 

src/components/app/details/appDetails/appDetails.type.ts

@@ -17,6 +17,7 @@
 import {
     ACTION_STATE,
     AppEnvironment,
+    DeploymentStatusDetailsBreakdownDataType,
     EnvAppsMetaDTO,
     ResponseType,
     ScanResultDTO,
@@ -83,48 +84,6 @@ export interface DeploymentStatusDetailsTimelineType {
     resourceDetails?: SyncStageResourceDetail[]
 }
 
-export interface DeploymentStatusDetailsType {
-    deploymentFinishedOn: string
-    deploymentStartedOn: string
-    triggeredBy: string
-    statusFetchCount: number
-    statusLastFetchedAt: string
-    timelines: DeploymentStatusDetailsTimelineType[]
-    wfrStatus?: string
-}
-
-export interface DeploymentStatusDetailsResponse extends ResponseType {
-    result?: DeploymentStatusDetailsType
-}
-
-interface DeploymentStatusDetailRow {
-    icon: string
-    displayText: string
-    displaySubText: string
-    time: string
-    resourceDetails?: any
-    isCollapsed?: boolean
-    kubeList?: { icon: any; message: string }[]
-    timelineStatus?: string
-}
-export interface DeploymentStatusDetailsBreakdownDataType {
-    deploymentStatus: string
-    deploymentStatusText: string
-    deploymentTriggerTime: string
-    deploymentEndTime: string
-    deploymentError: string
-    triggeredBy: string
-    nonDeploymentError: string
-    deploymentStatusBreakdown: {
-        DEPLOYMENT_INITIATED: DeploymentStatusDetailRow
-        GIT_COMMIT?: DeploymentStatusDetailRow
-        ARGOCD_SYNC?: DeploymentStatusDetailRow
-        KUBECTL_APPLY?: DeploymentStatusDetailRow
-        APP_HEALTH?: DeploymentStatusDetailRow
-        HELM_PACKAGE_GENERATED?: DeploymentStatusDetailRow
-    }
-}
-
 export interface ModuleConfigResponse extends ResponseType {
     result?: {
         enabled: boolean

src/components/app/types.ts

@@ -29,8 +29,9 @@ import {
     TagsTableColumnsType,
     DynamicDataTableCellErrorType,
     BaseAppMetaData,
+    DeploymentStatusDetailsBreakdownDataType,
 } from '@devtron-labs/devtron-fe-common-lib'
-import { DeploymentStatusDetailsBreakdownDataType, DetailsType, ErrorItem, HibernationModalTypes } from './details/appDetails/appDetails.type'
+import { DetailsType, ErrorItem, HibernationModalTypes } from './details/appDetails/appDetails.type'
 import { GroupFilterType } from '../ApplicationGroup/AppGroup.types'
 import { APP_TYPE } from '@Config/constants'
 import { CreateAppFormStateType } from '@Pages/App/CreateAppModal/types'

src/components/v2/appDetails/AppDetails.component.tsx

@@ -21,19 +21,17 @@ import {
     AppStatusModal,
     AppStatusModalTabType,
     DeploymentAppTypes,
+    DeploymentStatusDetailsBreakdownDataType,
+    DeploymentStatusDetailsType,
     noop,
     processDeploymentStatusDetailsData,
     Progressing,
 } from '@devtron-labs/devtron-fe-common-lib'
 
 import { ClusterMetaDataBar } from '@Components/common/ClusterMetaDataBar/ClusterMetaDataBar'
 
-import { DEFAULT_STATUS, DEFAULT_STATUS_TEXT, DEPLOYMENT_STATUS, DEPLOYMENT_STATUS_QUERY_PARAM } from '../../../config'
+import { DEFAULT_STATUS, DEPLOYMENT_STATUS, DEPLOYMENT_STATUS_QUERY_PARAM } from '../../../config'
 import { getDeploymentStatusDetail } from '../../app/details/appDetails/appDetails.service'
-import {
-    DeploymentStatusDetailsBreakdownDataType,
-    DeploymentStatusDetailsType,
-} from '../../app/details/appDetails/appDetails.type'
 import { importComponentFromFELibrary } from '../../common'
 import { AppLevelExternalLinks } from '../../externalLinks/ExternalLinks.component'
 import { useSharedState } from '../utils/useSharedState'
@@ -84,7 +82,6 @@ const AppDetailsComponent = ({
                 ? processVirtualEnvironmentDeploymentData()
                 : processDeploymentStatusDetailsData()),
             deploymentStatus: DEFAULT_STATUS,
-            deploymentStatusText: DEFAULT_STATUS_TEXT,
         })
 
     useEffect(() => {

src/components/v2/appDetails/sourceInfo/environment.type.ts

@@ -16,9 +16,11 @@
 
 import React from 'react'
 
-import { AppEnvironment as BaseAppEnvironmentType } from '@devtron-labs/devtron-fe-common-lib'
+import {
+    AppEnvironment as BaseAppEnvironmentType,
+    DeploymentStatusDetailsBreakdownDataType,
+} from '@devtron-labs/devtron-fe-common-lib'
 
-import { DeploymentStatusDetailsBreakdownDataType } from '../../../app/details/appDetails/appDetails.type'
 import { HelmReleaseStatus } from '../../../external-apps/ExternalAppService'
 import { AppDetails } from '../appDetails.type'
 

src/config/constants.ts

@@ -24,7 +24,6 @@ import {
     RegistryCredentialsType,
 } from '@devtron-labs/devtron-fe-common-lib'
 export const DEFAULT_STATUS = 'checking'
-export const DEFAULT_STATUS_TEXT = 'Checking Status'
 export const DEFAULTK8SVERSION = 'v1.16.0'
 export const TOKEN_COOKIE_NAME = 'argocd.token'
 export const DEVTRON_DEFAULT_RELEASE_NAME = 'devtron'
@@ -696,32 +695,6 @@ export const CHART_REPO_LABEL = [
     { value: 'PRIVATE', label: 'Private repository' },
 ]
 
-/**
- * @deprecated - use from fe-common
- */
-export enum TIMELINE_STATUS {
-    DEPLOYMENT_INITIATED = 'DEPLOYMENT_INITIATED',
-    GIT_COMMIT = 'GIT_COMMIT',
-    GIT_COMMIT_FAILED = 'GIT_COMMIT_FAILED',
-    ARGOCD_SYNC = 'ARGOCD_SYNC',
-    ARGOCD_SYNC_FAILED = 'ARGOCD_SYNC_FAILED',
-    KUBECTL_APPLY = 'KUBECTL_APPLY',
-    KUBECTL_APPLY_STARTED = 'KUBECTL_APPLY_STARTED',
-    KUBECTL_APPLY_SYNCED = 'KUBECTL_APPLY_SYNCED',
-    HEALTHY = 'HEALTHY',
-    APP_HEALTH = 'APP_HEALTH',
-    DEPLOYMENT_FAILED = 'FAILED',
-    FETCH_TIMED_OUT = 'TIMED_OUT',
-    UNABLE_TO_FETCH_STATUS = 'UNABLE_TO_FETCH_STATUS',
-    DEGRADED = 'DEGRADED',
-    DEPLOYMENT_SUPERSEDED = 'DEPLOYMENT_SUPERSEDED',
-    ABORTED = 'ABORTED',
-    INPROGRESS = 'INPROGRESS',
-    HELM_PACKAGE_GENERATED = 'HELM_PACKAGE_GENERATED',
-    HELM_MANIFEST_PUSHED_TO_HELM_REPO = 'HELM_MANIFEST_PUSHED_TO_HELM_REPO',
-    HELM_MANIFEST_PUSHED_TO_HELM_REPO_FAILED = 'HELM_MANIFEST_PUSHED_TO_HELM_REPO_FAILED',
-}
-
 /**
  * @deprecated - use from fe-common
  */