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'} + + {' '}