+
-
-
-
+ {getSignatureChips()}
diff --git a/src/components/Shared/SignatureTooltip.jsx b/src/components/Shared/SignatureTooltip.jsx
index c4433b48..bde8ae17 100644
--- a/src/components/Shared/SignatureTooltip.jsx
+++ b/src/components/Shared/SignatureTooltip.jsx
@@ -1,19 +1,17 @@
-import React from 'react';
+import React, { useMemo } from 'react';
import { Typography, Stack } from '@mui/material';
-
import { isEmpty } from 'lodash';
+import { getStrongestSignature, getAllAuthorsOfSignatures } from 'utilities/vulnerabilityAndSignatureCheck';
-function SignatureTooltip({ isSigned, signatureInfo }) {
- const { tool, isTrusted, author } = !isEmpty(signatureInfo)
- ? signatureInfo[0]
- : { tool: 'Unknown', isTrusted: 'Unknown', author: 'Unknown' };
+function SignatureTooltip({ signatureInfo }) {
+ const strongestSignature = useMemo(() => getStrongestSignature(signatureInfo));
- return (
+ return isEmpty(strongestSignature) ? (
+ Not signed
+ ) : (
- {isSigned ? 'Verified Signature' : 'Unverified Signature'}
- Tool: {tool}
- Trusted: {!isEmpty(isTrusted) ? isTrusted : 'Unknown'}
- Author: {!isEmpty(author) ? author : 'Unknown'}
+ Tool: {strongestSignature?.tool || 'Unknown'}
+ Signed-by: {getAllAuthorsOfSignatures(signatureInfo) || 'Unknown'}
);
}
diff --git a/src/components/Tag/Tabs/DependsOn.jsx b/src/components/Tag/Tabs/DependsOn.jsx
index 56b0ed51..1cfafb37 100644
--- a/src/components/Tag/Tabs/DependsOn.jsx
+++ b/src/components/Tag/Tabs/DependsOn.jsx
@@ -107,7 +107,7 @@ function DependsOn(props) {
repoName={dependence.repoName}
tag={dependence.tag}
vendor={dependence.vendor}
- isSigned={dependence.isSigned}
+ signatureInfo={dependence.signatureInfo}
manifests={dependence.manifests}
key={index}
lastUpdated={dependence.lastUpdated}
diff --git a/src/components/Tag/Tabs/IsDependentOn.jsx b/src/components/Tag/Tabs/IsDependentOn.jsx
index 4afaf675..03ec2b3d 100644
--- a/src/components/Tag/Tabs/IsDependentOn.jsx
+++ b/src/components/Tag/Tabs/IsDependentOn.jsx
@@ -107,7 +107,7 @@ function IsDependentOn(props) {
repoName={dependence.repoName}
tag={dependence.tag}
vendor={dependence.vendor}
- isSigned={dependence.isSigned}
+ signatureInfo={dependence.signatureInfo}
manifests={dependence.manifests}
key={index}
lastUpdated={dependence.lastUpdated}
diff --git a/src/components/Tag/TagDetails.jsx b/src/components/Tag/TagDetails.jsx
index 8242edc5..abe90d48 100644
--- a/src/components/Tag/TagDetails.jsx
+++ b/src/components/Tag/TagDetails.jsx
@@ -5,6 +5,7 @@ import React, { useEffect, useMemo, useState, useRef } from 'react';
import { api, endpoints } from '../../api';
import { host } from '../../host';
import { mapToImage } from '../../utilities/objectModels';
+import filterConstants from 'utilities/filterConstants';
import { isEmpty, head } from 'lodash';
// components
@@ -224,6 +225,28 @@ function TagDetails() {
}
};
+ const getSignatureChips = () => {
+ const cosign = imageDetailData.signatureInfo
+ ?.map((s) => s.tool)
+ .includes(filterConstants.signatureToolConstants.COSIGN)
+ ? imageDetailData.signatureInfo.filter((si) => si.tool == filterConstants.signatureToolConstants.COSIGN)
+ : null;
+ const notation = imageDetailData.signatureInfo
+ ?.map((s) => s.tool)
+ .includes(filterConstants.signatureToolConstants.NOTATION)
+ ? imageDetailData.signatureInfo.filter((si) => si.tool == filterConstants.signatureToolConstants.NOTATION)
+ : null;
+ const sigArray = [];
+ if (cosign) sigArray.push(cosign);
+ if (notation) sigArray.push(notation);
+ if (sigArray.length === 0) return ;
+ return sigArray.map((sig, index) => (
+
+
+
+ ));
+ };
+
return (
<>
{isLoading ? (
@@ -256,15 +279,12 @@ function TagDetails() {
-
+
-
+ {getSignatureChips()}
diff --git a/src/utilities/filterConstants.js b/src/utilities/filterConstants.js
index 8a95591f..25d0501e 100644
--- a/src/utilities/filterConstants.js
+++ b/src/utilities/filterConstants.js
@@ -69,6 +69,11 @@ const archFilters = [
}
];
-const filterConstants = { osFilters, imageFilters, archFilters };
+const signatureToolConstants = {
+ COSIGN: 'cosign',
+ NOTATION: 'notation'
+};
+
+const filterConstants = { osFilters, imageFilters, archFilters, signatureToolConstants };
export default filterConstants;
diff --git a/src/utilities/objectModels.js b/src/utilities/objectModels.js
index 03403858..c8c5d6bb 100644
--- a/src/utilities/objectModels.js
+++ b/src/utilities/objectModels.js
@@ -132,12 +132,12 @@ const mapSignatureInfo = (signatureInfo) => {
return signatureInfo
? {
tool: signatureInfo.Tool,
- isTrusted: signatureInfo.IsTrusted?.toString(),
+ isTrusted: signatureInfo.IsTrusted,
author: signatureInfo.Author
}
: {
tool: 'Unknown',
- isTrusted: 'Unknown',
+ isTrusted: false,
author: 'Unknown'
};
};
diff --git a/src/utilities/vulnerabilityAndSignatureCheck.jsx b/src/utilities/vulnerabilityAndSignatureCheck.jsx
index 5f679199..dff55ef0 100644
--- a/src/utilities/vulnerabilityAndSignatureCheck.jsx
+++ b/src/utilities/vulnerabilityAndSignatureCheck.jsx
@@ -1,3 +1,4 @@
+import { isEmpty } from 'lodash';
import React from 'react';
import {
NoneVulnerabilityIcon,
@@ -12,14 +13,26 @@ import {
CriticalVulnerabilityChip,
UnverifiedSignatureIcon,
VerifiedSignatureIcon,
- UnverifiedSignatureChip,
- VerifiedSignatureChip,
UnknownVulnerabilityIcon,
UnknownVulnerabilityChip,
FailedScanIcon,
- FailedScanChip
+ FailedScanChip,
+ NotTrustedSignatureIcon
} from './vulnerabilityAndSignatureComponents';
+const getStrongestSignature = (signatureInfo) => {
+ if (isEmpty(signatureInfo)) return null;
+ const trusted = signatureInfo.find((si) => si.isTrusted);
+ if (!isEmpty(trusted)) return trusted;
+ return signatureInfo[0];
+};
+
+const getAllAuthorsOfSignatures = (signatureInfo) => {
+ if (isEmpty(signatureInfo)) return '';
+ const signatureAuthors = signatureInfo.filter((si) => si.isTrusted).map((si) => si.author);
+ return signatureAuthors.join(',');
+};
+
const VulnerabilityIconCheck = ({ vulnerabilitySeverity }) => {
let result;
let vulnerabilityStringTitle = '';
@@ -84,20 +97,17 @@ const VulnerabilityChipCheck = ({ vulnerabilitySeverity }) => {
return result;
};
-const SignatureIconCheck = ({ isSigned, signatureInfo }) => {
- if (isSigned) {
- return ;
- } else {
- return ;
- }
+const SignatureIconCheck = ({ signatureInfo }) => {
+ const strongestSignature = getStrongestSignature(signatureInfo);
+ if (strongestSignature === null) return ;
+ if (strongestSignature.isTrusted) return ;
+ return ;
};
-const SignatureChipCheck = ({ isSigned }) => {
- if (isSigned) {
- return ;
- } else {
- return ;
- }
+export {
+ VulnerabilityIconCheck,
+ VulnerabilityChipCheck,
+ SignatureIconCheck,
+ getStrongestSignature,
+ getAllAuthorsOfSignatures
};
-
-export { VulnerabilityIconCheck, VulnerabilityChipCheck, SignatureIconCheck, SignatureChipCheck };
diff --git a/src/utilities/vulnerabilityAndSignatureComponents.jsx b/src/utilities/vulnerabilityAndSignatureComponents.jsx
index 76e55177..1ec4e344 100644
--- a/src/utilities/vulnerabilityAndSignatureComponents.jsx
+++ b/src/utilities/vulnerabilityAndSignatureComponents.jsx
@@ -1,9 +1,10 @@
import React from 'react';
-import { Chip, Tooltip } from '@mui/material';
+import { Chip, Tooltip, Badge } from '@mui/material';
import SvgIcon from '@mui/material/SvgIcon';
import { ReactComponent as failedScanBug } from '../assets/failedScan.svg';
import { createSvgIcon } from '@mui/material/utils';
import SignatureTooltip from 'components/Shared/SignatureTooltip';
+import filterConstants from 'utilities/filterConstants';
const FilledBugIcon = createSvgIcon(
,
@@ -14,11 +15,15 @@ const OutlinedBugIcon = createSvgIcon(
'OutlinedBug'
);
const UnverifiedShieldIcon = createSvgIcon(
- ,
+ ,
'UnverifiedShield'
);
-const VerifiedShieldIcon = createSvgIcon(
- ,
+const CVerifiedShieldIcon = createSvgIcon(
+ ,
+ 'VerifiedShield'
+);
+const NVerifiedShieldIcon = createSvgIcon(
+ ,
'VerifiedShield'
);
@@ -222,8 +227,9 @@ const CriticalVulnerabilityChip = () => {
const UnverifiedSignatureIcon = ({ signatureInfo }) => {
return (
- } placement="top">
+ } placement="top">
{
);
};
+
+const NotTrustedSignatureIcon = ({ signatureInfo }) => {
+ return (
+
} placement="top">
+ {(signatureInfo[0]?.tool && signatureInfo[0].tool == filterConstants.signatureToolConstants.NOTATION && (
+
+
+
+ )) ||
+ (signatureInfo[0]?.tool && signatureInfo[0].tool == filterConstants.signatureToolConstants.COSIGN && (
+
+
+
+ ))}
+
+ );
+};
+
const VerifiedSignatureIcon = ({ signatureInfo }) => {
return (
-
} placement="top">
-
+
} placement="top">
+ {(signatureInfo[0]?.tool && signatureInfo[0].tool == filterConstants.signatureToolConstants.NOTATION && (
+
+
+
+ )) ||
+ (signatureInfo[0]?.tool && signatureInfo[0].tool == filterConstants.signatureToolConstants.COSIGN && (
+
+
+
+ ))}
);
};
@@ -270,19 +373,6 @@ const UnverifiedSignatureChip = () => {
/>
);
};
-const VerifiedSignatureChip = () => {
- return (
-
{
- return;
- }}
- deleteIcon={}
- />
- );
-};
export {
NoneVulnerabilityIcon,
@@ -298,9 +388,9 @@ export {
HighVulnerabilityChip,
CriticalVulnerabilityChip,
UnverifiedSignatureIcon,
+ NotTrustedSignatureIcon,
VerifiedSignatureIcon,
UnverifiedSignatureChip,
- VerifiedSignatureChip,
FailedScanIcon,
FailedScanChip
};
diff --git a/tests/utils/test-data-parser.js b/tests/utils/test-data-parser.js
index 24420ec4..fad0971e 100644
--- a/tests/utils/test-data-parser.js
+++ b/tests/utils/test-data-parser.js
@@ -149,7 +149,7 @@ const getRepoListOrderedAlpha = () => {
// };
const getRepoCardNameForLocator = (repo) => {
- return `${repo?.repo} ${repo?.tags[0]?.description?.slice(0, 10)}`;
+ return new RegExp(`${repo?.repo} \\d${repo?.tags[0]?.description?.slice(0, 10)}`);
};
export {