-
Notifications
You must be signed in to change notification settings - Fork 297
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
Fixes #38107 - Booted container images page #11269
base: master
Are you sure you want to change the base?
Conversation
It looks like I can't use the Foreman React Table component due to the expandable rows. That component sticks children inside a
|
ef686fc
to
d861aea
Compare
const BootedContainerImagesPage = () => { | ||
const columns = { | ||
image_name: { | ||
title: __('Image name'), |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can we change this to Bootc - booted image name so it's also easier to figure out the serach query?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I changed all of the references to image_name to bootc_booted_image like in the API.
So we don't forget after the break, the bookmarks controller needs some love on the page to work.. |
85536ed
to
7ac103d
Compare
Sorting support is in! |
7ac103d
to
f634101
Compare
f634101
to
5c0f7d4
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I've fixed bookmarks and tidied up some things.
Empty state is still broken and I'm a little confused, and the table doesn't match the mock-up perfectly. Details below:
!errorMessage && ( | ||
<Tr ouiaId="table-empty"> | ||
<Td colSpan={100}> | ||
<EmptyPage |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'm not sure why, but this empty state page does not want to get rendered. The loading page renders even, just not this one.
<TableComposable variant="compact" isStriped ouiaId={`table-composable-expanded-${rowIndex}`}> | ||
<Thead> | ||
<Tr ouiaId={`table-row-inner-expandable-${rowIndex}`}> | ||
<Th width={50}>{__('Image digest')}</Th> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I tried to use the width to align the inner "Hosts" data with the outer "Hosts" data, but they are always off by a little bit. So, for now, I distanced them enough to not look completely weird. Ideally I could remove the Hosts header in the inner expanded table and have that data be perfectly lined up with the outer table's hosts count. However, I'm not sure if that's easily possible with these PF components.
5c0f7d4
to
5af40f2
Compare
What are the changes introduced in this pull request?
Adds the "Booted container images" page. In the future it'll likely change to be the "Containers" page and merge with the new container images UI.
Within the page, there is a table that shows an overview of booted container images used by bootc hosts. The table shows the image name, number of digests within, and the number of hosts using that container image:
The last functionality-TODO is to make the rows expand and show the actual digests within. I also need to write tests.
Considerations taken when implementing this change?
I decided to use the newer TableIndexPage from Foreman since it's the new goodness.
This PR is built on top of #11257.
What are the testing steps for this pull request?