diff --git a/web/package.json b/web/package.json index ee0e31102..85444706b 100644 --- a/web/package.json +++ b/web/package.json @@ -51,7 +51,7 @@ "@codemirror/view": "^6.9.6", "@harnessio/design-system": "^2.1.1", "@harnessio/icons": "^2.1.9", - "@harnessio/react-har-service-client": "^0.12.0", + "@harnessio/react-har-service-client": "^0.13.0", "@harnessio/react-ssca-manager-client": "^0.65.0", "@harnessio/uicore": "^4.1.2", "@tanstack/react-query": "4.20.4", diff --git a/web/src/ar/components/TableCells/TableCells.module.scss b/web/src/ar/components/TableCells/TableCells.module.scss index e8575b372..24baad28f 100644 --- a/web/src/ar/components/TableCells/TableCells.module.scss +++ b/web/src/ar/components/TableCells/TableCells.module.scss @@ -56,3 +56,8 @@ --intent-color: #07a0ab; } } + +.vulnerabilityCellItem { + padding: 0 var(--spacing-small) !important; + border-left: solid var(--spacing-1); +} diff --git a/web/src/ar/components/TableCells/TableCells.module.scss.d.ts b/web/src/ar/components/TableCells/TableCells.module.scss.d.ts index 8870d6214..1c0451847 100644 --- a/web/src/ar/components/TableCells/TableCells.module.scss.d.ts +++ b/web/src/ar/components/TableCells/TableCells.module.scss.d.ts @@ -25,3 +25,4 @@ export declare const nameCellContainer: string export declare const nonProd: string export declare const prod: string export declare const toggleAccordion: string +export declare const vulnerabilityCellItem: string diff --git a/web/src/ar/components/TableCells/TableCells.tsx b/web/src/ar/components/TableCells/TableCells.tsx index 1da5300dd..208db32f7 100644 --- a/web/src/ar/components/TableCells/TableCells.tsx +++ b/web/src/ar/components/TableCells/TableCells.tsx @@ -259,6 +259,45 @@ export const PullCommandCell = ({ value }: CommonCellProps) => { return } +interface VulnerabilityCellProps { + critical?: number + high?: number + medium?: number + low?: number +} + +export const VulnerabilityCell = ({ critical, high, medium, low }: VulnerabilityCellProps) => { + const { getString } = useStrings() + return ( + + + {getString('vulnerabilityStatus.critical', { count: critical })} + + + {getString('vulnerabilityStatus.high', { count: high })} + + + {getString('vulnerabilityStatus.medium', { count: medium })} + + + {getString('vulnerabilityStatus.low', { count: low })} + + + ) +} + export default { UrlCell, SizeCell, @@ -271,5 +310,6 @@ export default { PullCommandCell, LastModifiedCell, ToggleAccordionCell, - RepositoryLocationBadgeCell + RepositoryLocationBadgeCell, + VulnerabilityCell } diff --git a/web/src/ar/pages/digest-list/components/DigestListTable/DigestListTable.module.scss b/web/src/ar/pages/digest-list/components/DigestListTable/DigestListTable.module.scss index ec664d90f..e6d9ca499 100644 --- a/web/src/ar/pages/digest-list/components/DigestListTable/DigestListTable.module.scss +++ b/web/src/ar/pages/digest-list/components/DigestListTable/DigestListTable.module.scss @@ -34,7 +34,7 @@ div[class*='TableV2--cells'], div[class*='TableV2--header'] { display: grid !important; - grid-template-columns: minmax(var(--har-table-name-column-min-width), 1fr) 1fr 1fr 1fr 1fr 1fr !important; + grid-template-columns: minmax(var(--har-table-name-column-min-width), 1fr) 1fr 1fr 1fr 1fr minmax(200px, 1fr) !important; } div[class*='TableV2--header'] { diff --git a/web/src/ar/pages/digest-list/components/DigestListTable/DigestListTable.tsx b/web/src/ar/pages/digest-list/components/DigestListTable/DigestListTable.tsx index a3f83c125..c5869ac15 100644 --- a/web/src/ar/pages/digest-list/components/DigestListTable/DigestListTable.tsx +++ b/web/src/ar/pages/digest-list/components/DigestListTable/DigestListTable.tsx @@ -24,9 +24,9 @@ import { useStrings } from '@ar/frameworks/strings/String' import { DigestActionsCell, DigestNameCell, + DigestVulnerabilityCell, DownloadsCell, OsArchCell, - ScanStatusCell, SizeCell, UploadedByCell } from './DigestTableCells' @@ -73,7 +73,7 @@ export default function DigestListTable(props: DigestListTableProps): JSX.Elemen { Header: getString('digestList.table.columns.scanStatus'), accessor: 'scanStatus', - Cell: ScanStatusCell, + Cell: DigestVulnerabilityCell, version }, { diff --git a/web/src/ar/pages/digest-list/components/DigestListTable/DigestTableCells.tsx b/web/src/ar/pages/digest-list/components/DigestListTable/DigestTableCells.tsx index d81cbda32..8b7a4fdfb 100644 --- a/web/src/ar/pages/digest-list/components/DigestListTable/DigestTableCells.tsx +++ b/web/src/ar/pages/digest-list/components/DigestListTable/DigestTableCells.tsx @@ -15,11 +15,8 @@ */ import React from 'react' -import { Link } from 'react-router-dom' import type { Cell, CellValue, ColumnInstance, Renderer, Row, TableInstance } from 'react-table' -import { Text } from '@harnessio/uicore' -import { Color } from '@harnessio/design-system' import type { DockerManifestDetails } from '@harnessio/react-har-service-client' import { useStrings } from '@ar/frameworks/strings' @@ -77,39 +74,20 @@ export const DownloadsCell: CellType = ({ value }) => { return } -export const ScanStatusCell: Renderer<{ - row: Row - column: ColumnInstance & DigestNameColumnProps -}> = ({ row, column }) => { +export const DigestVulnerabilityCell: CellType = ({ row }) => { const { original } = row - const { version } = column - const router = useRoutes() - const { stoExecutionId, stoPipelineId, digest } = original - const pathParams = useDecodedParams() + const { stoDetails } = original const { getString } = useStrings() - if (!stoExecutionId || !stoPipelineId) + if (!stoDetails) return - const linkTo = router.toARVersionDetailsTab({ - repositoryIdentifier: pathParams.repositoryIdentifier, - artifactIdentifier: pathParams.artifactIdentifier, - versionIdentifier: version, - versionTab: VersionDetailsTab.SECURITY_TESTS, - pipelineIdentifier: stoPipelineId, - executionIdentifier: stoExecutionId - }) return ( - - - {getString('artifactList.table.actions.VulnerabilityStatus.scanned')} - - + ) } diff --git a/web/src/ar/pages/version-details/DockerVersion/DockerVersionHeader.tsx b/web/src/ar/pages/version-details/DockerVersion/DockerVersionHeader.tsx index e24dc6c25..5eb09c9f3 100644 --- a/web/src/ar/pages/version-details/DockerVersion/DockerVersionHeader.tsx +++ b/web/src/ar/pages/version-details/DockerVersion/DockerVersionHeader.tsx @@ -36,7 +36,7 @@ interface DockerVersionHeaderProps { export default function DockerVersionHeader(props: DockerVersionHeaderProps): JSX.Element { const { iconSize = 40, data } = props - const { imageName: name, version, isLatestVersion = false, packageType } = data + const { imageName: name, version, packageType } = data const pathParams = useDecodedParams() const { useUpdateQueryParams, useQueryParams } = useParentHooks() const { updateQueryParams } = useUpdateQueryParams() @@ -69,7 +69,7 @@ export default function DockerVersionHeader(props: DockerVersionHeaderProps): JS digest={digest} onChangeVersion={handleChangeVersion} onChangeDigest={handleChangeDigest} - isLatestVersion={isLatestVersion} + isLatestVersion={false} /> { + const handleCloseDetailsModal = () => { + hideModal() + handleCloseModal() + } return ( { - hideModal() - handleCloseModal() - }}> + onClose={handleCloseDetailsModal}> -