chore: merge in main

packages/core/src/communication/sendMessage.ts

@@ -6,7 +6,7 @@ export const sendMessage = (eventType: OutgoingEvent | PostMessageMethods, data?
     return;
   }
 
-  console.debug('data sent', {
+  console.debug(`[exp-builder.sdk::sendMessage] Sending message [${eventType}]`, {
     source: 'customer-app',
     eventType,
     payload: data,

packages/core/src/registries/designTokenRegistry.ts

@@ -28,6 +28,7 @@ export const getDesignTokenRegistration = (breakpointValue: string) => {
     resolvedValue += `${tokenValue} `;
   });
 
+  // Not trimming would end up with a trailing space that breaks the check in `calculateNodeDefaultHeight`
   return resolvedValue.trim();
 };
 

packages/experience-builder-sdk/CHANGELOG.md

@@ -3,6 +3,46 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.5.0](https://github.com/contentful/experience-builder/compare/@contentful/[email protected]...@contentful/[email protected]) (2023-12-20)
+
+### Features
+
+- increase the timeout for editor entity store to avoid data loss ([#212](https://github.com/contentful/experience-builder/issues/212)) ([844a1ad](https://github.com/contentful/experience-builder/commit/844a1adf9c0ed33d91c76bd3c9a01680adea906b))
+
+## [3.4.4](https://github.com/contentful/experience-builder/compare/@contentful/[email protected]...@contentful/[email protected]) (2023-12-20)
+
+**Note:** Version bump only for package @contentful/experience-builder
+
+## [3.4.3](https://github.com/contentful/experience-builder/compare/@contentful/[email protected]...@contentful/[email protected]) (2023-12-20)
+
+### Bug Fixes
+
+- switching locale makes design components disappear [SPA-1711] ([#209](https://github.com/contentful/experience-builder/issues/209)) ([84ca724](https://github.com/contentful/experience-builder/commit/84ca7248cbfcbd835a58c979d26ec9d375a02931))
+
+## [3.4.2](https://github.com/contentful/experience-builder/compare/@contentful/[email protected]...@contentful/[email protected]) (2023-12-20)
+
+### Bug Fixes
+
+- design token logic breaks auto height for empty containers ([#210](https://github.com/contentful/experience-builder/issues/210)) ([901bf67](https://github.com/contentful/experience-builder/commit/901bf67c6f7e3fb1a6b968b7fbb26b27d302f13b))
+
+## [3.4.1](https://github.com/contentful/experience-builder/compare/@contentful/[email protected]...@contentful/[email protected]) (2023-12-20)
+
+### Bug Fixes
+
+- dont initialise entity store on every render by using state [SPA-1711] ([#208](https://github.com/contentful/experience-builder/issues/208)) ([b04f44b](https://github.com/contentful/experience-builder/commit/b04f44bae930df18ee53c74754f40ddb2bca2fbe))
+
+# [3.4.0](https://github.com/contentful/experience-builder/compare/@contentful/[email protected]...@contentful/[email protected]) (2023-12-20)
+
+### Features
+
+- improve logs for example using a consistent prefix ([#207](https://github.com/contentful/experience-builder/issues/207)) ([96c306d](https://github.com/contentful/experience-builder/commit/96c306d23ac546c6b7bf6f425b434a9517f99b6f))
+
+## [3.3.1](https://github.com/contentful/experience-builder/compare/@contentful/[email protected]...@contentful/[email protected]) (2023-12-19)
+
+### Bug Fixes
+
+- resolve breakpoint values correctly so that the ui doesn't crash ([91cc76a](https://github.com/contentful/experience-builder/commit/91cc76a65e45e621f90665118410d7089e6f5a94))
+
 # [3.3.0](https://github.com/contentful/experience-builder/compare/@contentful/[email protected]...@contentful/[email protected]) (2023-12-18)
 
 ### Features

packages/experience-builder-sdk/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@contentful/experience-builder",
-  "version": "3.3.0",
+  "version": "3.5.0",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
   "typings": "./dist/src/index.d.ts",

packages/experience-builder-sdk/src/ExperienceRoot.tsx

@@ -76,10 +76,12 @@ export const ExperienceRoot = ({
   });
 
   if (mode === 'editor') {
+    const entityStore =
+      experience && !isDeprecatedExperience(experience) ? experience.entityStore : undefined;
     return (
       <VisualEditorRoot
         visualEditorMode={visualEditorMode}
-        initialEntities={(experience as Experience)?.entityStore?.entities || []}
+        initialEntities={entityStore?.entities || []}
         initialLocale={locale}
       />
     );

packages/experience-builder-sdk/src/communication/MouseOverHandler.ts

@@ -1,7 +1,9 @@
 import type { HoveredElement } from '@contentful/experience-builder-core/types';
 import { sendMessage } from '@contentful/experience-builder-core';
-import { OUTGOING_EVENTS } from '@contentful/experience-builder-core/constants';
-import { DESIGN_COMPONENT_NODE_TYPE } from '..';
+import {
+  OUTGOING_EVENTS,
+  DESIGN_COMPONENT_NODE_TYPE,
+} from '@contentful/experience-builder-core/constants';
 
 export class MouseOverHandler {
   private currentHoveredElementId: string | null = null;

packages/experience-builder-sdk/src/utils/isLinkToAsset.spec.ts

@@ -0,0 +1,49 @@
+import { isLinkToAsset } from './isLinkToAsset';
+
+describe('isLinkToAsset', () => {
+  it('should return false for undefined', () => {
+    expect(isLinkToAsset(undefined)).toBe(false);
+  });
+
+  it('should return false for null', () => {
+    expect(isLinkToAsset(null)).toBe(false);
+  });
+
+  it('should return false for non-object types', () => {
+    expect(isLinkToAsset('string')).toBe(false);
+    expect(isLinkToAsset(123)).toBe(false);
+    expect(isLinkToAsset(true)).toBe(false);
+  });
+
+  it('should return false for objects without sys property', () => {
+    expect(isLinkToAsset({})).toBe(false);
+  });
+
+  it('should return false for objects with sys but without linkType', () => {
+    expect(isLinkToAsset({ sys: {} })).toBe(false);
+  });
+
+  it('should return false for objects with sys.linkType not equal to "Asset"', () => {
+    expect(isLinkToAsset({ sys: { linkType: 'Entry' } })).toBe(false);
+  });
+
+  it('should return false for objects with sys.type not equal to "Link"', () => {
+    expect(isLinkToAsset({ sys: { linkType: 'Asset', type: 'NotLink' } })).toBe(false);
+  });
+
+  it('should return false for objects with sys.id not a string or empty', () => {
+    expect(isLinkToAsset({ sys: { linkType: 'Asset', type: 'Link', id: 123 } })).toBe(false);
+    expect(isLinkToAsset({ sys: { linkType: 'Asset', type: 'Link', id: '' } })).toBe(false);
+  });
+
+  it('should return true for valid Asset link object', () => {
+    const validAssetLink = {
+      sys: {
+        linkType: 'Asset',
+        type: 'Link',
+        id: 'validAssetId',
+      },
+    };
+    expect(isLinkToAsset(validAssetLink)).toBe(true);
+  });
+});

packages/experience-builder-sdk/src/utils/isLinkToAsset.ts

@@ -0,0 +1,13 @@
+import { Link } from '@contentful/experience-builder-types';
+
+export const isLinkToAsset = (variable: any): variable is Link<'Asset'> => {
+  if (!variable) return false;
+  if (typeof variable !== 'object') return false;
+
+  return (
+    variable.sys?.linkType === 'Asset' &&
+    typeof variable.sys?.id === 'string' &&
+    !!variable.sys?.id &&
+    variable.sys?.type === 'Link'
+  );
+};

packages/visual-editor/src/hooks/useEditorSubscriber.ts

@@ -75,6 +75,10 @@ export function useEditorSubscriber() {
       // Await until the fetching is done to update the state variable at the right moment
       await fetchingResponse;
       setEntitiesFetched(true);
+      console.debug('[exp-builder.sdk] Finish fetching entities', {
+        entityStore,
+        entityLinks,
+      });
     };
 
     resolveEntities();
@@ -218,7 +222,9 @@ export function useEditorSubscriber() {
         }
         case INCOMING_EVENTS.UpdatedEntity: {
           const { entity } = payload;
-          entity && entityStore.updateEntity(entity);
+          if (entity) {
+            entityStore.updateEntity(entity);
+          }
           break;
         }
         case INCOMING_EVENTS.RequestEditorMode: {

packages/visual-editor/src/store/entityStore.ts

@@ -28,6 +28,9 @@ export const useEntityStore = create<EntityState>((set, get) => ({
     set({ areEntitesResolvedInParent: resolved });
   },
   resetEntityStore(locale, entities = []) {
+    console.debug(
+      `[exp-builder.sdk] Resetting entity store because the locale changed to '${locale}'.`
+    );
     set({ entityStore: new EditorModeEntityStore({ locale, entities }) });
   },
 }));

packages/visual-editor/src/store/registries.ts

@@ -9,6 +9,9 @@ import {
   CONTENTFUL_SECTION_ID,
 } from '@contentful/experience-builder-core/constants';
 
+// Note: During development, the hot reloading might empty this and it
+// stays empty leading to not rendering design components. Ideally, this is
+// integrated into the state machine to keep track of its state.
 export const designComponentsRegistry = new Map<string, Link<'Entry'>>([]);
 export const setDesignComponents = (designComponents: Link<'Entry'>[]) => {
   for (const designComponent of designComponents) {

packages/visual-editor/src/utils/designComponentUtils.ts

@@ -111,7 +111,9 @@ export const resolveDesignComponent = ({
   const designComponent = designComponentsRegistry.get(componentId);
 
   if (!designComponent) {
-    console.warn(`Link to design component with ID '${componentId}' not found`);
+    console.warn(`Link to design component with ID '${componentId}' not found`, {
+      designComponentsRegistry,
+    });
     return node;
   }
 
@@ -120,7 +122,7 @@ export const resolveDesignComponent = ({
   ]) as unknown as Composition;
 
   if (!componentFields) {
-    console.warn(`Entry for design component with ID '${componentId}' not found`);
+    console.warn(`Entry for design component with ID '${componentId}' not found`, { entityStore });
     return node;
   }