search

integr8ly / tutorial-web-app

Solution Explorer provides the front door into the Integreatly initiative. It hosts the various Solution Patterns, as well as providing a dashboard of installed applications/products/services.
Apache License 2.0
36 stars 54 forks source link

APPDUX-167: First phase of configuration management #595

Closed mfrances17 closed 4 years ago

mfrances17 commented 4 years ago

Motivation

JIRA: https://issues.redhat.com/browse/APPDUX-167

Design spec: https://marvelapp.com/11id0249/screen/69959965

What

Add multi-tab interface for Solution Explorer settings page. Revise existing solution patterns tab and create new Managed Integration schedule-related tab as described by JIRA story and design spec. The new tab:

Why

Allow users to make backend OpenShift changes directly via Solution Explorer vs. editing the config YAML in OpenShift.

Verification Steps

  1. Log in with admin account.
  2. Go to the Settings page.
  3. Click the Managed Integration schedule tab.
  4. Select a start time for backups and click Save.
  5. Verify that if you go to settings again, the Next daily backup date/time has changed. Bonus points, go to the RHMIConfigs YAML on OpenShift and verify that the values have changed accordingly.
  6. Verify that the Start time dropdown displays the current Next daily backup.
  7. Verify that the weekly maintenance window date/time reflects what is in the YAML file.
  8. Verify that the backup dropdown has disabled the time in which the weekly maintenance window occurs so that it is not selectable.
  9. Click the Solution Pattern content tab.
  10. Verify that the syntax checking and ability to add new github repos still works.
  11. Verify that the new 'Learn more...' link at the bottom navigates to the expected URL. Note that currently it loads the correct page but it looks like Doc has not created the expected bookmark. Not a bug with this code.

Checklist:

Progress

Additional Notes

Functionality is complete, and most CSS and other related changes are complete. Sending this as a draft pull request because of known CSS issues that are being fixed... wanted to get the core functionality/code into review.

Known CSS issues:

Testing: For now, you can test on my OpenShift cluster (available until 6/27): https://solution-explorer.apps.cluster-uxddev-730d.uxddev-730d.example.opentlc.com/

This build disables security so you can log in as a non-admin, for ease of testing. Can also load a version with security if desired.

Also, you can load either of the following docker images onto your own OpenShift cluster, the first disables security so you don't need to be logged in as Admin, the second has security enabled and is how it will eventually be released:

docker.io/mfrances17/dev-tutorial-web-app:configNoSecurity docker.io/mfrances17/dev-tutorial-web-app:config

Screen caps

Backup tab: backup_tab

Solution Patterns tab: solution_pattern_tab

Conflicting maintenance window time disabled: maint_time_disabled

RHMIConfig YAML write succeded: YML_config_changed

phcox commented 4 years ago

I had the same experience as Jenny with Firefox.

Found two issues:

  1. The behavior of the Save button on Solution Pattern content tab. To recreate:

Type a syntax-valid repository URL in the list (I had actually typed two but this may be recreated with just one.) - Save is enabled. Click the Home link to exit to Solution Explorer Navigate back to Solution Pattern content tab The repository link(s) are removed but the Save button remains enabled - it should be disabled

I did this initially in Firefox and then attempted to test in Chrome but could not because the same state existed - the Save button was enabled with no URLs listed in the field.

In both browsers, I tried a scenario in which I then entered a syntax-valid URL and then clicked Save. When I returned to the Solution Pattern content tab, the URL was saved as expected, but Save button was still enabled.

  1. On Firefox and Chrome, a tooltip labelled "Solution Pattern content" appears when the cursor rests on any location in the white space on the tab.
mfrances17 commented 4 years ago

@phcox The Save button on the solution patterns tab has always been enabled by default. This was by design so you can have an empty field to clear existing added repos. I'll look into the other issues.

mfrances17 commented 4 years ago

@jenny-s51 thanks, i'll investigate the firefox dropdown issue

mfrances17 commented 4 years ago

@phcox @jenny-s51 i've fixed the tab title display on hover issue and the dropdown date issue that was occurring in firefox. i've updated my server with the latest code.

Edit: CSS fixes for the top spacing on tab cards as well as expanding the permissions needed card to full size are now up on my server.

Edit 2: CSS fixes for making tab contents un-selectable and reducing the size of the dropdown items so they don't expand across the entire tab are now up on my server.

jenny-s51 commented 4 years ago

@mfrances17 Working as expected now in Firefox -- this is looking good!

This change you made:

.pf-c-dropdown__menu { min-width: var(--pf-c-dropdown__toggle--MinWidth); }

for some reason doesn't completely align the width of the dropdown items with the dropdown toggle width, but maybe that's just a minor nit so we can merge this. Also, it would definitely be nice to make the dropdown items list scrollable at some point.

Screen Shot 2020-06-26 at 9 08 21 AM

Great work!