Upgrade BP to 4.2.x (#7)

* Upgrade BP to 4.2.x * Validate image src in Hero background render, add title as required in Hero component * Update crafterCmsVersions --------- Co-authored-by: jvega190 <[email protected]>
craftercms · Dec 17, 2024 · dbbd55b · dbbd55b
1 parent 1490046
commit dbbd55b
Show file tree

Hide file tree

Showing 10 changed files with 2,263 additions and 1,417 deletions.
diff --git a/app/.env.local.example b/app/.env.local.example
@@ -1,2 +1,3 @@
 NEXT_PUBLIC_CRAFTERCMS_HOST_NAME=http://localhost:8080
 NEXT_PUBLIC_CRAFTERCMS_SITE_NAME=nextjs
+NEXT_PUBLIC_PREVIEW_TOKEN=""
diff --git a/app/components/Hero.js b/app/components/Hero.js
@@ -44,7 +44,7 @@ export default function Hero(props) {
           model={model}
           component={ImageWithRef}
           fieldId="background_s"
-          render={(img) => `${process.env.NEXT_PUBLIC_CRAFTERCMS_HOST_NAME}${img}`}
+          render={(img) => img ? `${process.env.NEXT_PUBLIC_CRAFTERCMS_HOST_NAME}${img}` : ''}
         />
         <RenderField
           model={model}

diff --git a/app/package.json b/app/package.json
@@ -6,13 +6,14 @@
     "build": "next build",
     "start": "next start",
     "lint": "next lint",
-    "format": "prettier --write ."
+    "format": "prettier --write .",
+    "postinstall": "patch-package"
   },
   "dependencies": {
-    "@craftercms/classes": "4.1.2-support.2",
-    "@craftercms/content": "4.1.2-support.2",
-    "@craftercms/experience-builder": "4.1.2-support.3",
-    "@craftercms/models": "4.1.2-support.2",
+    "@craftercms/classes": "4.2.0",
+    "@craftercms/content": "4.2.0",
+    "@craftercms/experience-builder": "^4.2.0",
+    "@craftercms/models": "4.2.0",
     "@emotion/cache": "^11.10.5",
     "@emotion/css": "^11.10.6",
     "@emotion/react": "^11.10.6",
@@ -23,8 +24,7 @@
     "@mui/material": "^5.14.16",
     "axios": "^1.3.4",
     "js-cookie": "^3.0.5",
-    "next": "14.0.4",
-    "next-auth": "^4.24.4",
+    "next": "14.2.20",
     "prop-types": "^15.8.1",
     "react": "18.2.0",
     "react-dom": "18.2.0",
@@ -38,6 +38,7 @@
   "devDependencies": {
     "eslint": "8.6.0",
     "eslint-config-next": "12.0.7",
+    "patch-package": "^8.0.0",
     "prettier": "^2.8.8"
   },
   "packageManager": "[email protected]"

diff --git a/app/pages/_app.js b/app/pages/_app.js
@@ -21,10 +21,19 @@ if (typeof siteName === 'undefined') {
   throw new Error('The site name value of is blank. Set `NEXT_PUBLIC_CRAFTERCMS_SITE_NAME=YOUR_SITE_NAME` in your .env file.');
 }
 
+if (process.env.NODE_ENV === 'development' && !process.env.NEXT_PUBLIC_PREVIEW_TOKEN) {
+  console.error('The `NEXT_PUBLIC_PREVIEW_TOKEN` environment variable is not set. A preview token is required for previewing content in authoring');
+}
+
 crafterConf.configure({
   baseUrl: process.env.NEXT_PUBLIC_CRAFTERCMS_HOST_NAME ?? '',
   site: siteName,
-  cors: true,
+  fetchConfig: {
+    mode: 'cors',
+    headers: {
+      'X-Crafter-Preview': process.env.NEXT_PUBLIC_PREVIEW_TOKEN ?? ''
+    }
+  }
 });
 
 export const contentTypeMap = {

diff --git a/app/patches/@craftercms+experience-builder+4.2.0.patch b/app/patches/@craftercms+experience-builder+4.2.0.patch
@@ -0,0 +1,21 @@
+diff --git a/node_modules/@craftercms/experience-builder/react/GuestProxy.js b/node_modules/@craftercms/experience-builder/react/GuestProxy.js
+index a789064..07e3ff5 100644
+--- a/node_modules/@craftercms/experience-builder/react/GuestProxy.js
++++ b/node_modules/@craftercms/experience-builder/react/GuestProxy.js
+@@ -19,7 +19,6 @@ import { useGuestContext, useSelector } from './GuestContext';
+ import * as ElementRegistry from '../elementRegistry';
+ import { getParentElementFromICEProps } from '../elementRegistry';
+ import * as iceRegistry from '../iceRegistry';
+-import $ from '../jquery';
+ import { contentTypes$, getCachedContentType, getCachedModel, getModelIdFromInheritedField, models$, operations$, paths$ } from '../contentController';
+ import { zip } from 'rxjs';
+ import { filter, take } from 'rxjs/operators';
+@@ -31,6 +30,8 @@ import { forEach } from '@craftercms/studio-ui/utils/array';
+ import { isSimple, popPiece, removeLastPiece } from '@craftercms/studio-ui/utils/string';
+ import { addAnimation } from '../utils/dom';
+ import { emptyCollectionClass } from '../constants';
++import dynamic from 'next/dynamic';
++const $ = dynamic(() => import('../jquery'), { ssr: false });
+ export function GuestProxy() {
+     const draggable = useSelector((state) => state.draggable);
+     const { onEvent } = useGuestContext();