diff --git a/packages/core/src/communication/sendMessage.ts b/packages/core/src/communication/sendMessage.ts index 31784e457..284997548 100644 --- a/packages/core/src/communication/sendMessage.ts +++ b/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, diff --git a/packages/core/src/registries/designTokenRegistry.ts b/packages/core/src/registries/designTokenRegistry.ts index cf3906a31..534d6ca0a 100644 --- a/packages/core/src/registries/designTokenRegistry.ts +++ b/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(); }; diff --git a/packages/experience-builder-sdk/CHANGELOG.md b/packages/experience-builder-sdk/CHANGELOG.md index 56e94e06f..b10cfd5c5 100644 --- a/packages/experience-builder-sdk/CHANGELOG.md +++ b/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/experience-builder@3.4.4...@contentful/experience-builder@3.5.0) (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/experience-builder@3.4.3...@contentful/experience-builder@3.4.4) (2023-12-20) + +**Note:** Version bump only for package @contentful/experience-builder + +## [3.4.3](https://github.com/contentful/experience-builder/compare/@contentful/experience-builder@3.4.2...@contentful/experience-builder@3.4.3) (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/experience-builder@3.4.1...@contentful/experience-builder@3.4.2) (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/experience-builder@3.4.0...@contentful/experience-builder@3.4.1) (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/experience-builder@3.3.1...@contentful/experience-builder@3.4.0) (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/experience-builder@3.3.0...@contentful/experience-builder@3.3.1) (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/experience-builder@3.2.0...@contentful/experience-builder@3.3.0) (2023-12-18) ### Features diff --git a/packages/experience-builder-sdk/package.json b/packages/experience-builder-sdk/package.json index b2ab64b30..b00997675 100644 --- a/packages/experience-builder-sdk/package.json +++ b/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", diff --git a/packages/experience-builder-sdk/src/ExperienceRoot.tsx b/packages/experience-builder-sdk/src/ExperienceRoot.tsx index 07d475cd0..8c16e4534 100644 --- a/packages/experience-builder-sdk/src/ExperienceRoot.tsx +++ b/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 ( ); diff --git a/packages/experience-builder-sdk/src/communication/MouseOverHandler.ts b/packages/experience-builder-sdk/src/communication/MouseOverHandler.ts index 0e2cebc7d..1f7af0336 100644 --- a/packages/experience-builder-sdk/src/communication/MouseOverHandler.ts +++ b/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; diff --git a/packages/experience-builder-sdk/src/utils/isLinkToAsset.spec.ts b/packages/experience-builder-sdk/src/utils/isLinkToAsset.spec.ts new file mode 100644 index 000000000..9e7c4a4e0 --- /dev/null +++ b/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); + }); +}); diff --git a/packages/experience-builder-sdk/src/utils/isLinkToAsset.ts b/packages/experience-builder-sdk/src/utils/isLinkToAsset.ts new file mode 100644 index 000000000..9ca2ced3f --- /dev/null +++ b/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' + ); +}; diff --git a/packages/visual-editor/src/hooks/useEditorSubscriber.ts b/packages/visual-editor/src/hooks/useEditorSubscriber.ts index 312fee399..996530cdd 100644 --- a/packages/visual-editor/src/hooks/useEditorSubscriber.ts +++ b/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: { diff --git a/packages/visual-editor/src/store/entityStore.ts b/packages/visual-editor/src/store/entityStore.ts index 39388aab5..575e4cd73 100644 --- a/packages/visual-editor/src/store/entityStore.ts +++ b/packages/visual-editor/src/store/entityStore.ts @@ -28,6 +28,9 @@ export const useEntityStore = create((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 }) }); }, })); diff --git a/packages/visual-editor/src/store/registries.ts b/packages/visual-editor/src/store/registries.ts index aa0725e81..0127fcd62 100644 --- a/packages/visual-editor/src/store/registries.ts +++ b/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>([]); export const setDesignComponents = (designComponents: Link<'Entry'>[]) => { for (const designComponent of designComponents) { diff --git a/packages/visual-editor/src/utils/designComponentUtils.ts b/packages/visual-editor/src/utils/designComponentUtils.ts index 32f59a37b..a8230a937 100644 --- a/packages/visual-editor/src/utils/designComponentUtils.ts +++ b/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; }