Expandable page part

[rosemcc]

New feature for rich text / body media: Expandable Page Part

This is to handle a new page part content type in Contentful called 'Expand'. Expands can be used within rich text in a page entry. The Expand is itself a rich text field. Currently Expands cannot contain a nested Expand due to the field validation settings in Contentful, however this implementation would allow that use case if necessary. They can however, contain any other type of rich text entry (entries, assets, hyperlinks).

User story

As a content author I want to add collapsible sections to my page so that I can have long pages with subsections which readers will be able to easily skim and dip into as need dictates.

Implementation notes

• New component: expandable-page-part
• Graphql query GetExpandPartByIdGQL
• Uses mat-expansion-panel
• Uses ngx-contentful-rich-text and the body-media.service to render the rich text within the expansion component body
• Uses the top 50 characters of the body text with an ellipsis for a summary/description on the expand panel
• To optimise page loading time, lazy rendering is used so the panel content isn't rendered until the panel is opened

[rosemcc]

@Trombach ready to check :)

[Trombach]

This is really cool. I like how the component loads the content itself instead of relying on the data being passed in! I've added one comment about the async request to bring it more in line with what I'm doing with the content page refactor. Take a look and let me know what you think 😄