[MGNLFE-558] React editor has experimental NEXT.js 13 App Router Created: 05/Jul/23  Updated: 15/Jan/24  Resolved: 15/Jan/24

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

Type: Epic Priority: Neutral
Reporter: Oanh Thai Hoang Assignee: Christopher Zimmermann
Resolution: Fixed Votes: 0
Labels: None
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified

Issue Links:
causality
caused by MGNLFE-466 Discovery to support for Next.js 13+ ... Closed
relation
is related to MGNLFE-578 Update react-samples to use functiona... Open
Template:
Epic Name: React RSC
Acceptance criteria:
Empty
Release notes required:
Yes
Documentation update required:
Yes
Date of First Response:
Team: DeveloperX
Work Started:

 Description   

Status

As documented here: https://docs.magnolia-cms.com/headless/spa-development/magnolia-front-end-helpers-for-SPA.html
 

React Server Components (RSC) and NextJS App Router
Experimental support for React Server Components and NextJS App Router is available in version 1.6-experimental.6 of the react-editor.
To learn more about this feature and to try it in a demo, see README-nextjs-app-router.md (in the minimal-headless-spa-demos repository).

(ON the nextjs-app-router-demo branch)

Ticket

Support App Routing in Next JSS 13 and "React Server Components".

Discovery was done here: https://jira.magnolia-cms.com/browse/MGNLFE-466

Plan of action: 

 
Replace React.createContext() in EditorContext.js using a global singleton that can share data between components:

  • Consider moving unchanged data in 1 js singleton (componentMappings, fallbackComponent, devMode)
  • And easy changed data in another js (content from page, templateAnnotations)

Move from class components to functions and pls following with ordered tickets:

 
1. EditableComment (interactivity component)

2. EditableComponent (no interacty)

3. EditableArea (no interacty)

4. EditablePage (no interacty)

5. RegiterEvents with PageEditorBridge (interactivity component, just use hook, no render needed)

Full notes are here: https://wiki.magnolia-cms.com/display/TH2/SPA+Editor+and+Next+13+and+RSC



 Comments   
Comment by Christopher Zimmermann [ 15/Jan/24 ]

React Server Components (RSC) and NextJS App Router
Experimental support for React Server Components and NextJS App Router is available in version 1.6-experimental.6 of the react-editor.
To learn more about this feature and to try it in a demo, see README-nextjs-app-router.md (in the minimal-headless-spa-demos repository).

(ON the nextjs-aapp-router-demo branch)

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