diff --git a/src/__tests__/TagPage/VulnerabilitiesDetails.test.js b/src/__tests__/TagPage/VulnerabilitiesDetails.test.js
index d29707a8..0ce102a6 100644
--- a/src/__tests__/TagPage/VulnerabilitiesDetails.test.js
+++ b/src/__tests__/TagPage/VulnerabilitiesDetails.test.js
@@ -456,7 +456,7 @@ describe('Vulnerabilties page', () => {
jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockCVEList } });
render();
await waitFor(() => expect(screen.getAllByText('Vulnerabilities')).toHaveLength(1));
- await waitFor(() => expect(screen.getAllByText(/Fixed in/i)).toHaveLength(20));
+ await waitFor(() => expect(screen.getAllByText(/see fix tags/i)).toHaveLength(20));
});
it('renders no vulnerabilities if there are not any', async () => {
@@ -497,6 +497,7 @@ describe('Vulnerabilties page', () => {
.mockResolvedValue({ status: 200, data: { data: mockCVEFixed } });
render();
await waitFor(() => expect(screen.getAllByText('Vulnerabilities')).toHaveLength(1));
- await waitFor(() => expect(screen.getAllByText('1.0.16')).toHaveLength(20));
+ fireEvent.click(screen.getAllByText(/see fix tags/i)[0]);
+ await waitFor(() => expect(screen.getByText('1.0.16')).toBeInTheDocument());
});
});
diff --git a/src/components/VulnerabilitiesDetails.jsx b/src/components/VulnerabilitiesDetails.jsx
index 27aaf89c..843befcf 100644
--- a/src/components/VulnerabilitiesDetails.jsx
+++ b/src/components/VulnerabilitiesDetails.jsx
@@ -165,11 +165,15 @@ const vulnerabilityCheck = (status) => {
function VulnerabilitiyCard(props) {
const classes = useStyles();
const { cve, name } = props;
- const [open, setOpen] = useState(false);
+ const [openDesc, setOpenDesc] = useState(false);
+ const [openFixed, setOpenFixed] = useState(false);
const [loadingFixed, setLoadingFixed] = useState(true);
const [fixedInfo, setFixedInfo] = useState([]);
useEffect(() => {
+ if (!openFixed || !isEmpty(fixedInfo)) {
+ return;
+ }
setLoadingFixed(true);
api
.get(`${host()}${endpoints.imageListWithCVEFixed(cve.Id, name)}`)
@@ -183,7 +187,7 @@ function VulnerabilitiyCard(props) {
.catch((e) => {
console.error(e);
});
- }, []);
+ }, [openFixed]);
const renderFixedVer = () => {
if (!isEmpty(fixedInfo)) {
@@ -215,15 +219,6 @@ function VulnerabilitiyCard(props) {
{cve.Title}
-
-
- Fixed In:{' '}
-
-
- {' '}
- {loadingFixed ? 'Loading...' : renderFixedVer()}
-
-
setOpen(!open)}
+ onClick={() => setOpenFixed(!openFixed)}
>
- {!open ? 'See description' : 'Hide description'}
+ {!openFixed ? 'See fix tags' : 'Hide fix tags'}
-
+
+
+
+ {' '}
+ {loadingFixed ? 'Loading...' : renderFixedVer()}{' '}
+
+
+
+ setOpenDesc(!openDesc)}
+ >
+ {!openDesc ? 'See description' : 'Hide description'}
+
+
{' '}