<!-- 
RSS generated by JIRA (9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b) at Mon Feb 12 05:48:36 CET 2024

It is possible to restrict the fields that are returned in this document by specifying the 'field' parameter in your request.
For example, to request only the issue key and summary append 'field=key&field=summary' to the URL of your request.
-->
<rss version="0.92" >
<channel>
    <title>Magnolia - Issue tracker</title>
    <link>https://jira.magnolia-cms.com</link>
    <description>This file is an XML representation of an issue</description>
    <language>en-uk</language>    <build-info>
        <version>9.4.2</version>
        <build-number>940002</build-number>
        <build-date>19-01-2023</build-date>
    </build-info>


<item>
            <title>[MGNLFE-558] React editor has experimental NEXT.js 13 App Router </title>
                <link>https://jira.magnolia-cms.com/browse/MGNLFE-558</link>
                <project id="16792" key="MGNLFE">Magnolia Frontend Helpers</project>
                    <description>&lt;h1&gt;&lt;a name=&quot;Status&quot;&gt;&lt;/a&gt;Status&lt;/h1&gt;

&lt;p&gt;As documented here: &lt;a href=&quot;https://docs.magnolia-cms.com/headless/spa-development/magnolia-front-end-helpers-for-SPA.html&quot; class=&quot;external-link&quot; target=&quot;_blank&quot; rel=&quot;nofollow noopener&quot;&gt;https://docs.magnolia-cms.com/headless/spa-development/magnolia-front-end-helpers-for-SPA.html&lt;/a&gt;&lt;br/&gt;
&#160;&lt;/p&gt;

&lt;p&gt;&lt;b&gt;React Server Components (RSC) and NextJS App Router&lt;/b&gt;&lt;br/&gt;
Experimental support for React Server Components and NextJS App Router is available in version &lt;tt&gt;1.6-experimental.6&lt;/tt&gt; of the &lt;tt&gt;react-editor&lt;/tt&gt;.&lt;br/&gt;
To learn more about this feature and to try it in a demo, see &lt;a href=&quot;https://git.magnolia-cms.com/projects/DEMOS/repos/minimal-headless-spa-demos/browse/README-nextjs-app-router.md?at=refs%2Fheads%2Fnextjs-app-router-demo&amp;amp;_gl=1*ef2xck*_ga*MTM5MTk0NTc1Ny4xNjk4MDcwOTIw*_ga_61HQH88LT4*MTcwNTMxNDUyNC4xNzguMS4xNzA1MzE0NTQzLjQxLjAuMA..&quot; class=&quot;external-link&quot; target=&quot;_blank&quot; rel=&quot;nofollow noopener&quot;&gt;&lt;tt&gt;README-nextjs-app-router.md&lt;/tt&gt;&lt;/a&gt; (in the &lt;tt&gt;minimal-headless-spa-demos&lt;/tt&gt; repository).&lt;/p&gt;

&lt;p&gt;(ON the nextjs-app-router-demo branch)&lt;/p&gt;
&lt;h1&gt;&lt;a name=&quot;Ticket&quot;&gt;&lt;/a&gt;Ticket&lt;/h1&gt;

&lt;p&gt;Support App Routing in Next JSS 13 and &quot;React Server Components&quot;.&lt;/p&gt;

&lt;p&gt;Discovery was done here: &lt;a href=&quot;https://jira.magnolia-cms.com/browse/MGNLFE-466&quot; class=&quot;external-link&quot; rel=&quot;nofollow&quot;&gt;https://jira.magnolia-cms.com/browse/MGNLFE-466&lt;/a&gt;&lt;/p&gt;
&lt;h1&gt;&lt;a name=&quot;Planofaction%3A%C2%A0&quot;&gt;&lt;/a&gt;Plan of action:&#160;&lt;/h1&gt;

