OpenShift Container Platform 2 column view

[cdcabrera]

What's included

• fix(style): on error, page layout extends below left nav
• chore(productViewOpenShiftDedicated): code annotation
• feat(productViewOpenShiftContainer): ent-3324 two column view
  • i18n, locale strings
  • openshiftView, converted to productViewOpenShiftContainer
  • productView(s), remove unused viewSelector, redux refs
  • productViewOpenShiftContainer, useSelector for uom
  • routerConfig, point to new component
  • viewSelectors, removed, unnecessary

Notes

• This PR currently contains... issues
  • Resolved, quick fixes/hacks to get the two column view to minimally function with UOM. It is not ready for release.
    • we can probably switch to useState and replace the entire hack switched to using useSelector
  • Subsequent PR graph redraw is even more noticeable when there are 2 graphs, we do have fix to help with this, switching to context and hooks
    • https://github.com/cdcabrera/curiosity-frontend/tree/20210218-dev-hooks-ent-3324/src/components/graphCard
    • https://github.com/cdcabrera/curiosity-frontend/tree/ent-3324/src/components/graphCard
    • it appears the redraw is specifically tied to the custom tooltips and appears to make little difference in what React Pattern is used. Removing the tooltips from Victory corrects all redraw behavior ... this is a non-solution and requires further research
  • Subsequent PR graph tooltips may get clipped by the SVG border because of the way victory handles tooltips. we may be able to override this with HTML/CSS. testing in an environment will help resolve this if any issue exists.
    • Initially, it appears this has more to do with the narrow columns and the left navigation system. When the left nav is active the tooltips appear to behave which leads us to educated guess there's some level of CSS causing the issue.
  • we removed the banner alerts since they made use of pulling from the product ids... now that there are 2 product ids associated with the page need to determine if we just ignore the Openshift-metrics since it appears as a facet of the other

How to test

Coverage and basic unit test check

1. update the NPM packages with $ yarn
2. $ yarn test
3. confirm tests come back without error

Proxy run check

1. update the NPM packages with $ yarn
2. make sure Docker is running, plus on network, then
3. $ yarn start:proxy
4. you can attempt to login and navigate towards the original OpenShift route /subscriptions/openshift-sw to bring up the new 2 column view. It is expected that only the OpenShift Container Platform is currently functioning (the left side, see below screenshots)

Example

Emulated testing data

Expected environment view (temporarily broken, missing data)

Updates issue/story

ent-3324
ent-3506
ent-3505
ent-3504

[codecov-io]

Codecov Report

Merging #591 (241923c) into ci (e5cf9d3) will decrease coverage by 1.35%.
The diff coverage is 45.94%.

@@            Coverage Diff             @@
##               ci     #591      +/-   ##
==========================================
- Coverage   94.25%   92.89%   -1.36%     
==========================================
  Files          87       87              
  Lines        2140     2605     +465     
  Branches      540      905     +365     
==========================================
+ Hits         2017     2420     +403     
- Misses        104      151      +47     
- Partials       19       34      +15     

Impacted Files	Coverage Δ
src/components/productView/productView.js	100.00% <ø> (ø)
...nents/productView/productViewOpenShiftDedicated.js	94.44% <ø> (-5.56%)	⬇️
src/components/openshiftView/openshiftView.js	49.36% <43.66%> (-42.30%)	⬇️
src/components/productView/productViewRhel.js	91.42% <100.00%> (-0.24%)	⬇️
src/components/productView/productViewSatellite.js	91.42% <100.00%> (-0.24%)	⬇️
src/redux/selectors/viewSelectors.js	100.00% <100.00%> (ø)
src/components/router/redirect.js	65.00% <0.00%> (-5.59%)	⬇️
src/components/router/routerHelpers.js	91.42% <0.00%> (-5.45%)	⬇️
src/redux/selectors/subscriptionsListSelectors.js	97.22% <0.00%> (-2.78%)	⬇️
... and 51 more

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update e5cf9d3...241923c. Read the comment docs.