feat: import scan-result api from fe-lib and update security modal props

arunjaindev · arunjaindev · commit 93dc36142c03 · 2024-09-17T15:28:06.000+05:30
diff --git a/package.json b/package.json
@@ -4,7 +4,7 @@
     "private": true,
     "homepage": "/dashboard",
     "dependencies": {
-        "@devtron-labs/devtron-fe-common-lib": "0.3.5-beta-3",
+        "@devtron-labs/devtron-fe-common-lib": "0.3.5-beta-6",
         "@esbuild-plugins/node-globals-polyfill": "0.2.3",
         "@rjsf/core": "^5.13.3",
         "@rjsf/utils": "^5.13.3",
diff --git a/src/components/ResourceBrowser/ResourceList/ResourceBrowserActionMenu.tsx b/src/components/ResourceBrowser/ResourceList/ResourceBrowserActionMenu.tsx
@@ -15,7 +15,17 @@
  */
 
 import React, { useState } from 'react'
-import { PopupMenu, Nodes, useMainContext, ModuleNameMap, SecurityModal } from '@devtron-labs/devtron-fe-common-lib'
+import {
+    PopupMenu,
+    Nodes,
+    useMainContext,
+    ModuleNameMap,
+    SecurityModal,
+    ResponseType,
+    ApiResponseResultType,
+    GetResourceScanDetailsPayloadType,
+    useAsync,
+} from '@devtron-labs/devtron-fe-common-lib'
 import DeleteResourcePopup from './DeleteResourcePopup'
 import { importComponentFromFELibrary, getShowResourceScanModal } from '../../common'
 import { RESOURCE_ACTION_MENU } from '../Constants'
@@ -29,7 +39,24 @@ import { ReactComponent as MenuDots } from '../../../assets/icons/appstatus/ic-m
 import { NodeType } from '../../v2/appDetails/appDetails.type'
 
 const OpenSecurityModalButton = importComponentFromFELibrary('OpenSecurityModalButton', null, 'function')
-const isFELibAvailable = importComponentFromFELibrary('isFELibAvailable', null, 'function')
+const isFELibAvailable = importComponentFromFELibrary('isFELibAvailable', false, 'function')
+const SecurityModalSidebar = importComponentFromFELibrary('SecurityModalSidebar', null, 'function')
+const getResourceScanDetails: ({
+    name,
+    namespace,
+    clusterId,
+    group,
+    version,
+    kind,
+    appId,
+    appType,
+    deploymentType,
+    isAppDetailView,
+}: GetResourceScanDetailsPayloadType) => Promise<ResponseType<ApiResponseResultType>> = importComponentFromFELibrary(
+    'getResourceScanDetails',
+    null,
+    'function',
+)
 
 const ResourceBrowserActionMenu: React.FC<ResourceBrowserActionMenuType> = ({
     clusterId,
@@ -41,9 +68,25 @@ const ResourceBrowserActionMenu: React.FC<ResourceBrowserActionMenuType> = ({
 }) => {
     const { installedModuleMap } = useMainContext()
 
+    const isSecurityScanV2Enabled = window._env_.ENABLE_RESOURCE_SCAN_V2 && isFELibAvailable
+
     const [showDeleteDialog, setShowDeleteDialog] = useState(false)
     const [showVulnerabilityModal, setShowVulnerabilityModal] = useState(false)
 
+    const [resourceScanLoading, resourceScanResponse, resourceScanError] = useAsync(
+        () =>
+            getResourceScanDetails({
+                name: String(resourceData.name),
+                namespace: String(resourceData.namespace),
+                group: selectedResource?.gvk?.Group,
+                kind: selectedResource?.gvk?.Kind,
+                version: selectedResource?.gvk?.Version,
+                clusterId: +clusterId,
+            }),
+        [],
+        showVulnerabilityModal && getResourceScanDetails && isSecurityScanV2Enabled,
+    )
+
     const toggleDeleteDialog = () => {
         setShowDeleteDialog((prevState) => !prevState)
     }
@@ -143,15 +186,13 @@ const ResourceBrowserActionMenu: React.FC<ResourceBrowserActionMenuType> = ({
 
             {showVulnerabilityModal && !!isFELibAvailable && (
                 <SecurityModal
-                    resourceScanPayload={{
-                        name: String(resourceData.name),
-                        namespace: String(resourceData.namespace),
-                        group: selectedResource?.gvk?.Group,
-                        kind: selectedResource?.gvk?.Kind,
-                        version: selectedResource?.gvk?.Version,
-                        clusterId: +clusterId,
-                    }}
+                    isResourceScan
                     handleModalClose={handleCloseVulnerabilityModal}
+                    Sidebar={SecurityModalSidebar}
+                    isSecurityScanV2Enabled={isSecurityScanV2Enabled}
+                    isLoading={resourceScanLoading}
+                    error={resourceScanError}
+                    responseData={resourceScanResponse?.result}
                 />
             )}
         </>
diff --git a/src/components/app/details/appDetails/AppSecurity.tsx b/src/components/app/details/appDetails/AppSecurity.tsx
@@ -1,20 +1,37 @@
-import { getSecurityScan, useAsync } from '@devtron-labs/devtron-fe-common-lib'
-import { getLastExecutionMinByAppAndEnv } from '@Services/service'
+import {
+    ApiResponseResultType,
+    AppDetailsPayload,
+    getExecutionDetails,
+    ResponseType,
+    useAsync,
+} from '@devtron-labs/devtron-fe-common-lib'
+import { importComponentFromFELibrary } from '@Components/common'
 import { UseGetAppSecurityDetailsProps, UseGetAppSecurityDetailsReturnType } from './appDetails.type'
 
+const getSecurityScan: ({
+    appId,
+    envId,
+    installedAppId,
+}: AppDetailsPayload) => Promise<ResponseType<ApiResponseResultType>> = importComponentFromFELibrary(
+    'getSecurityScan',
+    null,
+    'function',
+)
+
 export const useGetAppSecurityDetails = ({
     appId,
     envId,
+    installedAppId,
     isSecurityScanV2Enabled,
 }: UseGetAppSecurityDetailsProps): UseGetAppSecurityDetailsReturnType => {
     const [scanResultLoading, scanResultResponse, scanResultError, reloadScanResult] = useAsync(
-        () => getSecurityScan({ appId, envId }),
-        [appId, envId],
-        isSecurityScanV2Enabled,
+        () => getSecurityScan({ appId, envId, installedAppId }),
+        [appId, envId, installedAppId],
+        getSecurityScan && isSecurityScanV2Enabled,
     )
 
     const [executionDetailsLoading, executionDetailsResponse, executionDetailsError, reloadExecutionDetails] = useAsync(
-        () => getLastExecutionMinByAppAndEnv(appId, envId),
+        () => getExecutionDetails({ appId, envId }),
         [appId, envId],
         !isSecurityScanV2Enabled,
     )
diff --git a/src/components/app/details/appDetails/SecurityVulnerabilityCard.tsx b/src/components/app/details/appDetails/SecurityVulnerabilityCard.tsx
@@ -26,6 +26,7 @@ import { importComponentFromFELibrary } from '../../../common'
 import { useGetAppSecurityDetails } from './AppSecurity'
 
 const isFELibAvailable = importComponentFromFELibrary('isFELibAvailable', null, 'function')
+const SecurityModalSidebar = importComponentFromFELibrary('SecurityModalSidebar', null, 'function')
 
 export const SecurityVulnerabilityCard = ({
     cardLoading,
@@ -40,7 +41,7 @@ export const SecurityVulnerabilityCard = ({
     const handleModalClose = () => setShowScanDetailsModal(false)
 
     const { scanDetailsLoading, scanResultResponse, executionDetailsResponse, scanDetailsError, reloadScanDetails } =
-        useGetAppSecurityDetails({ appId, envId, isSecurityScanV2Enabled })
+        useGetAppSecurityDetails({ appId, envId, installedAppId, isSecurityScanV2Enabled })
 
     const imageScanFailed = scanResultResponse?.result.codeScan.status === 'Failed'
     const imageScanProgressing = scanResultResponse?.result.codeScan.status === 'Progressing'
@@ -52,10 +53,11 @@ export const SecurityVulnerabilityCard = ({
         }
     }
 
-    const scanResultSeverities = scanResultResponse?.result.imageScan.vulnerability?.summary.severities // For scan-result Api
+    const scanResultSeverities = scanResultResponse?.result.imageScan.vulnerability?.summary.severities 
+    const executionDetailsSeverities = executionDetailsResponse?.result.imageScan.vulnerability?.summary.severities 
     const severityCount: SeverityCount = isSecurityScanV2Enabled
         ? getSeverityCountFromSummary(scanResultSeverities)
-        : executionDetailsResponse?.result.severityCount ?? { critical: 0, high: 0, medium: 0, low: 0, unknown: 0 }
+        : getSeverityCountFromSummary(executionDetailsSeverities)
 
     const totalCount = getTotalSeverityCount(severityCount)
 
@@ -190,21 +192,12 @@ export const SecurityVulnerabilityCard = ({
                 <SecurityModal
                     handleModalClose={handleModalClose}
                     isExternalCI={isExternalCI}
-                    {...(isSecurityScanV2Enabled
-                        ? {
-                              appDetailsPayload: {
-                                  appId,
-                                  envId,
-                                  installedAppId: installedAppId ? String(installedAppId) : null,
-                              },
-                          }
-                        : {
-                              executionDetailsPayload: {
-                                  appId,
-                                  envId,
-                                  imageScanDeployInfoId: executionDetailsResponse?.result.imageScanDeployInfoId,
-                              },
-                          })}
+                    Sidebar={SecurityModalSidebar}
+                    isSecurityScanV2Enabled={isSecurityScanV2Enabled}
+                    isHelmApp={!!installedAppId}
+                    isLoading={scanDetailsLoading}
+                    error={scanDetailsError}
+                    responseData={isSecurityScanV2Enabled ? scanResultResponse?.result : executionDetailsResponse?.result}
                 />
             )}
         </button>
diff --git a/src/components/app/details/appDetails/appDetails.type.ts b/src/components/app/details/appDetails/appDetails.type.ts
@@ -14,8 +14,7 @@
  * limitations under the License.
  */
 
-import { ACTION_STATE, getSecurityScan, ResponseType } from '@devtron-labs/devtron-fe-common-lib'
-import { getLastExecutionMinByAppAndEnv } from '@Services/service'
+import { ACTION_STATE, ApiResponseResultType, ResponseType } from '@devtron-labs/devtron-fe-common-lib'
 import { AggregatedNodes, OptionType } from '../../types'
 import { SyncErrorType, AppDetails } from '../../../v2/appDetails/appDetails.type'
 
@@ -262,12 +261,13 @@ export interface LastUpdatedCardType {
 export interface UseGetAppSecurityDetailsProps {
     appId: string
     envId: string
+    installedAppId: number
     isSecurityScanV2Enabled: boolean
 }
 export interface UseGetAppSecurityDetailsReturnType {
     scanDetailsLoading: boolean
-    scanResultResponse: Awaited<ReturnType<typeof getSecurityScan>>
-    executionDetailsResponse: Awaited<ReturnType<typeof getLastExecutionMinByAppAndEnv>>
+    scanResultResponse: ResponseType<ApiResponseResultType>
+    executionDetailsResponse: ResponseType<ApiResponseResultType>
     scanDetailsError: any
     reloadScanDetails: () => void
 }
diff --git a/src/components/app/details/cIDetails/CIDetails.tsx b/src/components/app/details/cIDetails/CIDetails.tsx
@@ -48,6 +48,7 @@ import {
     ErrorScreenManager,
     getTotalSeverityCount,
     getSeverityCountFromSummary,
+    parseExecutionDetailResponse,
 } from '@devtron-labs/devtron-fe-common-lib'
 import { Switch, Route, Redirect, useRouteMatch, useParams, useHistory, generatePath } from 'react-router-dom'
 import {
@@ -71,6 +72,7 @@ import { importComponentFromFELibrary } from '@Components/common'
 import { useGetCISecurityDetails } from './CISecurity.utils'
 
 const isFELibAvailable = importComponentFromFELibrary('isFELibAvailable', null, 'function')
+const SecurityModalSidebar = importComponentFromFELibrary('SecurityModalSidebar', null, 'function')
 const terminalStatus = new Set(['succeeded', 'failed', 'error', 'cancelled', 'nottriggered', 'notbuilt'])
 const statusSet = new Set(['starting', 'running', 'pending'])
 
@@ -640,8 +642,6 @@ const HistoryLogs = ({
                             artifactId={triggerDetails.artifactId}
                             status={triggerDetails.status}
                             appIdFromParent={appIdFromParent}
-                            isJobCI={isJobCI}
-                            isJobView={isJobView}
                         />
                     </Route>
                 }
@@ -673,19 +673,19 @@ export const NoVulnerabilityViewWithTool = ({ scanToolId }: { scanToolId: number
     )
 }
 
-const SecurityTab = ({ ciPipelineId, artifactId, status, appIdFromParent, isJobCI, isJobView }: SecurityTabType) => {
+const SecurityTab = ({ ciPipelineId, artifactId, status, appIdFromParent }: SecurityTabType) => {
     const { appId } = useParams<{ appId: string }>()
     const { push } = useHistory()
     const isSecurityScanV2Enabled = window._env_.ENABLE_RESOURCE_SCAN_V2 && !!isFELibAvailable
 
     const computedAppId = appId ?? appIdFromParent
 
-    const { scanDetailsLoading, scanResultResponse, executionDetailsResponse, scanDetailsError, reloadScanDetails } = useGetCISecurityDetails({
-        appId: computedAppId,
-        artifactId,
-        isJobCard: isJobCI || isJobView,
-        isSecurityScanV2Enabled,
-    })
+    const { scanDetailsLoading, scanResultResponse, executionDetailsResponse, scanDetailsError, reloadScanDetails } =
+        useGetCISecurityDetails({
+            appId: computedAppId,
+            artifactId,
+            isSecurityScanV2Enabled,
+        })
 
     const redirectToCreate = () => {
         if (!ciPipelineId) {
@@ -748,14 +748,9 @@ const SecurityTab = ({ ciPipelineId, artifactId, status, appIdFromParent, isJobC
                 severityCount={severityCount}
                 scanToolId={executionDetailsResponse?.result.scanToolId ?? SCAN_TOOL_ID_TRIVY}
                 rootClassName="w-500"
-                {...(isSecurityScanV2Enabled
-                    ? { appDetailsPayload: { appId: computedAppId, artifactId } }
-                    : {
-                          executionDetailsPayload: {
-                              appId: computedAppId,
-                              artifactId,
-                          },
-                      })}
+                SecurityModalSidebar={SecurityModalSidebar}
+                isSecurityScanV2Enabled={isSecurityScanV2Enabled}
+                responseData={isSecurityScanV2Enabled ? scanResultResponse?.result : parseExecutionDetailResponse(executionDetailsResponse?.result)}
             />
         </div>
     )
diff --git a/src/components/app/details/cIDetails/CISecurity.utils.tsx b/src/components/app/details/cIDetails/CISecurity.utils.tsx
@@ -1,21 +1,31 @@
-import { getSecurityScan, useAsync } from '@devtron-labs/devtron-fe-common-lib'
+import { ApiResponseResultType, AppDetailsPayload, ResponseType, useAsync } from '@devtron-labs/devtron-fe-common-lib'
 import { getLastExecutionByAppArtifactId } from '@Services/service'
+import { importComponentFromFELibrary } from '@Components/common'
 import { UseGetCISecurityDetailsProps, UseGetCISecurityDetailsReturnType } from './types'
 
+const getSecurityScan: ({
+    appId,
+    envId,
+    installedAppId,
+}: AppDetailsPayload) => Promise<ResponseType<ApiResponseResultType>> = importComponentFromFELibrary(
+    'getSecurityScan',
+    null,
+    'function',
+)
+
 export const useGetCISecurityDetails = ({
     appId,
     artifactId,
-    isJobCard,
     isSecurityScanV2Enabled,
 }: UseGetCISecurityDetailsProps): UseGetCISecurityDetailsReturnType => {
     const [scanResultLoading, scanResultResponse, scanResultError, reloadScanResult] = useAsync(
-        () => getSecurityScan({ artifactId, ...(isJobCard && { appId }) }),
+        () => getSecurityScan({ artifactId, appId }),
         [artifactId, appId],
         isSecurityScanV2Enabled,
     )
 
     const [executionDetailsLoading, executionDetailsResponse, executionDetailsError, reloadExecutionDetails] = useAsync(
-        () => getLastExecutionByAppArtifactId(artifactId, isJobCard ? appId : null),
+        () => getLastExecutionByAppArtifactId(artifactId, appId),
         [artifactId, appId],
         !isSecurityScanV2Enabled,
     )
diff --git a/src/components/app/details/cIDetails/types.tsx b/src/components/app/details/cIDetails/types.tsx
@@ -13,7 +13,13 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { FetchIdDataStatus, getSecurityScan, History, useScrollable } from '@devtron-labs/devtron-fe-common-lib'
+import {
+    ApiResponseResultType,
+    FetchIdDataStatus,
+    History,
+    ResponseType,
+    useScrollable,
+} from '@devtron-labs/devtron-fe-common-lib'
 import { getLastExecutionByAppArtifactId } from '@Services/service'
 
 export interface CIPipeline {
@@ -62,20 +68,17 @@ export interface SecurityTabType {
     artifactId: number
     status: string
     appIdFromParent?: string
-    isJobCI: boolean
-    isJobView: boolean
 }
 
 export interface UseGetCISecurityDetailsProps {
     appId: string
     artifactId: number
-    isJobCard: boolean
     isSecurityScanV2Enabled: boolean
 }
 
 export interface UseGetCISecurityDetailsReturnType {
     scanDetailsLoading: boolean
-    scanResultResponse: Awaited<ReturnType<typeof getSecurityScan>>
+    scanResultResponse: ResponseType<ApiResponseResultType>
     executionDetailsResponse: Awaited<ReturnType<typeof getLastExecutionByAppArtifactId>>
     scanDetailsError: any
     reloadScanDetails: () => void
diff --git a/src/components/app/details/triggerView/cdMaterial.tsx b/src/components/app/details/triggerView/cdMaterial.tsx
diff --git a/src/components/security/SecurityScansTab/SecurityScansTab.tsx b/src/components/security/SecurityScansTab/SecurityScansTab.tsx
diff --git a/src/components/v2/appDetails/k8Resource/nodeType/NodeDelete.component.tsx b/src/components/v2/appDetails/k8Resource/nodeType/NodeDelete.component.tsx
diff --git a/src/services/service.ts b/src/services/service.ts
