This adds a theme selection in the preferences in the
config modal and adds a new dark theme.
Removes the line.png image and instead uses CSS
linear-gradient that is available in all browsers
since around 2018, also fixes the 15 pixels spacing
issue that is there today.
You can select between three different themes.
Auto will use your system preference to choose either the
light or dark theme, changes dynamically based on your
system preference.
Light is the current theme.
Dark is the theme added by this patch series.
The UX this changes is that if somebody has their system
preferences set to dark, for example in Mac OS X that is
in System Settings -> Appearance -> Dark the user will
get the Zuul web UI in dark by default and same for the
opposite.
This uses a poor man's dark mode for swagger-ui
as per the comment in [1].
[1] https://github.com/swagger-api/swagger-ui/issues/5327#issuecomment-742375520
Change-Id: I01cf32f3decdb885307a76eb79d644667bbbf9a3
This corrects the tab titles on the project page which currently
typically just say "master", "master", "master", ... because they
all display the default branch of the project stanza.
Instead, use the branch of the source context for the project stanza,
or, if the project stanza is not from the current project, then
use the name of its project.
This causes them to appear like:
"openstack/project-config", "master", "stable/diablo", ...
Also, update the entire Project page component hierarchy to use
hooks instead of classes.
Update the styling on the H2 element so that we can have the
refresh icon share the same vertical space (so that we don't have
large amounts of wasted vertical space at the top of each page.
Change-Id: I863e0eb4a7f20ee6363e596e61cc49b2cbc22953
This adds the ability to display the frozen job graph for a project.
It adds a toolbar to the Project page that allows a user to enter
a pipeline and branch. Hit the button and it will use the API
to freeze the job graph and then display it with graphviz (there
is a webassembly build of the graphviz libray).
Change-Id: Ieb5899a63a4c85eb5d445fa69dd1e85ddc11575d
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
This change updates the project page component to dispatch reducer
action instead of direct axios call. This enables using the generic
error reducers as well as keeping the tenant projects in the store to
avoid repeated query.
Change-Id: Ib91e0f338fd87c57534a90d7168f0dab98f2df62
Tobias Urdin