feat(rhelView, openshiftView): issues/305 add sub heading

[zanewoodfin]

What's included

• feat(rhelView, openshiftView): issues/305 add sub heading
  • add applicable subheading to rhelView
  • add applicable subheading to openshiftView

Notes

PageHeader was refactored to accept an explicit title prop and/or a block of content to include below the title. Other views using this component should all have been updated if needed.

How to test

Coverage and basic unit test check

1. update the NPM packages with $ yarn
2. $ yarn test

Local run check

1. update the NPM packages with $ yarn
2. $ yarn start
3. Visit /openshift-sw and confirm subheading text is correct and associated link works
4. Visit /rhel-sw/all and confirm subheading text is correct and associated link works

Example

Updates issue/story

https://github.com/RedHatInsights/curiosity-frontend/issues/305
related to #302

[cdcabrera]

• Test confirmations, expanding them in a predictable way
• Restoring "isRequired"
• Confirming if "Pendo" can generate the link for us
• Confirming Travis accepts the "anchor" tag
• Confirm with design that the paragraph doesn't need more padding. There may be an element/wrapper missing. Double check PF4 docs and the Frontend Components repo for Platform

[cdcabrera]

To help push this PR along bright and early...

Recommend you take centralization as the key. Use your concept of "[storing urls]" and wanting to remove the pageHeader as the basis. We store our strings in a centralized location, yes?!

1. First pass the Product IDs into the existing header component. You'll also need to setup translation/locales on the component. This should highlight that "title" can once again be used as "children" and "isRequired", and that the loader component will remain unaffected.
   • https://github.com/RedHatInsights/curiosity-frontend/blob/ci/src/components/rhelView/rhelView.js#L48
   • https://github.com/RedHatInsights/curiosity-frontend/blob/ci/src/components/table/table.js#L219
2. Then use the sub-title area to access the centralized locale strings similar to the "key" used below. Make sure to relocate your locale strings under the view section in en-US.json i.e. [product]Title, [product]Subtitle or [product]Description. This will also let you centralize the anchor tag href. Hopefully this provides you additional insight into why the header component exists
   • https://github.com/RedHatInsights/curiosity-frontend/blob/ci/src/components/graphCard/graphCardChartTooltip.js#L45
3. Finally, unless design catches up with you first, plan on Curiosity having the link in the header component. If design is planning on having a "unique url" for each product we need to encourage the use of Pendo, or make sure they understand that "generic" continues to be better for long term maintenance.
   • https://github.com/RedHatInsights/curiosity-frontend/blob/ci/src/components/optinView/optinView.js#L68-L73
   • If a Button component/tag is used and the link is from Pendo observe the CONTRIBUTING.md guideline on CSS class names.
     • https://github.com/RedHatInsights/curiosity-frontend/blob/ci/CONTRIBUTING.md#reserved-css-class-names
     • https://github.com/RedHatInsights/curiosity-frontend/blob/ci/src/components/optinView/optinView.js#L132-L134
   • Use the optinView anchor tag string replacement as a basis
     • https://github.com/RedHatInsights/curiosity-frontend/blob/ci/src/components/optinView/optinView.js#L68-L73

If you continue to have issues with the Button component/link according to what Travis is logging, we'll setup some time to confirm you're actively seeing the Travis log. And we'll confirm you know how to emulate what's happening in CI/Travis. The error we saw gave an exact solution to the issue.

• 

Again, there are no plans to alter the linter. It has been behaving as intended for the past few years across multiple projects, it may feel stifling but it's there to remove our opinions, and provide consistent output while giving us the ability to focus on actual issues, like architecting a reusable set of components that can potentially expand across a few dozen products. There will be times when it needs to be relaxed, but we have yet to come across an active "[it's broken]" scenario.

[cdcabrera]

• 1 minor change, t prop in pageHeader.js
• 1 future note that'll probably cause way more snapshot updates, lets avoid this round

[codecov-commenter]

Codecov Report

Merging #348 into ci will not change coverage.
The diff coverage is 100.00%.

@@           Coverage Diff           @@
##               ci     #348   +/-   ##
=======================================
  Coverage   92.41%   92.41%           
=======================================
  Files          61       61           
  Lines        1476     1476           
  Branches      349      349           
=======================================
  Hits         1364     1364           
  Misses         98       98           
  Partials       14       14           

Impacted Files	Coverage Δ
src/components/openshiftView/openshiftView.js	100.00% <ø> (ø)
src/components/rhelView/rhelView.js	100.00% <ø> (ø)
src/components/pageLayout/pageHeader.js	100.00% <100.00%> (ø)

---

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 ece379f...70f01d2. Read the comment docs.

[cdcabrera]

LGTM!