feat: enhance resource conflict handling with redeploy functionality and UI improvements

Author: AbhishekA1509

src/Shared/Components/CICDHistory/ResourceConflictDeployDialog.tsx

@@ -5,7 +5,9 @@ import { URLS } from '@Common/Constants'
 import { showError } from '@Common/Helper'
 import { ToastManager, ToastVariantType } from '@Shared/Services'
 
+import { ButtonStyleType } from '../Button'
 import { ConfirmationModal, ConfirmationModalVariantType } from '../ConfirmationModal'
+import { Icon } from '../Icon'
 import { resourceConflictRedeploy } from './service'
 import { ResourceConflictDeployDialogProps, ResourceConflictDeployDialogURLParamsType } from './types'
 
@@ -20,14 +22,15 @@ const ResourceConflictDeployDialog = ({ appName, environmentName, handleClose }:
             await resourceConflictRedeploy({
                 pipelineId,
                 triggerId,
+                appId,
             })
             ToastManager.showToast({
                 variant: ToastVariantType.success,
                 title: 'Redeploy initiated',
                 description: `Redeployment for application '${appName}' in environment '${environmentName}' has been initiated successfully.`,
             })
             handleClose()
-            history.push(`${URLS.APP}/${appId}/details/${envId}`)
+            history.push(`${URLS.APPLICATION_MANAGEMENT_APP}/${appId}/details/${envId}`)
         } catch (error) {
             showError(error)
         } finally {
@@ -37,7 +40,8 @@ const ResourceConflictDeployDialog = ({ appName, environmentName, handleClose }:
 
     return (
         <ConfirmationModal
-            variant={ConfirmationModalVariantType.warning}
+            variant={ConfirmationModalVariantType.custom}
+            Icon={<Icon name="ic-warning" color={null} size={48} />}
             title="Take resource ownership and redeploy"
             subtitle={`Ensure the resources belong to the '${appName}' application and the '${environmentName}' environment to avoid destructive changes.`}
             handleClose={handleClose}
@@ -50,6 +54,7 @@ const ResourceConflictDeployDialog = ({ appName, environmentName, handleClose }:
                     isLoading,
                     text: 'Re-deploy',
                     onClick: handleDeploy,
+                    style: ButtonStyleType.warning,
                 },
             }}
         />

src/Shared/Components/CICDHistory/ResourceConflictDetailsModal.tsx

@@ -39,14 +39,15 @@ const ResourceConflictDetailsModal = ({ appName, environmentName, handleClose }:
             await resourceConflictRedeploy({
                 pipelineId,
                 triggerId,
+                appId,
             })
             ToastManager.showToast({
                 variant: ToastVariantType.success,
                 title: 'Redeploy initiated',
                 description: `Redeployment for application '${appName}' in environment '${environmentName}' has been initiated successfully.`,
             })
             handleClose()
-            history.push(`${URLS.APP}/${appId}/details/${envId}`)
+            history.push(`${URLS.APPLICATION_MANAGEMENT_APP}/${appId}/details/${envId}`)
         } catch (error) {
             showError(error)
         } finally {

src/Shared/Components/CICDHistory/TriggerDetails.tsx

@@ -472,6 +472,10 @@ const TriggerDetails = memo(
             setResourceConflictModal(ResourceConflictModalType.DEPLOY_DIALOG)
         }
 
+        const handleShowResourceConflictDetailsModal = () => {
+            setResourceConflictModal(ResourceConflictModalType.RESOURCE_DETAIL_MODAL)
+        }
+
         const handleCloseRedeployModal = () => {
             setResourceConflictModal(null)
         }
@@ -483,8 +487,9 @@ const TriggerDetails = memo(
                     text="Some Resources"
                     variant={ButtonVariantType.text}
                     size={ComponentSizeType.medium}
+                    onClick={handleShowResourceConflictDetailsModal}
                 />
-
+                 
                 <span className="cn-9 fw-4 fs-13 lh-20 dc__word-break">
                     have ownership conflict. Take resource ownership and re-deploy
                 </span>
@@ -628,22 +633,24 @@ const TriggerDetails = memo(
                                 clusterId={executionInfo?.workerDetails.clusterId || DEFAULT_CLUSTER_ID}
                                 workerPodName={workerPodName}
                                 namespace={namespace}
-                            />
+                            >
+                                {showResourceConflictInfoBlock && (
+                                    <div className="py-12 pr-12">
+                                        <InfoBlock
+                                            description={renderInfoBlockDescription()}
+                                            buttonProps={{
+                                                dataTestId: 'resource-conflict-re-deploy',
+                                                text: 'Re-deploy',
+                                                startIcon: <Icon name="ic-rocket-launch" color={null} />,
+                                                onClick: handleShowRedeployModal,
+                                                variant: ButtonVariantType.text,
+                                                size: ComponentSizeType.medium,
+                                            }}
+                                        />
+                                    </div>
+                                )}
+                            </WorkerStatus>
                         </div>
-
-                        {showResourceConflictInfoBlock && (
-                            <div className="display-grid trigger-details__grid py-4">
-                                <InfoBlock
-                                    description={renderInfoBlockDescription()}
-                                    buttonProps={{
-                                        dataTestId: 'resource-conflict-re-deploy',
-                                        text: 'Re-deploy',
-                                        startIcon: <Icon name="ic-rocket-launch" color={null} />,
-                                        onClick: handleShowRedeployModal,
-                                    }}
-                                />
-                            </div>
-                        )}
                     </div>
                 </div>
 

src/Shared/Components/CICDHistory/WorkerStatus.tsx

@@ -41,6 +41,7 @@ const WorkerStatus = memo(
         titleClassName = 'cn-9 fs-13 fw-4 lh-20',
         viewWorkerPodClassName = 'fs-13',
         hideShowMoreMessageButton = false,
+        children,
     }: WorkerStatusType): JSX.Element | null => {
         if (!message && !podStatus) {
             return null
@@ -98,6 +99,8 @@ const WorkerStatus = memo(
                             hideShowMore={hideShowMoreMessageButton}
                         />
                     )}
+
+                    {children}
                 </div>
             </>
         )

src/Shared/Components/CICDHistory/service.tsx

@@ -17,7 +17,15 @@
 /* eslint-disable dot-notation */
 import moment from 'moment'
 
-import { get, getUrlWithSearchParams, ResponseType, ROUTES, sanitizeUserApprovalMetadata, trash } from '../../../Common'
+import {
+    get,
+    getUrlWithSearchParams,
+    post,
+    ResponseType,
+    ROUTES,
+    sanitizeUserApprovalMetadata,
+    trash,
+} from '../../../Common'
 import { DATE_TIME_FORMAT_STRING, DEPLOYMENT_HISTORY_CONFIGURATION_LIST_MAP, EXTERNAL_TYPES } from '../../constants'
 import { decode, getUniqueId, isNullOrUndefined } from '../../Helpers'
 import { ResourceKindType, ResourceVersionType } from '../../types'
@@ -28,8 +36,9 @@ import {
     DeploymentStatusDetailsResponse,
     FetchIdDataStatus,
     ModuleConfigResponse,
-    ResourceConflictDeployDialogURLParamsType,
     ResourceConflictItemType,
+    ResourceConflictRedeployParamsType,
+    ResourceConflictRedeployPayloadType,
     TriggerDetailsResponseType,
     TriggerHistoryParamsType,
 } from './types'
@@ -295,12 +304,13 @@ export const getTriggerHistory = async ({
 export const getModuleConfigured = (moduleName: string): Promise<ModuleConfigResponse> =>
     get(`${ROUTES.MODULE_CONFIGURED}?name=${moduleName}`)
 
-export const resourceConflictRedeploy = async ({
-    pipelineId,
-    triggerId,
-}: Pick<ResourceConflictDeployDialogURLParamsType, 'pipelineId' | 'triggerId'>) =>
-    // TODO: Fix the route
-    get(`cd-pipeline/re-deploy/${pipelineId}/${triggerId}`)
+export const resourceConflictRedeploy = async ({ pipelineId, triggerId, appId }: ResourceConflictRedeployParamsType) =>
+    post<never, ResourceConflictRedeployPayloadType>(ROUTES.CD_TRIGGER_POST, {
+        pipelineId: +pipelineId,
+        wfrId: +triggerId,
+        appId: +appId,
+        redeployHelmReleaseWithTakeOwnership: true,
+    })
 
 export const getResourceConflictDetails = async (): Promise<ResponseType<ResourceConflictItemType[]>> => ({
     code: 200,

src/Shared/Components/CICDHistory/types.tsx

@@ -409,6 +409,7 @@ export interface WorkerStatusType
      * @default false
      */
     hideShowMoreMessageButton?: boolean
+    children?: ReactNode
 }
 
 export type FinishedType = { artifact: string; type: HistoryComponentType } & (
@@ -903,3 +904,13 @@ export interface CIPipelineSourceConfigInterface {
     primaryBranchAfterRegex?: string
     rootClassName?: string
 }
+
+export interface ResourceConflictRedeployParamsType
+    extends Pick<ResourceConflictDeployDialogURLParamsType, 'pipelineId' | 'triggerId' | 'appId'> {}
+
+export interface ResourceConflictRedeployPayloadType {
+    pipelineId: number
+    appId: number
+    wfrId: number
+    redeployHelmReleaseWithTakeOwnership: true
+}