Uploaded image for project: 'Magnolia Frontend Helpers'
  1. Magnolia Frontend Helpers
  2. MGNLFE-670

SSR & Personalization . As a frontend developer I want VariantAwareTemplateAnnotationEndpoint to include selected variants in annotations

    XMLWordPrintable

Details

    • Story
    • Resolution: Unresolved
    • Neutral
    • None
    • None
    • None
    • None

    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. 

      Checklists

        Acceptance criteria

        Attachments

          Issue Links

            Activity

              People

                Unassigned Unassigned
                oanh.thai Oanh Thai Hoang
                DeveloperX
                Votes:
                0 Vote for this issue
                Watchers:
                2 Start watching this issue

                Dates

                  Created:
                  Updated:

                  Checklists

                    Task DoD