chore(table): update column management demo with new data

[jenny-s51]

What: Closes #7991

Bonus updates!!:

• Cleaned up the demo! Now 500 lines shorter/cleaner 🧼
• Converted to function component with hooks 🪝
• Converted to use TableComposable which is the PF recommendation over legacy table
• Moved demo to standalone file which is the convention we are following for other PF components/demos

Demo link for convenience: https://patternfly-react-pr-8044.surge.sh/components/table/react-demos/column-management/

[patternfly-build]

Preview: https://patternfly-react-pr-8044.surge.sh

A11y report: https://patternfly-react-pr-8044-a11y.surge.sh

[mcarrano]

@jenny-s51 This looks good to me. But I'll defer to @mmenestr as I believe she worked on the original design.

[mmenestr]

This looks good as far as the manage column function goes! I would just add a Page header to the page because it looks a bit weird to just have breadcrumbs

[nicolethoen]

I also spent some time wondering if there was a better way to control column widths so that the widths dont jump around as you paginate. I'm not sure, because since the columns obviously change as they are being managed.

My only instinct is to use the width prop on columns that might change size so they are always wide enough to fit the longest content (in our case) - specifically, that means 'servers', 'status', and 'location' i think. Not sure if that would work?

[nicolethoen]

@thatblindgeye @jenny-s51 The issue with an extra Loading... has been reported :) https://github.com/patternfly/patternfly-org/issues/3209

[patternfly-build]

Your changes have been released in:

• @patternfly/[email protected]
• @patternfly/[email protected]
• @patternfly/[email protected]
• @patternfly/[email protected]
• @patternfly/[email protected]
• @patternfly/[email protected]
• [email protected]
• @patternfly/[email protected]
• @patternfly/[email protected]
• @patternfly/[email protected]
• @patternfly/[email protected]

Thanks for your contribution! :tada: