feat: trivy Image scanning module Integration

.env

@@ -29,4 +29,5 @@ CLUSTER_TERMINAL_CONNECTION_RETRY_COUNT=7
 ENABLE_CHART_SEARCH_IN_HELM_DEPLOY=false
 HIDE_EXCLUDE_INCLUDE_GIT_COMMITS=true
 ENABLE_BUILD_CONTEXT=false
-ENABLE_RESTART_WORKLOAD=false
+CLAIR_TOOL_VERSION= 
+ENABLE_RESTART_WORKLOAD=false

src/components/app/details/cIDetails/CIDetails.tsx

@@ -8,7 +8,7 @@ import { useRouteMatch, useParams, useHistory, generatePath } from 'react-router
 import { BuildDetails, CIPipeline, HistoryLogsType, SecurityTabType } from './types'
 import { ReactComponent as Down } from '../../../../assets/icons/ic-dropdown-filled.svg'
 import { getLastExecutionByArtifactId } from '../../../../services/service'
-import { ScanDisabledView, ImageNotScannedView, NoVulnerabilityView, CIRunningView } from './cIDetails.util'
+import { ScanDisabledView, ImageNotScannedView, CIRunningView } from './cIDetails.util'
 import './ciDetails.scss'
 import { getModuleInfo } from '../../../v2/devtronStackManager/DevtronStackManager.service'
 import { ModuleStatus } from '../../../v2/devtronStackManager/DevtronStackManager.type'
@@ -20,6 +20,8 @@ import Artifacts from '../cicdHistory/Artifacts'
 import { CICDSidebarFilterOptionType, History, HistoryComponentType } from '../cicdHistory/types'
 import LogsRenderer from '../cicdHistory/LogsRenderer'
 import { EMPTY_STATE_STATUS } from '../../../../config/constantMessaging'
+import  novulnerability from '../../../../assets/img/ic-vulnerability-not-found.svg';
+import { ScannedByToolModal } from '../../../common/security/ScannedByToolModal'
 
 const terminalStatus = new Set(['succeeded', 'failed', 'error', 'cancelled', 'nottriggered', 'notbuilt'])
 let statusSet = new Set(['starting', 'running', 'pending'])
@@ -390,6 +392,21 @@ const HistoryLogs = ({ triggerDetails, isBlobStorageConfigured, isJobView, appId
         </div>
     )
 }
+export function NoVulnerabilityViewWithTool({scanToolId}:{scanToolId:number}) {
+    return (
+        <div className="flex h-100">
+            <GenericEmptyState
+                image={novulnerability}
+                title={EMPTY_STATE_STATUS.CI_DEATILS_NO_VULNERABILITY_FOUND}
+                children={
+                    <span className="flex workflow__header dc__border-radius-24 bcn-0">
+                        <ScannedByToolModal scanToolId={scanToolId} />
+                    </span>
+                }
+            />
+        </div>
+    )
+}
 
 const SecurityTab = ({ ciPipelineId, artifactId, status, appIdFromParent }: SecurityTabType) => {
     const [isCollapsed, setIsCollapsed] = useState(false)
@@ -405,6 +422,7 @@ const SecurityTab = ({ ciPipelineId, artifactId, status, appIdFromParent }: Secu
         scanned: false,
         isLoading: !!artifactId,
         isError: false,
+        ScanToolId: null,
     })
     const { appId } = useParams<{ appId: string }>()
     const { push } = useHistory()