&lt;p&gt;&#160;&lt;br/&gt;
Replace React.createContext() in EditorContext.js using a global singleton that can share data between components:&lt;/p&gt;
&lt;ul&gt;
	&lt;li&gt;Consider moving unchanged data in 1 js singleton (componentMappings, fallbackComponent, devMode)&lt;/li&gt;
	&lt;li&gt;And easy changed data in another js (content from page, templateAnnotations)&lt;/li&gt;
&lt;/ul&gt;


&lt;p&gt;Move from class components to functions and pls following with ordered tickets:&lt;/p&gt;

&lt;p&gt;&#160;&lt;br/&gt;
1. EditableComment (interactivity component)&lt;/p&gt;
&lt;ul class=&quot;alternate&quot; type=&quot;square&quot;&gt;
	&lt;li&gt;Convert all class components to function components:&#160;&lt;a href=&quot;https://nextjs.org/docs/messages/class-component-in-server-component&quot; class=&quot;external-link&quot; target=&quot;_blank&quot; rel=&quot;nofollow noopener&quot;&gt;https://nextjs.org/docs/messages/class-component-in-server-component&lt;/a&gt;&lt;/li&gt;
	&lt;li&gt;Replace componentDidMount, componentDidUpdate, and componentWillUnmount with effect hook&#160;&lt;a href=&quot;https://legacy.reactjs.org/docs/hooks-overview.html&quot; class=&quot;external-link&quot; target=&quot;_blank&quot; rel=&quot;nofollow noopener&quot;&gt;https://legacy.reactjs.org/docs/hooks-overview.html&lt;/a&gt;&lt;/li&gt;
	&lt;li&gt;alwaysRender props should pass from parent component. Detect alwaysRender via #magnoliaContext.isMagnolia from EditorContextHelper&lt;/li&gt;
	&lt;li&gt;Add &apos;use client&apos; in top of file ( react will ignore it by default so maybe no harm at all)&lt;/li&gt;
&lt;/ul&gt;


&lt;p&gt;2. EditableComponent (no interacty)&lt;/p&gt;
&lt;ul class=&quot;alternate&quot; type=&quot;square&quot;&gt;
	&lt;li&gt;Convert all class components to function components:&#160;&lt;a href=&quot;https://nextjs.org/docs/messages/class-component-in-server-component&quot; class=&quot;external-link&quot; target=&quot;_blank&quot; rel=&quot;nofollow noopener&quot;&gt;https://nextjs.org/docs/messages/class-component-in-server-component&lt;/a&gt;&lt;/li&gt;
	&lt;li&gt;Remove all componentDidMount, componentDidUpdate, componentWillUnmount and state from react life cycle :&lt;a href=&quot;https://legacy.reactjs.org/docs/state-and-lifecycle.html&quot; class=&quot;external-link&quot; target=&quot;_blank&quot; rel=&quot;nofollow noopener&quot;&gt;https://legacy.reactjs.org/docs/state-and-lifecycle.html&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;


&lt;p&gt;3. EditableArea (no interacty)&lt;/p&gt;
&lt;ul class=&quot;alternate&quot; type=&quot;square&quot;&gt;
	&lt;li&gt;Convert all class components to function components:&#160;&lt;a href=&quot;https://nextjs.org/docs/messages/class-component-in-server-component&quot; class=&quot;external-link&quot; target=&quot;_blank&quot; rel=&quot;nofollow noopener&quot;&gt;https://nextjs.org/docs/messages/class-component-in-server-component&lt;/a&gt;&lt;/li&gt;
	&lt;li&gt;Remove all componentDidMount, componentDidUpdate, componentWillUnmount and state from react life cycle :&lt;a href=&quot;https://legacy.reactjs.org/docs/state-and-lifecycle.html&quot; class=&quot;external-link&quot; target=&quot;_blank&quot; rel=&quot;nofollow noopener&quot;&gt;https://legacy.reactjs.org/docs/state-and-lifecycle.html&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;


