@contentful/field-editor-reference 5.13.3 → 5.14.0

package/dist/cjs/common/EntityStore.js

@@ -109,8 +109,14 @@ const isEntityQueryKey = (queryKey)=>{
 async function fetchContentfulEntry(params) {
     const { urn , fetch , options  } = params;
     const resourceId = urn.split(':', 6)[5];
-    const [, spaceId, , entryId] = resourceId.split('/');
-    const environmentId = 'master';
+    const ENTITY_RESOURCE_ID_REGEX = RegExp("^spaces\\/(?<spaceId>[^/]+)(?:\\/environments\\/(?<environmentId>[^/]+))?\\/entries\\/(?<entityId>[^/]+)$");
+    const resourceIdMatch = resourceId.match(ENTITY_RESOURCE_ID_REGEX);
+    if (!resourceIdMatch || !resourceIdMatch?.groups?.spaceId || !resourceIdMatch?.groups?.entityId) {
+        throw new Error('Not a valid crn');
+    }
+    const spaceId = resourceIdMatch.groups.spaceId;
+    const environmentId = resourceIdMatch?.groups?.environmentId || 'master';
+    const entryId = resourceIdMatch.groups.entityId;
     const [space, entry] = await Promise.all([
         fetch([
             'space',

package/dist/cjs/components/SpaceName/SpaceName.js

@@ -60,12 +60,12 @@ function _interop_require_wildcard(obj, nodeInterop) {
 const styles = {
     spaceIcon: (0, _emotion.css)({
         flexShrink: 0,
-        fill: _f36tokens.default.purple600
+        fill: _f36tokens.default.gray600
     }),
     spaceName: (0, _emotion.css)({
-        color: _f36tokens.default.gray700,
+        color: _f36tokens.default.gray600,
         fontSize: _f36tokens.default.fontSizeS,
-        fontWeight: _f36tokens.default.fontWeightDemiBold,
+        fontWeight: _f36tokens.default.fontWeightMedium,
         maxWidth: '80px',
         textOverflow: 'ellipsis',
         overflow: 'hidden',
@@ -73,10 +73,12 @@ const styles = {
     })
 };
 function SpaceName(props) {
+    let content = `Space: ${props.spaceName}`;
+    if (props.environmentName) content += ` (Env.: ${props.environmentName})`;
     return _react.createElement(_f36components.Tooltip, {
         placement: "top",
         as: "div",
-        content: `Space: ${props.spaceName}`
+        content: content
     }, _react.createElement(_f36components.Flex, {
         alignItems: "center",
         gap: "spacingXs",

package/dist/cjs/entries/WrappedEntryCard/WrappedEntryCard.js

@@ -126,7 +126,8 @@ function WrappedEntryCard(props) {
         isSelected: props.isSelected,
         status: status,
         icon: props.spaceName ? _react.createElement(_SpaceName.SpaceName, {
-            spaceName: props.spaceName
+            spaceName: props.spaceName,
+            environmentName: props.entry.sys.environment.sys.id
         }) : _react.createElement(_components.ScheduledIconWithTooltip, {
             getEntityScheduledActions: props.getEntityScheduledActions,
             entityType: "Entry",

package/dist/cjs/resources/Cards/ResourceCard.spec.js

@@ -7,6 +7,7 @@ require("@testing-library/jest-dom");
 const _fieldeditortestutils = require("@contentful/field-editor-test-utils");
 const _react1 = require("@testing-library/react");
 const _published_content_typejson = _interop_require_default(require("../../__fixtures__/content-type/published_content_type.json"));
+const _published_entry_non_masterjson = _interop_require_default(require("../../__fixtures__/entry/published_entry_non_master.json"));
 const _published_entryjson = _interop_require_default(require("../../__fixtures__/entry/published_entry.json"));
 const _indifferent_spacejson = _interop_require_default(require("../../__fixtures__/space/indifferent_space.json"));
 const _EntityStore = require("../../common/EntityStore");
@@ -62,6 +63,8 @@ jest.mock('react-intersection-observer', ()=>({
         useInView: jest.fn().mockReturnValue({})
     }));
 const resolvableEntryUrn = 'crn:contentful:::content:spaces/space-id/entries/linked-entry-urn';
+const resolvableEntryUrnWithExplicitMaster = 'crn:contentful:::content:spaces/space-id/environments/master/entries/linked-entry-urn';
+const resolvableEntryUrnWithAnotherEnvironment = 'crn:contentful:::content:spaces/space-id/environments/my-test-environment/entries/linked-entry-urn';
 const unknownEntryUrn = 'crn:contentful:::content:spaces/space-id/entries/unknown-entry-urn';
 const sdk = {
     locales: {
@@ -72,10 +75,13 @@ const sdk = {
             get: jest.fn().mockReturnValue(_published_content_typejson.default)
         },
         Entry: {
-            get: jest.fn().mockImplementation(({ entryId  })=>{
-                if (entryId === 'linked-entry-urn') {
+            get: jest.fn().mockImplementation(({ spaceId , environmentId , entryId  })=>{
+                if (spaceId === 'space-id' && environmentId === 'master' && entryId === 'linked-entry-urn') {
                     return Promise.resolve(_published_entryjson.default);
                 }
+                if (spaceId === 'space-id' && environmentId === 'my-test-environment' && entryId === 'linked-entry-urn') {
+                    return Promise.resolve(_published_entry_non_masterjson.default);
+                }
                 return Promise.reject(new Error());
             })
         },
@@ -124,11 +130,36 @@ function renderResourceCard({ linkType ='Contentful:Entry' , entryUrn =resolvabl
     })));
 }
 describe('ResourceCard', ()=>{
-    it('renders entry card', async ()=>{
+    it('renders entry card with implicit master crn', async ()=>{
         const { getByTestId , getByText  } = renderResourceCard();
+        const tooltipContent = `Space: ${_indifferent_spacejson.default.name} (Env.: ${_published_entryjson.default.sys.environment.sys.id})`;
         await (0, _react1.waitFor)(()=>expect(getByTestId('cf-ui-entry-card')).toBeDefined());
         expect(getByText(_published_entryjson.default.fields.exField['en-US'])).toBeDefined();
         expect(getByText(_indifferent_spacejson.default.name)).toBeDefined();
+        _react1.fireEvent.mouseEnter(getByText(_indifferent_spacejson.default.name));
+        await (0, _react1.waitFor)(()=>expect(getByText(tooltipContent)).toBeDefined());
+    });
+    it('renders entry card with explicit master crn', async ()=>{
+        const { getByTestId , getByText  } = renderResourceCard({
+            entryUrn: resolvableEntryUrnWithExplicitMaster
+        });
+        const tooltipContent = `Space: ${_indifferent_spacejson.default.name} (Env.: ${_published_entryjson.default.sys.environment.sys.id})`;
+        await (0, _react1.waitFor)(()=>expect(getByTestId('cf-ui-entry-card')).toBeDefined());
+        expect(getByText(_published_entryjson.default.fields.exField['en-US'])).toBeDefined();
+        expect(getByText(_indifferent_spacejson.default.name)).toBeDefined();
+        _react1.fireEvent.mouseEnter(getByText(_indifferent_spacejson.default.name));
+        await (0, _react1.waitFor)(()=>expect(getByText(tooltipContent)).toBeDefined());
+    });
+    it('renders entry card with a non master environment', async ()=>{
+        const { getByTestId , getByText  } = renderResourceCard({
+            entryUrn: resolvableEntryUrnWithAnotherEnvironment
+        });
+        await (0, _react1.waitFor)(()=>expect(getByTestId('cf-ui-entry-card')).toBeDefined());
+        const tooltipContent = `Space: ${_indifferent_spacejson.default.name} (Env.: ${_published_entry_non_masterjson.default.sys.environment.sys.id})`;
+        expect(getByText(_published_entry_non_masterjson.default.fields.exField['en-US'])).toBeDefined();
+        expect(getByText(_indifferent_spacejson.default.name)).toBeDefined();
+        _react1.fireEvent.mouseEnter(getByText(_indifferent_spacejson.default.name));
+        await (0, _react1.waitFor)(()=>expect(getByText(tooltipContent)).toBeDefined());
     });
     it('renders skeleton when no data is provided', ()=>{
         const { getByTestId  } = renderResourceCard();
@@ -146,4 +177,10 @@ describe('ResourceCard', ()=>{
         });
         await (0, _react1.waitFor)(()=>expect(getByTestId('cf-ui-missing-entry-card')).toBeDefined());
     });
+    it('renders missing entity card when crn is invalid', async ()=>{
+        const { getByTestId  } = renderResourceCard({
+            entryUrn: ''
+        });
+        await (0, _react1.waitFor)(()=>expect(getByTestId('cf-ui-missing-entry-card')).toBeDefined());
+    });
 });

package/dist/esm/common/EntityStore.js

@@ -35,8 +35,14 @@ const isEntityQueryKey = (queryKey)=>{
 async function fetchContentfulEntry(params) {
     const { urn , fetch , options  } = params;
     const resourceId = urn.split(':', 6)[5];
-    const [, spaceId, , entryId] = resourceId.split('/');
-    const environmentId = 'master';
+    const ENTITY_RESOURCE_ID_REGEX = RegExp("^spaces\\/(?<spaceId>[^/]+)(?:\\/environments\\/(?<environmentId>[^/]+))?\\/entries\\/(?<entityId>[^/]+)$");
+    const resourceIdMatch = resourceId.match(ENTITY_RESOURCE_ID_REGEX);
+    if (!resourceIdMatch || !resourceIdMatch?.groups?.spaceId || !resourceIdMatch?.groups?.entityId) {
+        throw new Error('Not a valid crn');
+    }
+    const spaceId = resourceIdMatch.groups.spaceId;
+    const environmentId = resourceIdMatch?.groups?.environmentId || 'master';
+    const entryId = resourceIdMatch.groups.entityId;
     const [space, entry] = await Promise.all([
         fetch([
             'space',

package/dist/esm/components/SpaceName/SpaceName.js

@@ -6,12 +6,12 @@ import { css } from 'emotion';
 const styles = {
     spaceIcon: css({
         flexShrink: 0,
-        fill: tokens.purple600
+        fill: tokens.gray600
     }),
     spaceName: css({
-        color: tokens.gray700,
+        color: tokens.gray600,
         fontSize: tokens.fontSizeS,
-        fontWeight: tokens.fontWeightDemiBold,
+        fontWeight: tokens.fontWeightMedium,
         maxWidth: '80px',
         textOverflow: 'ellipsis',
         overflow: 'hidden',
@@ -19,10 +19,12 @@ const styles = {
     })
 };
 export function SpaceName(props) {
+    let content = `Space: ${props.spaceName}`;
+    if (props.environmentName) content += ` (Env.: ${props.environmentName})`;
     return React.createElement(Tooltip, {
         placement: "top",
         as: "div",
-        content: `Space: ${props.spaceName}`
+        content: content
     }, React.createElement(Flex, {
         alignItems: "center",
         gap: "spacingXs",

package/dist/esm/entries/WrappedEntryCard/WrappedEntryCard.js

@@ -72,7 +72,8 @@ export function WrappedEntryCard(props) {
         isSelected: props.isSelected,
         status: status,
         icon: props.spaceName ? React.createElement(SpaceName, {
-            spaceName: props.spaceName
+            spaceName: props.spaceName,
+            environmentName: props.entry.sys.environment.sys.id
         }) : React.createElement(ScheduledIconWithTooltip, {
             getEntityScheduledActions: props.getEntityScheduledActions,
             entityType: "Entry",

package/dist/esm/resources/Cards/ResourceCard.spec.js

@@ -1,8 +1,9 @@
 import * as React from 'react';
 import '@testing-library/jest-dom';
 import { createFakeCMAAdapter } from '@contentful/field-editor-test-utils';
-import { configure, render, waitFor } from '@testing-library/react';
+import { configure, fireEvent, render, waitFor } from '@testing-library/react';
 import publishedCT from '../../__fixtures__/content-type/published_content_type.json';
+import publishedEntryNonMasterEnvironment from '../../__fixtures__/entry/published_entry_non_master.json';
 import publishedEntry from '../../__fixtures__/entry/published_entry.json';
 import space from '../../__fixtures__/space/indifferent_space.json';
 import { EntityProvider } from '../../common/EntityStore';
@@ -14,6 +15,8 @@ jest.mock('react-intersection-observer', ()=>({
         useInView: jest.fn().mockReturnValue({})
     }));
 const resolvableEntryUrn = 'crn:contentful:::content:spaces/space-id/entries/linked-entry-urn';
+const resolvableEntryUrnWithExplicitMaster = 'crn:contentful:::content:spaces/space-id/environments/master/entries/linked-entry-urn';
+const resolvableEntryUrnWithAnotherEnvironment = 'crn:contentful:::content:spaces/space-id/environments/my-test-environment/entries/linked-entry-urn';
 const unknownEntryUrn = 'crn:contentful:::content:spaces/space-id/entries/unknown-entry-urn';
 const sdk = {
     locales: {
@@ -24,10 +27,13 @@ const sdk = {
             get: jest.fn().mockReturnValue(publishedCT)
         },
         Entry: {
-            get: jest.fn().mockImplementation(({ entryId  })=>{
-                if (entryId === 'linked-entry-urn') {
+            get: jest.fn().mockImplementation(({ spaceId , environmentId , entryId  })=>{
+                if (spaceId === 'space-id' && environmentId === 'master' && entryId === 'linked-entry-urn') {
                     return Promise.resolve(publishedEntry);
                 }
+                if (spaceId === 'space-id' && environmentId === 'my-test-environment' && entryId === 'linked-entry-urn') {
+                    return Promise.resolve(publishedEntryNonMasterEnvironment);
+                }
                 return Promise.reject(new Error());
             })
         },
@@ -76,11 +82,36 @@ function renderResourceCard({ linkType ='Contentful:Entry' , entryUrn =resolvabl
     })));
 }
 describe('ResourceCard', ()=>{
-    it('renders entry card', async ()=>{
+    it('renders entry card with implicit master crn', async ()=>{
         const { getByTestId , getByText  } = renderResourceCard();
+        const tooltipContent = `Space: ${space.name} (Env.: ${publishedEntry.sys.environment.sys.id})`;
         await waitFor(()=>expect(getByTestId('cf-ui-entry-card')).toBeDefined());
         expect(getByText(publishedEntry.fields.exField['en-US'])).toBeDefined();
         expect(getByText(space.name)).toBeDefined();
+        fireEvent.mouseEnter(getByText(space.name));
+        await waitFor(()=>expect(getByText(tooltipContent)).toBeDefined());
+    });
+    it('renders entry card with explicit master crn', async ()=>{
+        const { getByTestId , getByText  } = renderResourceCard({
+            entryUrn: resolvableEntryUrnWithExplicitMaster
+        });
+        const tooltipContent = `Space: ${space.name} (Env.: ${publishedEntry.sys.environment.sys.id})`;
+        await waitFor(()=>expect(getByTestId('cf-ui-entry-card')).toBeDefined());
+        expect(getByText(publishedEntry.fields.exField['en-US'])).toBeDefined();
+        expect(getByText(space.name)).toBeDefined();
+        fireEvent.mouseEnter(getByText(space.name));
+        await waitFor(()=>expect(getByText(tooltipContent)).toBeDefined());
+    });
+    it('renders entry card with a non master environment', async ()=>{
+        const { getByTestId , getByText  } = renderResourceCard({
+            entryUrn: resolvableEntryUrnWithAnotherEnvironment
+        });
+        await waitFor(()=>expect(getByTestId('cf-ui-entry-card')).toBeDefined());
+        const tooltipContent = `Space: ${space.name} (Env.: ${publishedEntryNonMasterEnvironment.sys.environment.sys.id})`;
+        expect(getByText(publishedEntryNonMasterEnvironment.fields.exField['en-US'])).toBeDefined();
+        expect(getByText(space.name)).toBeDefined();
+        fireEvent.mouseEnter(getByText(space.name));
+        await waitFor(()=>expect(getByText(tooltipContent)).toBeDefined());
     });
     it('renders skeleton when no data is provided', ()=>{
         const { getByTestId  } = renderResourceCard();
@@ -98,4 +129,10 @@ describe('ResourceCard', ()=>{
         });
         await waitFor(()=>expect(getByTestId('cf-ui-missing-entry-card')).toBeDefined());
     });
+    it('renders missing entity card when crn is invalid', async ()=>{
+        const { getByTestId  } = renderResourceCard({
+            entryUrn: ''
+        });
+        await waitFor(()=>expect(getByTestId('cf-ui-missing-entry-card')).toBeDefined());
+    });
 });

package/dist/types/components/SpaceName/SpaceName.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
-interface SpaceNameProps {
+interface SourceProps {
     spaceName: string;
+    environmentName?: string;
 }
-export declare function SpaceName(props: SpaceNameProps): React.JSX.Element;
+export declare function SpaceName(props: SourceProps): React.JSX.Element;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@contentful/field-editor-reference",
-  "version": "5.13.3",
+  "version": "5.14.0",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
@@ -63,5 +63,5 @@
     "@contentful/app-sdk": "^4.2.0",
     "react": ">=16.8.0"
   },
-  "gitHead": "68039530d579ba49330f49e4c6be37823a774a29"
+  "gitHead": "538cc684c7cea792773969ab12cff42301c4ab9e"
 }