SHS-5070: Implementation: Switch H2 headings in collection components to H3 in some cases (Back End)

[hectorlj]

READY FOR REVIEW

Summary

• Add new Title and Title Settings fields to the hs_collection paragraph type
• Add conditional field settings to new fields for inline entity form

Steps to Test

Backend

1. Create a new Flexible Page
2. Add a Collection component in the "Main Region"
3. Verify the Title and Title Settings fields are in the component
4. Verify the Title field is set to required when it is visible
5. Verify the following options are in the `Title Settings
6. Verify the Title field is hidden and not required when `Title Settings is set to the following values:

• I've already created a Heading 2 above this Collection
• I do not want a heading for this Collection

7. Test this out using multiple components, and multiple collection components

Frontend

1. Following the steps above for testing Backend, create multiple flexible pages, with multiple combinations of title settings and child components (*). Confirm the following:

• If you select "The Collection title should be visible as a Heading", you should see the title as an <h2>
• If you select "The Collection title should be available to screen readers only" the title will be included as an <h2>, but visually hidden
• If you choose any of the other 2 options, there will be no title rendered for the collection
• If you choose any title setting option except the last one ("I do not want a heading for this Collection") the headings of the child components will be rendered using an <h3>. Otherwise, they will be rendered as an <h2>
• There are no visual differences between <h2> and <h3>

(*) The following components don't have a header, you can skip them when testing: Text Area, Accordion, Banner Image and Testimonial.

PR Checklist

• PR Checklist
• Humsci Basic PR Checklist

[cienvaras]

@hectorlj Looks good, just a couple of things:

• Please check CodeClimate errors
• "Title" field is correctly being conditionally set as required, but it also should be hidden when not required
• We'll probably need an update hook to set a value for existing collections. Let's confirm with Amit on today's check-in.

[hectorlj]

Thanks @cienvaras! I also realized that I need to update the codeception collection test, and the form display conditional that hides the title needs an update hook.

[cienvaras]

@hectorlj Works great, thanks! Not merging yet because I'll be adding the FE work on this same branch, but we can consider the BE part as complete.

[cienvaras]

@mndonx Can you please take a look at the FE part of this PR? I added instructions in the description.

Files to include in FE review:

• docroot/modules/humsci/hs_layouts/hs_layouts.module
• docroot/modules/humsci/hs_layouts/patterns/gradient-hero/gradient-hero.html.twig
• docroot/modules/humsci/hs_layouts/patterns/hero-text-overlay/hero-text-overlay.html.twig
• docroot/modules/humsci/hs_layouts/patterns/horizontal-card/horizontal-card.html.twig
• docroot/modules/humsci/hs_layouts/patterns/spotlight/spotlight.html.twig
• docroot/modules/humsci/hs_layouts/patterns/timeline/timeline.html.twig
• docroot/modules/humsci/hs_layouts/patterns/vertical-card/vertical-card.html.twig
• docroot/modules/humsci/hs_layouts/patterns/vertical-link-card/vertical-link-card.html.twig
• docroot/themes/humsci/humsci_basic/humsci_basic.theme
• docroot/themes/humsci/humsci_basic/src/scss/_main.scss
• docroot/themes/humsci/humsci_basic/src/scss/components/_pattern.hero.scss
• docroot/themes/humsci/humsci_basic/src/scss/components/_pattern.spotlight.scss
• docroot/themes/humsci/humsci_basic/src/scss/components/_pattern.timeline.scss
• docroot/themes/humsci/humsci_basic/src/scss/components/_viewfield-item.scss
• docroot/themes/humsci/humsci_basic/src/scss/tools/_mixins.heros.scss
• docroot/themes/humsci/humsci_basic/templates/components/paragraph--hs-collection.html.twig
• docroot/themes/humsci/humsci_basic/templates/field/viewfield-item.html.twig

[mndonx]

This looks good! The only comment I have is maybe leave a comment or two to explain what the functions are doing. Otherwise, I have tested it locally and it works as expected.