&lt;p&gt;4. EditablePage (no interacty)&lt;/p&gt;
&lt;ul class=&quot;alternate&quot; type=&quot;square&quot;&gt;
	&lt;li&gt;Convert all class components to function components:&#160;&lt;a href=&quot;https://nextjs.org/docs/messages/class-component-in-server-component&quot; class=&quot;external-link&quot; target=&quot;_blank&quot; rel=&quot;nofollow noopener&quot;&gt;https://nextjs.org/docs/messages/class-component-in-server-component&lt;/a&gt;&lt;/li&gt;
	&lt;li&gt;Remove all componentDidMount, componentDidUpdate, componentWillUnmount and state from react life cycle :&lt;a href=&quot;https://legacy.reactjs.org/docs/state-and-lifecycle.html&quot; class=&quot;external-link&quot; target=&quot;_blank&quot; rel=&quot;nofollow noopener&quot;&gt;https://legacy.reactjs.org/docs/state-and-lifecycle.html&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;


&lt;p&gt;5. RegiterEvents with&#160;&lt;b&gt;&lt;em&gt;PageEditorBridge&lt;/em&gt;&lt;/b&gt;&#160;(interactivity component, just use hook, no render needed)&lt;/p&gt;
&lt;ul class=&quot;alternate&quot; type=&quot;square&quot;&gt;
	&lt;li&gt;Use function components:&#160;&lt;a href=&quot;https://nextjs.org/docs/messages/class-component-in-server-component&quot; class=&quot;external-link&quot; target=&quot;_blank&quot; rel=&quot;nofollow noopener&quot;&gt;https://nextjs.org/docs/messages/class-component-in-server-component&lt;/a&gt;&lt;/li&gt;
	&lt;li&gt;Moving componentDidMount from EditablePage to this component and use react hook. Consider draft ex:&#160;&lt;a href=&quot;https://git.magnolia-cms.com/projects/MODULES/repos/frontend-helpers/pull-requests/220/diff#samples/next-js-13-with-react-editor-new/packages/react-wrap-client-component-typescript/src/RegisterEvents.tsx&quot; class=&quot;external-link&quot; target=&quot;_blank&quot; rel=&quot;nofollow noopener&quot;&gt;https://git.magnolia-cms.com/projects/MODULES/repos/frontend-helpers/pull-requests/220/diff#samples/next-js-13-with-react-editor-new/packages/react-wrap-client-component-typescript/src/RegisterEvents.tsx&lt;/a&gt;&lt;/li&gt;
	&lt;li&gt;Add &apos;use client&apos; in top of file (react will ignore it by default so maybe no harm at all)&lt;br/&gt;
&#160;&lt;/li&gt;
&lt;/ul&gt;


&lt;p&gt;Full notes are here: &lt;a href=&quot;https://wiki.magnolia-cms.com/display/TH2/SPA+Editor+and+Next+13+and+RSC&quot; class=&quot;external-link&quot; target=&quot;_blank&quot; rel=&quot;nofollow noopener&quot;&gt;https://wiki.magnolia-cms.com/display/TH2/SPA+Editor+and+Next+13+and+RSC&lt;/a&gt;&lt;/p&gt;</description>
                <environment></environment>
        <key id="135308">MGNLFE-558</key>
            <summary>React editor has experimental NEXT.js 13 App Router </summary>
                <type id="13" iconUrl="https://jira.magnolia-cms.com/secure/viewavatar?size=xsmall&amp;avatarId=10887&amp;avatarType=issuetype">Epic</type>
                                            <priority id="6" iconUrl="https://jira.magnolia-cms.com/images/icons/priorities/neutral.gif">Neutral</priority>
                        <status id="6" iconUrl="https://jira.magnolia-cms.com/images/icons/statuses/closed.png" description="The issue is considered finished, the resolution is correct. Issues which are not closed can be reopened.">Closed</status>
                    <statusCategory id="3" key="done" colorName="success"/>
                                    <resolution id="1">Fixed</resolution>
                                        <assignee username="czimmermann">Christopher Zimmermann</assignee>
                                    <reporter username="oanh.thai">Oanh Thai Hoang</reporter>
                        <labels>
                    </labels>
                <created>Wed, 5 Jul 2023 09:47:59 +0200</created>
                <updated>Mon, 15 Jan 2024 14:11:10 +0100</updated>
                            <resolved>Mon, 15 Jan 2024 12:23:53 +0100</resolved>
                                                    <fixVersion>1.6</fixVersion>
                                        <due></due>
                            <votes>0</votes>
                                    <watches>4</watches>
                                                                                                                <comments>
                            <comment id="392423" author="czimmermann" created="Mon, 15 Jan 2024 12:23:30 +0100"  >&lt;p&gt;&lt;b&gt;React Server Components (RSC) and NextJS App Router&lt;/b&gt;&lt;br/&gt;
