Merge pull request #261 from devtron-labs/fix/approve-material

fix: approve material

Author: AbhishekA1509

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "0.2.6-beta-7",
+    "version": "0.2.6-beta-9",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",

package.json

@@ -37,6 +37,8 @@ import {
     ImageApprovalPolicyType,
     ImageApprovalUsersInfoDTO,
     UserApprovalMetadataType,
+    UserApprovalConfigType,
+    CDMaterialListModalServiceUtilProps,
 } from './Types'
 import { ApiResourceType } from '../Pages'
 import { getIsManualApprovalSpecific, sanitizeUserApprovalConfig, stringComparatorBySortOrder } from '@Shared/Helpers'
@@ -88,30 +90,35 @@ export function setImageTags(request, pipelineId: number, artifactId: number) {
     return post(`${ROUTES.IMAGE_TAGGING}/${pipelineId}/${artifactId}`, request)
 }
 
-const sanitizeApprovalConfigFromApprovalMetadata = (approvalMetadata: UserApprovalMetadataType):UserApprovalMetadataType  => {
+const sanitizeApprovalConfigFromApprovalMetadata = (
+    approvalMetadata: UserApprovalMetadataType,
+    userApprovalConfig: UserApprovalConfigType,
+): UserApprovalMetadataType => {
     if (!approvalMetadata) {
         return null
     }
 
     const approvedUsersData = approvalMetadata.approvedUsersData || []
+    const unsanitizedApprovalConfig = approvalMetadata.approvalConfig || userApprovalConfig
 
     return {
         ...approvalMetadata,
         approvedUsersData: approvedUsersData.map((userData) => ({
             ...userData,
             userGroups: userData.userGroups?.filter((group) => !!group?.identifier && !!group?.name) ?? [],
         })),
-        approvalConfig: sanitizeUserApprovalConfig(approvalMetadata.approvalConfig),
+        approvalConfig: sanitizeUserApprovalConfig(unsanitizedApprovalConfig),
     }
 }
 
-const cdMaterialListModal = (
-    artifacts: any[],
-    offset: number,
-    artifactId?: number,
-    artifactStatus?: string,
-    disableDefaultSelection?: boolean,
-) => {
+const cdMaterialListModal = ({
+    artifacts,
+    offset,
+    artifactId,
+    artifactStatus,
+    disableDefaultSelection,
+    userApprovalConfig,
+}: CDMaterialListModalServiceUtilProps) => {
     if (!artifacts || !artifacts.length) return []
 
     const markFirstSelected = offset === 0
@@ -155,7 +162,10 @@ const cdMaterialListModal = (
             vulnerable: material.vulnerable,
             runningOnParentCd: material.runningOnParentCd,
             artifactStatus: artifactStatusValue,
-            userApprovalMetadata: sanitizeApprovalConfigFromApprovalMetadata(material.userApprovalMetadata),
+            userApprovalMetadata: sanitizeApprovalConfigFromApprovalMetadata(
+                material.userApprovalMetadata,
+                userApprovalConfig,
+            ),
             triggeredBy: material.triggeredBy,
             isVirtualEnvironment: material.isVirtualEnvironment,
             imageComment: material.imageComment,
@@ -356,13 +366,14 @@ export const processCDMaterialServiceResponse = (
         }
     }
 
-    const materials = cdMaterialListModal(
-        cdMaterialsResult.ci_artifacts,
-        offset ?? 0,
-        cdMaterialsResult.latest_wf_artifact_id,
-        cdMaterialsResult.latest_wf_artifact_status,
+    const materials = cdMaterialListModal({
+        artifacts: cdMaterialsResult.ci_artifacts,
+        offset: offset ?? 0,
+        artifactId: cdMaterialsResult.latest_wf_artifact_id,
+        artifactStatus: cdMaterialsResult.latest_wf_artifact_status,
         disableDefaultSelection,
-    )
+        userApprovalConfig: cdMaterialsResult.userApprovalConfig,
+    })
     const approvalInfo = processCDMaterialsApprovalInfo(
         stage === DeploymentNodeType.CD || stage === DeploymentNodeType.APPROVAL,
         cdMaterialsResult,

src/Common/Common.service.ts

@@ -448,6 +448,15 @@ export interface ArtifactReleaseMappingType {
     version: string
 }
 
+export interface CDMaterialListModalServiceUtilProps {
+    artifacts: any[],
+    offset: number,
+    artifactId?: number,
+    artifactStatus?: string,
+    disableDefaultSelection?: boolean,
+    userApprovalConfig?: UserApprovalConfigType,
+}
+
 export interface CDMaterialType {
     index: number
     id: string
@@ -669,6 +678,9 @@ export interface CDMaterialsApprovalInfo {
     approvalUsers: string[]
     userApprovalConfig: UserApprovalConfigType
     canApproverDeploy: boolean
+    /**
+     * Only available incase of approvals do'nt use in cd materials or any other flow since approvalUsers are not present there
+     */
     imageApprovalPolicyDetails: ImageApprovalPolicyType
 }
 

src/Common/Types.ts

@@ -70,7 +70,7 @@ export const CIListItem = ({
     return (
         <>
             {type === 'deployed-artifact' && (
-                <div className="flex dc__width-inherit">
+                <div className="flex dc__width-inherit pb-12">
                     <div className="w-50 text-underline-dashed-300" />
                     <Down className="icon-dim-16 ml-8 mr-8" style={{ transform: 'rotate(90deg)' }} />
                     <div className="w-50 text-underline-dashed-300" />

src/Shared/Components/CICDHistory/Artifacts.tsx

@@ -161,7 +161,7 @@ export const GitChanges = ({
                 ) : null
             })}
             {artifact && (
-                <div className="history-component__artifact flex left column dc__gap-12">
+                <div className="history-component__artifact flex left column">
                     <CIListItem
                         type="deployed-artifact"
                         userApprovalMetadata={userApprovalMetadata}