This migrates the Labels, Nodes and
Projects pages to using the react-table
component from patternfly.
Change-Id: Iaa75e70f4b0c25113369939f97a297571f2ea7a5
Currently the "refresh" animations look quite different depending on the
page and the type of event (refresh button, initial page load, ...).
This tries to make a start by updating the "Fetching info ..." animation
(shown on initial page load) with Patternfly's "empty state" pattern [1]
in combination with an animated spinner.
For "Refreshable" pages, a similar animation is used in the upper right
corner (like before) but with an updated spinner and icon. By using a
dedicated React component rather than a base class, the "refresh" button
can be more nicely integrated into the layout of the page/container and
it doesn't look "out of scope" for the refreshable component.
For the API page I've removed the refresh completely since it wasn't
implemented at all.
[1] https://www.patternfly.org/v4/documentation/react/components/emptystate
Change-Id: I2274c212f14aece27ff49bfc7900d9b1a0fd01d0
Since Patternfly 4 (PF4) is a complete rewrite of the framework that
doesn't require bootstrap and comes with a new npm package, it's
possible to include both side-by-side in a project.
This change includes the necessary PF4 packages and updates the header,
navbar, drawer (shows the config errors) and global page layout with PF4
components. Once this is done, we should be able to update the other
components step by step to PF4.
Points to keep in mind for the migration phase:
1. Some Patternfly 3 CSS rules are overridden by Patternfly 4
wildcards, mostly (re)setting the padding and margin of various
elements to 0.
To fix this unwanted behaviour, there is a pf4-migration.css file
included were we can keep track on those rules and ensure that the
old padding and margin values are re-applied after Patternfly 4 is
imported.
Change-Id: I77b81fa0f97fe718207ba5a506cee300371c693b
Currently the links on the project page are using the non-canonical
name which can be amgibuous. In this case the link will result in an
error 500. Instead use the canonical name which is unique.
Change-Id: Ic4a73bf70af364e15d0637babfb899225c1fa9e0
Story: 2005244
Task: 30036
This change updates the projects page to dispatch reducer action
instead of direct axios call. This enables using the generic
error reducers as well as keeping the jobs list in the store to
avoid repeated query.
Change-Id: Ie9d5694649df515388f2f5e606887451ccdcf769