display image files

[feloy]

Signed-off-by: Philippe Martin phmartin@redhat.com

What does this PR do?

Display the files in an image.

Current limitations:

• works only if a single provider is installed
• doc needs to be written to explain the sizes displayed in the layers cards and what does the checkbox Show layer only
• design to be discussed

Screenshot / video of UI

image-files-explorer.mp4

What issues does this PR fix or reference?

Fixes #7801

How to test this PR?

Start Podman Desktop with the fake extension https://github.com/feloy/podman-desktop-extension-image-files-fake, for example:

yarn watch --extension-folder ../podman-desktop-extension-image-files-fake/

Go to the details page of an image, and select the Files tab.

Navigate through the layers and see the files in this layer.

A checkbox Show layer only gives the choice to:

• (off) display the state of the filesystem at this layer (considering all the layers up to this one)

• (on) display only the files added/deleted/modified in this layer

• Tests are covering the bug fix or the new feature

[benoitf]

just wanted to confirm if we proceed with the UI here or if it goes to a self-contained extension providing its own webview ?

[deboer-tim]

Personally I think we should provide the ability for extensions to extend details pages with extra tabs using webviews, and things like this, image checker, etc could be provided as extensions unless/until there's a reason to integrate, like if it made sense having multiple providers integrated on the same UI screen. Even developing as a built-in extension would ensure clean arch/API/separation vs continually adding UI to Podman Desktop for one extension to use.

That said, holding this up for a core feature would be a huge impediment so I am fine moving forward as-is. 👍🏼

[jeffmaury]

Personally I think we should provide the ability for extensions to extend details pages with extra tabs using webviews, and things like this, image checker, etc could be provided as extensions unless/until there's a reason to integrate, like if it made sense having multiple providers integrated on the same UI screen. Even developing as a built-in extension would ensure clean arch/API/separation vs continually adding UI to Podman Desktop for one extension to use.

That said, holding this up for a core feature would be a huge impediment so I am fine moving forward as-is. 👍🏼

I think it depends on the nature of the extension: for the image checker, you may have several implementations but I think it does not make much sense that each extension provide its own UI. In this case, I think there will be a single extension so the 2 options are opened

[deboer-tim]

I think it depends on the nature of the extension: for the image checker, you may have several implementations but I think it does not make much sense that each extension provide its own UI. In this case, I think there will be a single extension so the 2 options are opened

Yeah, totally agreed, but even in this case there is no difference until there are 2 providers. IMHO the 'ideal progression' in cases like this would be starting as a standalone extension until it's clear there are multiple providers and one UI makes sense, and even then it could probably be done via shared extension now. In practice (and even 2 months ago) that's not always feasible, but we need to avoid everything needing to be done in renderer. (and again, not for this PR :) )

[benoitf]

works for me as first iteration

[deboer-tim]

Ok merging, but please open up a followup issue to replace hardcoded colors. Especially ones like gray-900, gray-700, but should do layer colors too.