[Next.js] FEAAS / BYOC Components are not visible on the page with ru…

…nning A/B test (#1914)

CHANGELOG.md

@@ -57,6 +57,10 @@ Our versioning strategy is as follows:
 
 ### 🐛 Bug Fixes
 
+* `[templates/nextjs]` `[XM Cloud]` FEAAS / BYOC Components are not visible on the page with running A/B test ([#1914](https://github.com/Sitecore/jss/pull/1914))
+  * Make sure to update the _PagePropsFactory_ plugins *order*, these plugins should be executed after the _page-props-factory\plugins\personalize.ts_ plugin to ensure that personalized layout data is used:
+    - _page-props-factory/plugins/component-themes.ts_
+    - _page-props-factory/plugins/component-props.ts_
 * `[sitecore-jss-nextjs]` Resolved an issue with redirects that was caused by the x-middleware-next header in Next.js. This header prevented the flow from being interrupted properly, resulting in redirects not functioning correctly in certain cases. ([#1899](https://github.com/Sitecore/jss/pull/1899))
 
 ## 22.1.1

packages/create-sitecore-jss/src/templates/nextjs-xmcloud/src/lib/page-props-factory/plugins/component-themes.ts

@@ -4,7 +4,8 @@ import { Plugin } from '..';
 import config from 'temp/config';
 
 class ComponentThemesPlugin implements Plugin {
-  order = 2;
+  // Make sure to run this plugin after the personalization plugin, since it relies on the layout data
+  order = 10;
 
   async exec(props: SitecorePageProps) {
     // Collect FEAAS, BYOC, SXA component themes

packages/create-sitecore-jss/src/templates/nextjs/src/lib/page-props-factory/plugins/component-props.ts

@@ -7,7 +7,8 @@ import { Plugin, isServerSidePropsContext } from '..';
 class ComponentPropsPlugin implements Plugin {
   private componentPropsService: ComponentPropsService;
 
-  order = 2;
+  // Make sure to run this plugin last to ensure that the updated layout data is used
+  order = 10;
 
   constructor() {
     this.componentPropsService = new ComponentPropsService();