Skip to content

Include tabs to show all content or filter vulnerable content #234

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 8 commits into from
Jul 10, 2025

Conversation

dotNomad
Copy link
Collaborator

@dotNomad dotNomad commented Jul 9, 2025

This PR includes tabs (and a new component to support them) for the content list page in the Package Vulnerability Scanner.

This allows users to select "With Vulnerabilities" to show only content with vulnerabilities. A badge is included for each tab to show the number of content items for both tabs.

Fixes #211

Preview

CleanShot 2025-07-09 at 16 05 08

CleanShot 2025-07-09 at 16 05 19

These changes have been published to our internal Dogfood server here.

@@ -57,9 +58,46 @@ const totalVulnerabilities = computed<number>(() => {
);
});

const contentWithVulnerabilities = computed<number>(() => {
return scannerStore.content.filter((item) => item.vulnerabilityCount > 0)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ditto from other PRs, 😄

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good call I'll move that over to isolate the logic a bit better.

Comment on lines 9 to 14
:class="[
model === tab.name
? getActiveTabClasses(tab.color)
: 'border-transparent text-gray-600 hover:border-gray-300 hover:text-gray-700',
'flex items-center border-b-2 px-4 py-2 text-sm font-medium whitespace-nowrap cursor-pointer',
]"
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Feels a bit overloaded to have this in the template

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah perhaps it would be better to have this be a separate component to isolate it a bit better or have a method to construct the non-default classes. I'll take a look at that.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ended up splitting up class and the computed :class. I didn't split out the inactive classes since that would just put a class const in the script which felt odd

Base automatically changed from dotnomad/208 to main July 10, 2025 22:52
@dotNomad dotNomad merged commit dfd52ce into main Jul 10, 2025
18 checks passed
@dotNomad dotNomad deleted the dotnomad/211 branch July 10, 2025 23:06
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Include a filter for showing only content with vulnerabilities
2 participants