Small frontend issues with new vuln search story 19857

[xpkoala]

Fleet version: minior-fleet-v4.56.0

Web browser and operating system: n/a

---

💥  Actual behavior

1. Missing new copy on /software/os?team_id=<#> page when no OS is present. The Figma shows an additional line of text under the "No operating system detected" line.
2. Can carry over the search bar panel from one team to another. Steps to reproduce below.
3. The search bar area and hover text layout does not reflect the Figma design -- I'm unsure if this is an issue or not.

🧑‍💻  Steps to reproduce

1. When viewing /software/vulnerabilities?team_id=0 select the "Exploited vulnerabilities" drop down
2. Switch to a Team that has no hosts
3. Notice that the "Exploited vulnerabilities" state stays and the search bar is still present.
4. If you change the filter to "All vulnerabilities" the search area will disappear.

🕯️ More info (optional)

ISSUE 1 - Images showing the first issue:

ISSUE 2 - Movie showing the second issue:

https://github.com/user-attachments/assets/92f2e99f-2663-4b56-b75f-7f489784c1f7

ISSUE 3 - Image showing the third issue compared to the Figma:

[RachelElysia]

Issue 2: I don't know if this is a bug, if we have a filter of any kind (search or dropdown), we have no way of telling that there's no operating systems unfiltered.

[RachelElysia]

Please add your planning poker estimate with Zenhub @jacobshandling

[jacobshandling]

@RachelElysia this is unreleased so I don't think needs an estimate right?

[RachelElysia]

Issue 3:

@rachaelshaw The tooltip on a table search bar is hardcoded width of 190px (also used on the manage host page). Does it matter that the tooltip is 190px wide instead of wider to match figma? Or should I one-off make this tooltip wider to match the figma? https://github.com/fleetdm/fleet/blob/24377ee08d350ab1ce88cea9577b6b991404d0a1/frontend/components/TableContainer/_styles.scss#L210

[RachelElysia]

Issue 2:

@xpkoala I don't think it's a bug. The reason being there is no way to tell there's no vulnerabilities on that team until the user removes all filters. We currently have the same behavior for the host table, software table, and policy table as well. We intentionally designed it so when you switch teams with a filter applied, you still see the filters, even if that team has no hosts, software, vulnerabilities, policies respectively.

Loom of explanation: https://www.loom.com/share/d6cbb2f00419408ebfb3da26f77a14cc?sid=813bd125-978c-40f9-9762-8e113b2d1838

[RachelElysia]

Issue 1: PR incoming.

[xpkoala]

Thank you for the quick turnaround on this and the explanation on item 2!

[rachaelshaw]

tooltip on a table search bar is hardcoded width of 190px (also used on the manage host page). Does it matter that the tooltip is 190px wide instead of wider to match figma? Or should I one-off make this tooltip wider to match the figma?

@RachelElysia I think it should be fine; I'm guessing it was that way in Figma because we don't really have consistent rules for tooltip widths in the designs, and the text wrapped nicely @ that width. But normally if we want to intentionally change component styles it'll be called out in a dev note. @marko-lisica did the design update adding the tooltip, so might check in with him if you're not sure.

[marko-lisica]

@RachelElysia I think it's ok to make this one 190px as well, to be consistent with Hosts page. I just updated Figma.

[fleet-release]

Search bar's soft glow, Guides through vulnerabilities. Fleet's truth clear to show.