@@ -419,6 +437,7 @@ const SecurityTab = ({ ciPipelineId, artifactId, status, appIdFromParent }: Secu
                 scanned: result.scanned,
                 isLoading: false,
                 isError: false,
+                ScanToolId: result.scanToolId,
             })
         } catch (error) {
             // showError(error);
@@ -433,7 +452,7 @@ const SecurityTab = ({ ciPipelineId, artifactId, status, appIdFromParent }: Secu
     function toggleCollapse() {
         setIsCollapsed(!isCollapsed)
     }
-
+        
     useEffect(() => {
         if (artifactId) {
             callGetSecurityIssues()
@@ -472,8 +491,9 @@ const SecurityTab = ({ ciPipelineId, artifactId, status, appIdFromParent }: Secu
             return <ImageNotScannedView />
         }
     } else if (artifactId && securityData.scanned && !securityData.vulnerabilities.length) {
-        return <NoVulnerabilityView />
+        return <NoVulnerabilityViewWithTool scanToolId={securityData.ScanToolId}/>  
     }
+    const scanToolId= securityData.ScanToolId
 
     return (
         <>
@@ -497,7 +517,9 @@ const SecurityTab = ({ ciPipelineId, artifactId, status, appIdFromParent }: Secu
                     {severityCount.critical === 0 && severityCount.moderate === 0 && severityCount.low !== 0 ? (
                         <span className="dc__fill-low">{severityCount.low} Low</span>
                     ) : null}
-                    <div className="security-scan__type">post build execution</div>
+                    <div className="security-scan__type flex">
+                        <ScannedByToolModal scanToolId={scanToolId}/>
+                    </div>
                 </div>
                 {isCollapsed ? (
                     ''

src/components/app/details/triggerView/Constants.ts

@@ -10,7 +10,8 @@ export const CI_MATERIAL_EMPTY_STATE_MESSAGING = {
     Retry: 'Retry',
     WebhookModalCTA: 'View all incoming webhook payloads',
     NoCommitEligibleCommit: 'No eligible commit found in recent commits',
-    NoCommitEligibleCommitSubtitle: 'Commits that contain changes only in excluded files or folders are not eligible for build.',
+    NoCommitEligibleCommitSubtitle:
+        'Commits that contain changes only in excluded files or folders are not eligible for build.',
     NoCommitEligibleCommitButtonText: 'Show excluded commits',
 }
 export const IGNORE_CACHE_INFO = {
@@ -25,11 +26,11 @@ export const IGNORE_CACHE_INFO = {
     },
     CacheNotAvailable: {
         title: 'Cache will be generated for this pipeline run',
-        infoText: 'Cache will be used in future runs to reduce build time.'
+        infoText: 'Cache will be used in future runs to reduce build time.',
     },
     IgnoreCache: {
         title: 'Ignore Cache',
-        infoText: 'Ignoring cache will lead to longer build time.'
+        infoText: 'Ignoring cache will lead to longer build time.',
     },
 }
 export const BRANCH_REGEX_MODAL_MESSAGING = {
@@ -75,11 +76,20 @@ export const TRIGGER_VIEW_GA_EVENTS = {
     ApprovalNodeClicked: {
         category: 'Trigger View',
         action: 'Approval Node Clicked',
-    }
+    },
 }
 
 export const ARTIFACT_STATUS = {
     Progressing: 'Progressing',
     Degraded: 'Degraded',
     Failed: 'Failed',
 }
+
+export const NO_VULNERABILITY_TEXT = {
+    Secured: 'You’re secure!',
+    NoVulnerabilityFound: 'No security vulnerability found for this image.',
+}
+export const IMAGE_SCAN_TOOL = {
+    Clair: 'Clair',
+    Trivy: 'Trivy',
+}

src/components/app/details/triggerView/TriggerView.tsx

@@ -921,6 +921,7 @@ class TriggerView extends Component<TriggerViewProps, TriggerViewState> {
                                 node[this.state.materialType][materialIndex]['lastExecution'] =
                                     response.result.lastExecution
                                 node[this.state.materialType][materialIndex]['vulnerabilitiesLoading'] = false
+                                node[this.state.materialType][materialIndex]['scanToolId']=response.result.scanToolId
                             }
                             return node
                         })

src/components/app/details/triggerView/cdMaterial.tsx

@@ -42,7 +42,6 @@ import { CDButtonLabelMap, getCommonConfigSelectStyles, TriggerViewContext } fro
 import { getLatestDeploymentConfig, getRecentDeploymentConfig, getSpecificDeploymentConfig } from '../../service'
 import GitCommitInfoGeneric from '../../../common/GitCommitInfoGeneric'
 import { getModuleInfo } from '../../../v2/devtronStackManager/DevtronStackManager.service'
-import { ModuleNameMap } from '../../../../config'
 import { ModuleStatus } from '../../../v2/devtronStackManager/DevtronStackManager.type'
 import { DropdownIndicator, Option } from '../../../v2/common/ReactSelect.utils'
 import {
@@ -54,7 +53,9 @@ import {
 } from './TriggerView.utils'
 import TriggerViewConfigDiff from './triggerViewConfigDiff/TriggerViewConfigDiff'
 import Tippy from '@tippyjs/react'
-import { ARTIFACT_STATUS } from './Constants'
+import { ARTIFACT_STATUS,NO_VULNERABILITY_TEXT} from './Constants'
+import { ScannedByToolModal } from '../../../common/security/ScannedByToolModal'
+import { ModuleNameMap } from '../../../../config'
 
 const ApprovalInfoTippy = importComponentFromFELibrary('ApprovalInfoTippy')
 const ExpireApproval = importComponentFromFELibrary('ExpireApproval')
@@ -221,15 +222,24 @@ export class CDMaterial extends Component<CDMaterialProps, CDMaterialState> {
             )
         } else if (!mat.vulnerabilitiesLoading && mat.vulnerabilities.length === 0) {
             return (
-                <div className="security-tab-empty">
-                    <p className="security-tab-empty__title">No vulnerabilities Found</p>
+                <div className="security-tab-empty summary-view__card">
+                    <p className="security-tab-empty__title">{NO_VULNERABILITY_TEXT.Secured}</p>
+                    <p>{NO_VULNERABILITY_TEXT.NoVulnerabilityFound}</p>
                     <p className="security-tab-empty__subtitle">{mat.lastExecution}</p>
+                    <p className="workflow__header dc__border-radius-24 bcn-0">
+                        <ScannedByToolModal scanToolId={mat.scanToolId} />
+                    </p>
                 </div>
             )
         } else
             return (
                 <div className="security-tab">
-                    <p className="security-tab__last-scanned">Scanned on {mat.lastExecution} </p>
+                    <div className="flexbox dc__content-space">
+                        <span className="flex left security-tab__last-scanned ">Scanned on {mat.lastExecution} </span>
+                        <span className="flex right">
+                            <ScannedByToolModal scanToolId={mat.scanToolId} />
+                        </span>
+                    </div>
                     <ScanVulnerabilitiesTable vulnerabilities={mat.vulnerabilities} />
                 </div>
             )

src/components/common/navigation/Navigation.tsx

@@ -105,7 +105,8 @@ const NavigationList = [
         href: URLS.SECURITY,
         iconClass: 'nav-security',
         icon: SecurityIcon,
-        moduleName: ModuleNameMap.SECURITY,
+        moduleName: ModuleNameMap.SECURITY_CLAIR,
+        moduleNameTrivy: ModuleNameMap.SECURITY_TRIVY,
     },
     {
         title: 'Bulk Edit',
@@ -181,29 +182,48 @@ export default class Navigation extends Component<
     componentDidUpdate(prevProps) {
         if (
             this.props.moduleInInstallingState !== prevProps.moduleInInstallingState &&
-            this.props.moduleInInstallingState === ModuleNameMap.SECURITY
+            (this.props.moduleInInstallingState === ModuleNameMap.SECURITY_CLAIR ||
+                this.props.moduleInInstallingState === ModuleNameMap.SECURITY_TRIVY)
         ) {
             this.getSecurityModuleStatus(MODULE_STATUS_RETRY_COUNT)
         }
     }
 
     async getSecurityModuleStatus(retryOnError: number): Promise<void> {
-        if (this.props.installedModuleMap.current?.[ModuleNameMap.SECURITY] || window._env_.K8S_CLIENT) {
+        if (
+            this.props.installedModuleMap.current?.[ModuleNameMap.SECURITY_CLAIR] ||
+            window._env_.K8S_CLIENT ||
+            this.props.installedModuleMap.current?.[ModuleNameMap.SECURITY_TRIVY]
+        ) {
             return
         }
         try {
-            const { result } = await getModuleInfo(ModuleNameMap.SECURITY)
-            if (result?.status === ModuleStatus.INSTALLED) {
-                this.props.installedModuleMap.current = {
-                    ...this.props.installedModuleMap.current,
-                    [ModuleNameMap.SECURITY]: true,
-                }
-                this.setState({ forceUpdateTime: Date.now() })
-            } else if (result?.status === ModuleStatus.INSTALLING) {
-                this.securityModuleStatusTimer = setTimeout(() => {
-                    this.getSecurityModuleStatus(MODULE_STATUS_RETRY_COUNT)
-                }, MODULE_STATUS_POLLING_INTERVAL)
-            }
+            Promise.all([getModuleInfo(ModuleNameMap.SECURITY_CLAIR), getModuleInfo(ModuleNameMap.SECURITY_TRIVY)]).then(
+                ([clairResponse, trivyResponse]) => {
+                    if (clairResponse?.result?.status === ModuleStatus.INSTALLED) {
+                        this.props.installedModuleMap.current = {
+                            ...this.props.installedModuleMap.current,
+                            [ModuleNameMap.SECURITY_CLAIR]: true,
+                        }
+                        this.setState({ forceUpdateTime: Date.now() })
+                    } else if (clairResponse?.result?.status === ModuleStatus.INSTALLING) {
+                        this.securityModuleStatusTimer = setTimeout(() => {
+                            this.getSecurityModuleStatus(MODULE_STATUS_RETRY_COUNT)
+                        }, MODULE_STATUS_POLLING_INTERVAL)
+                    }
+                    if (trivyResponse?.result?.status === ModuleStatus.INSTALLED) {
+                        this.props.installedModuleMap.current = {
+                            ...this.props.installedModuleMap.current,
+                            [ModuleNameMap.SECURITY_TRIVY]: true,
+                        }
+                        this.setState({ forceUpdateTime: Date.now() })
+                    } else if (trivyResponse?.result?.status === ModuleStatus.INSTALLING) {
+                        this.securityModuleStatusTimer = setTimeout(() => {
+                            this.getSecurityModuleStatus(MODULE_STATUS_RETRY_COUNT)
+                        }, MODULE_STATUS_POLLING_INTERVAL)
+                    }
+                },
+            )
         } catch (error) {
             if (retryOnError >= 0) {
                 this.getSecurityModuleStatus(retryOnError--)
@@ -301,7 +321,8 @@ export default class Navigation extends Component<
             return (
                 (this.props.serverMode === SERVER_MODE.FULL && !item.moduleName) ||
                 (this.props.serverMode === SERVER_MODE.EA_ONLY && item.isAvailableInEA) ||
-                this.props.installedModuleMap.current?.[item.moduleName]
+                this.props.installedModuleMap.current?.[item.moduleName] ||
+                this.props.installedModuleMap.current?.[item.moduleNameTrivy]
             )
         }
     }

src/components/common/navigation/NavigationRoutes.tsx

@@ -370,6 +370,7 @@ export default function NavigationRoutes() {
                                                 <DevtronStackManager
                                                     serverInfo={currentServerInfo.serverInfo}
                                                     getCurrentServerInfo={getCurrentServerInfo}
+                                                    isSuperAdmin={isSuperAdmin}
                                                 />
                                             </Route>,
                                             <Route key={URLS.GETTING_STARTED} exact path={`/${URLS.GETTING_STARTED}`}>