Experimental support for React Server Components and NextJS App Router is available in version &lt;tt&gt;1.6-experimental.6&lt;/tt&gt; of the &lt;tt&gt;react-editor&lt;/tt&gt;.&lt;br/&gt;
To learn more about this feature and to try it in a demo, see &lt;a href=&quot;https://git.magnolia-cms.com/projects/DEMOS/repos/minimal-headless-spa-demos/browse/README-nextjs-app-router.md?at=refs%2Fheads%2Fnextjs-app-router-demo&amp;amp;_gl=1*ef2xck*_ga*MTM5MTk0NTc1Ny4xNjk4MDcwOTIw*_ga_61HQH88LT4*MTcwNTMxNDUyNC4xNzguMS4xNzA1MzE0NTQzLjQxLjAuMA..&quot; class=&quot;external-link&quot; target=&quot;_blank&quot; rel=&quot;nofollow noopener&quot;&gt;&lt;tt&gt;README-nextjs-app-router.md&lt;/tt&gt;&lt;/a&gt; (in the &lt;tt&gt;minimal-headless-spa-demos&lt;/tt&gt; repository).&lt;/p&gt;

&lt;p&gt;(ON the nextjs-aapp-router-demo branch)&lt;/p&gt;</comment>
                    </comments>
                <issuelinks>
                            <issuelinktype id="10040">
                    <name>causality</name>
                                            <outwardlinks description="caused by">
                                        <issuelink>
            <issuekey id="132860">MGNLFE-466</issuekey>
        </issuelink>
                            </outwardlinks>
                                                        </issuelinktype>
                            <issuelinktype id="10010">
                    <name>relation</name>
                                                                <inwardlinks description="is related to">
                                        <issuelink>
            <issuekey id="135662">MGNLFE-578</issuekey>
        </issuelink>
                            </inwardlinks>
                                    </issuelinktype>
                    </issuelinks>
                <attachments>
                    </attachments>
                <subtasks>
                    </subtasks>
                <customfields>
                                                                            <customfield id="customfield_14166" key="com.okapya.jira.checklist:checklist">
                        <customfieldname>Acceptance criteria</customfieldname>
                        <customfieldvalues>
                            
        <checklist>
        <![CDATA[
                            




                
                                    <div class="o-completion" style="display: flex; flex-shrink: 0;"><span  class="aui-lozenge aui-lozenge-complete" style="font-size: 12px; font-weight: normal; display: flex; flex-direction: row; align-items: center;" ><span style="padding-right: 4px; vertical-align: middle;"><svg width="15" height="15" viewBox="0 0 15 15" xmlns="http://www.w3.org/2000/svg" fill="white"><path clip-rule="evenodd" d="m10.41037,3.42544l-7.86501,0c-0.72395,0 -1.31084,0.58688 -1.31084,1.31084l0,7.86508c0,0.7239 0.58689,1.3108 1.31084,1.3108l7.86501,0c0.724,0 1.3109,-0.5869 1.3109,-1.3108l0,-7.86508c0,-0.72396 -0.5869,-1.31084 -1.3109,-1.31084zm-7.86501,-0.65542c-1.08593,0 -1.96626,0.88032 -1.96626,1.96626l0,7.86508c0,1.0859 0.88033,1.9662 1.96626,1.9662l7.86501,0c1.086,0 1.9663,-0.8803 1.9663,-1.9662l0,-7.86508c0,-1.08594 -0.8803,-1.96626 -1.9663,-1.96626l-7.86501,0z" fill-rule="evenodd"/><path d="m5.09049,10.18526l-1.82767,-1.82766l-0.78479,0.78479l2.61246,2.61246l5.38758,-5.38754l-0.78483,-0.78479l-4.60275,4.60274z"/></svg></span><span>Empty</span></span></div>
                        ]]>
    </checklist>


                        </customfieldvalues>
                    </customfield>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    <customfield id="customfield_10111" key="com.atlassian.jira.toolkit:reporterdomain">
                        <customfieldname>Company</customfieldname>
                        <customfieldvalues>
                            <customfieldvalue>magnolia-cms.com</customfieldvalue>
                        </customfieldvalues>
                    </customfield>
                                                                                                                                                                                <customfield id="customfield_10031" key="com.atlassian.jira.ext.charting:firstresponsedate">
                        <customfieldname>Date of First Response</customfieldname>
                        <customfieldvalues>
                            <customfieldvalue>Mon, 15 Jan 2024 12:23:30 +0100</customfieldvalue>

                        </customfieldvalues>
                    </customfield>
                                                                <customfield id="customfield_12730" key="com.atlassian.jira.plugins.jira-development-integration-plugin:devsummary">
                        <customfieldname>Development</customfieldname>
                        <customfieldvalues>
                            
                        </customfieldvalues>
                    </customfield>
                                                                <customfield id="customfield_14151" key="com.atlassian.jira.toolkit:message">
                        <customfieldname>Docu info</customfieldname>
                        <customfieldvalues>
                            
                        </customfieldvalues>
                    </customfield>
                                                                                            <customfield id="customfield_12130" key="com.atlassian.jira.plugin.system.customfieldtypes:multicheckboxes">
                        <customfieldname>Documentation update required</customfieldname>
                        <customfieldvalues>
                                <customfieldvalue key="13300"><![CDATA[Yes]]></customfieldvalue>
    
                        </customfieldvalues>
                    </customfield>
                                                                                                                                                    <customfield id="customfield_10249" key="com.pyxis.greenhopper.jira:gh-epic-color">
                        <customfieldname>Epic Colour</customfieldname>
                        <customfieldvalues>
                            <customfieldvalue>ghx-label-4</customfieldvalue>

                        </customfieldvalues>
                    </customfield>
                                                                                            <customfield id="customfield_10247" key="com.pyxis.greenhopper.jira:gh-epic-label">
                        <customfieldname>Epic Name</customfieldname>
                        <customfieldvalues>
                            <customfieldvalue>React RSC</customfieldvalue>

                        </customfieldvalues>
                    </customfield>
                                                                <customfield id="customfield_10248" key="com.pyxis.greenhopper.jira:gh-epic-status">
                        <customfieldname>Epic Status</customfieldname>
                        <customfieldvalues>
                                <customfieldvalue key="10501"><![CDATA[To Do]]></customfieldvalue>

                        </customfieldvalues>
                    </customfield>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    <customfield id="customfield_10061" key="com.atlassian.jira.toolkit:lastusercommented">
                        <customfieldname>Last comm is not jira-dev</customfieldname>
                        <customfieldvalues>
                            <customfieldvalue>true</customfieldvalue>
                        </customfieldvalues>
                    </customfield>
                                                                <customfield id="customfield_10071" key="com.atlassian.jira.toolkit:lastupdaterorcommenter">
                        <customfieldname>Last participant</customfieldname>
                        <customfieldvalues>
                            <customfieldvalue>czimmermann</customfieldvalue>

                        </customfieldvalues>
                    </customfield>
                                                                <customfield id="customfield_13136" key="com.atlassian.jira.toolkit:LastCommentDate">
                        <customfieldname>Last public comment date</customfieldname>
                        <customfieldvalues>
                            3 weeks, 6 days ago
                        </customfieldvalues>
                    </customfield>
                                                                                                                                                                                                            <customfield id="customfield_10020" key="com.atlassian.jira.toolkit:attachments">
                        <customfieldname>Number of attachments</customfieldname>
                        <customfieldvalues>
                            <customfieldvalue>0.0</customfieldvalue>
                        </customfieldvalues>
                    </customfield>
                                                                <customfield id="customfield_10150" key="com.atlassian.jira.toolkit:comments">
                        <customfieldname>Number of comments</customfieldname>
                        <customfieldvalues>
                            <customfieldvalue>1.0</customfieldvalue>
                        </customfieldvalues>
                    </customfield>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        <customfield id="customfield_10011" key="com.atlassian.jira.toolkit:participants">
                        <customfieldname>Participants</customfieldname>
                        <customfieldvalues>
                                        <customfieldvalue>czimmermann</customfieldvalue>
            <customfieldvalue>oanh.thai</customfieldvalue>
    
                        </customfieldvalues>
                    </customfield>
                                                                                                                                                                                                                                                                                                <customfield id="customfield_10833" key="com.pyxis.greenhopper.jira:gh-lexo-rank">
                        <customfieldname>Rank</customfieldname>
                        <customfieldvalues>
                            <customfieldvalue>0|y0abma:</customfieldvalue>

                        </customfieldvalues>
                    </customfield>
                                                                <customfield id="customfield_10244" key="com.pyxis.greenhopper.jira:gh-global-rank">
                        <customfieldname>Rank (Obsolete)</customfieldname>
                        <customfieldvalues>
                            <customfieldvalue>9223372036854775807</customfieldvalue>
                        </customfieldvalues>
                    </customfield>
                                                                                                                        <customfield id="customfield_10220" key="com.atlassian.jira.plugin.system.customfieldtypes:multicheckboxes">
                        <customfieldname>Release notes required</customfieldname>
                        <customfieldvalues>
                                <customfieldvalue key="10490"><![CDATA[Yes]]></customfieldvalue>
    
                        </customfieldvalues>
                    </customfield>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        <customfield id="customfield_12430" key="com.atlassian.teams:rm-teams-custom-field-team">
                        <customfieldname>Team</customfieldname>
                        <customfieldvalues>
                            <customfieldvalue><![CDATA[26]]></customfieldvalue>

                        </customfieldvalues>
                    </customfield>
                                                                                            <customfield id="customfield_14145" key="com.intenso.jira.issue-templates:issue-templates-customfield">
                        <customfieldname>Template</customfieldname>
                        <customfieldvalues>
                            


                        </customfieldvalues>
                    </customfield>
                                                                                                                                                                                                            <customfield id="customfield_15131" key="com.onresolve.jira.groovy.groovyrunner:scripted-field">
                        <customfieldname>Time in Discovery</customfieldname>
                        <customfieldvalues>
                            <customfieldvalue>0</customfieldvalue>

                        </customfieldvalues>
                    </customfield>
                                                                <customfield id="customfield_10032" key="com.atlassian.jira.ext.charting:timeinstatus">
                        <customfieldname>Time in Status</customfieldname>
                        <customfieldvalues>
                            
                        </customfieldvalues>
                    </customfield>
                                                                                                                                                                                                            <customfield id="customfield_13933" key="com.atlassian.jira.plugin.system.customfieldtypes:select">
                        <customfieldname>Urgency (resolution)</customfieldname>
                        <customfieldvalues>
                                <customfieldvalue key="15724"><![CDATA[Normal]]></customfieldvalue>

                        </customfieldvalues>
                    </customfield>
                                                                                                                                                                                <customfield id="customfield_14630" key="com.atlassian.jira.plugin.system.customfieldtypes:datetime">
                        <customfieldname>Work Started</customfieldname>
                        <customfieldvalues>
                            <customfieldvalue>Thu, 13 Jul 2023 22:31:06 +0200</customfieldvalue>
                        </customfieldvalues>
                    </customfield>
                                                                                                                                                                                                                                                                    </customfields>
    </item>
</channel>
</rss>