Show software details on "My device" page

[rachaelshaw]

Goal

User story
As an end user on the "My device" page,
I want to see file paths of installed software
so that I can see where I have vulnerable software installed.

Objective

None. Fleet prioritizes small UX improvements based on user feedback.

Original requests

#23252

Context

• Product designer: @rachaelshaw

Changes

Product

• UI changes: Figma
• CLI (fleetctl) usage changes: No changes
• YAML changes: No changes
• REST API changes: No changes
• Fleet's agent (fleetd) changes: No changes
• Activity changes: No changes
• Permissions changes: No changes
• Changes to paid features or tiers: No changes
• Other reference documentation changes: No changes
• Once shipped, requester has been notified

Engineering

• Feature guide changes: No changes
• Database schema migrations: No changes
• Load testing: No changes
• Specification: Implement per Figma above (Add details to the software page).
• Test-plan - To be created by the DRI engineer and approved by QA person

ℹ️  Please read this issue carefully and understand it. Pay special attention to UI wireframes, especially "dev notes".

QA

Risk assessment

• Requires load testing: No
• Risk level: Low / High Low
• Risk description: UI changes with low risk

Manual testing steps

On My device page for Mac, Linux, Windows hosts:

• Verify "show details" link appears on hover and when clicked, brings you to the details modal for the software
• Verify "show details" link appears tabbed focus of a row and when pressing enter, brings you to the details modal for the software
• Verify Version, Type, Last used, File path, and Vulnerabilities are shown
• Verify for different types of software
• Verify on Chrome, Safari, Firefox (where applicable)

Testing notes

Confirmation

1. Engineer (@____): Added comment to user story confirming successful completion of QA.
2. QA (@____): Added comment to user story confirming successful completion of QA.

[RachelElysia]

Please add your planning poker estimate with Zenhub @jacobshandling

[jmwatts]

@jacobshandling there wasn't a test plan on this one so I added some steps. Can you confirm that the test plan appropriately covers the changes that were made?
Should I see Version, Type, Last used, File path, and Vulnerabilities on every details modal or will there be scenarios where those won't appear?

The reason I am asking is because on Ubuntu, I don't ever see anything other than Version and Type. On Mac and Windows, sometimes Last used is there and sometimes it's not. Very occasionally, there won't be a File path. And sometimes there is an "Install details" tab in the modal that doesn't seem to work.

[jacobshandling]

Great catches @jmwatts, thank you. To document what we discussed:

I've hidden the "Install details" tab on the My device page for now (see PR for details on reasoning and next steps).

Regarding varying information being returned and displayed, the UI is displaying whatever data it gets from the API. Whether or not the API is returning data as expected in various cases (Filepath, last used, etc.) is a question for product, so we're adding to the design review agenda. If it's working as expected, we're good, and if not, we can either call it a bug or a feature request and have that implemented on the next iteration.