[MGNLFE-670] SSR & Personalization . As a frontend developer I want VariantAwareTemplateAnnotationEndpoint to include selected variants in annotations Created: 16/Oct/23  Updated: 18/Dec/23

Status: Accepted
Project: Magnolia Frontend Helpers
Component/s: None
Affects Version/s: None
Fix Version/s: None

Type: Story Priority: Neutral
Reporter: Oanh Thai Hoang Assignee: Unassigned
Resolution: Unresolved Votes: 0
Labels: None
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified

Template:
Acceptance criteria:
Empty
Task DoD:
[ ]* Doc/release notes changes? Comment present?
[ ]* Downstream builds green?
[ ]* Solution information and context easily available?
[ ]* Tests
[ ]* FixVersion filled and not yet released
[ ]  Architecture Decision Record (ADR)
Date of First Response:
Epic Link: SPA Editor Backlog
Team: DeveloperX

 Description   

Context

Currently, VariantAwareTemplateAnnotationEndpoint does not return selected variant names in annotation, so frontend helpers need to communicate with Magnolia by postMessage and modify annotation at client side. This behavior causes problems for server-side rendering (SSR) frameworks. SSR frameworks are run on server side and cannot communicate with Magnolia to get selected variants.

Problem details

As mentioned above, frontend helpers communicate with Magnolia via postMessage to get selected variants then manipulate template annotations with the info to add selected variant to annotation. Process of getting variants template annotations is currently handle in client side. From observation, sometimes it causes incorrect placement of green bars and external page editor needs to re-run multiple times to render green bars.

Here is current process:

  • SPA will fetch content and annotations with origin variants as default.
  • Frontend-helpers will render components with the content and original annotations.
  • Frontend-helpers receive selected variants from postMessage, then update annotations and trigger re-render all components.

Because Page Editor needs to re-render green bars, especially each SPA component will trigger green bars refresh, it could cause the green bars are created incorrectly in due to annotation changes.

Proposal

After discussion, oanh.thai and canh.nguyen suggest:

  • VariantAwareTemplateAnnotationEndpoint returns annotions with selected variants merged from request query parameters.
  • Develop a new template annotation client in frontend helpers that reads selected variants stored in browser session storage, then sends to VariantAwareTemplateAnnotationEndpoint.
  • Page Editor may need to organize and standardize selected variants in session storage to share it with frontend helpers. 


 Comments   
Comment by Oanh Thai Hoang [ 17/Oct/23 ]

Hi czimmermann anh rsiska. Could you pls take a look on above proposal. Thank you

Comment by Christopher Zimmermann [ 20/Oct/23 ]

Sounds good. Lets discover it more when we have the chance and consider pros and cons of this approach versus the current approach.

Comment by Christopher Zimmermann [ 13/Nov/23 ]

This should support if multiple components on the page have variants. It should remember which variant each component is on.

Generated at Mon Feb 12 05:49:39 CET 2024 using Jira 9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b.