@contentful/field-editor-reference 5.21.4 → 5.21.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/__fixtures__/FakeSdk.js +3 -3
- package/dist/cjs/__fixtures__/asset/index.js +5 -5
- package/dist/cjs/__fixtures__/entry/index.js +3 -3
- package/dist/cjs/__fixtures__/fixtures.js +3 -1
- package/dist/cjs/assets/MultipleMediaEditor.js +4 -2
- package/dist/cjs/assets/SingleMediaEditor.js +4 -2
- package/dist/cjs/assets/WrappedAssetCard/AssetCardActions.js +8 -6
- package/dist/cjs/assets/WrappedAssetCard/FetchingWrappedAssetCard.js +8 -6
- package/dist/cjs/assets/WrappedAssetCard/WrappedAssetCard.js +4 -2
- package/dist/cjs/assets/WrappedAssetCard/WrappedAssetLink.js +4 -2
- package/dist/cjs/assets/index.js +3 -3
- package/dist/cjs/common/EntityStore.js +29 -27
- package/dist/cjs/common/MultipleReferenceEditor.js +7 -5
- package/dist/cjs/common/ReferenceEditor.js +3 -1
- package/dist/cjs/common/SingleReferenceEditor.js +5 -3
- package/dist/cjs/common/SortableLinkList.js +5 -5
- package/dist/cjs/common/customCardTypes.js +3 -1
- package/dist/cjs/common/queryClient.js +8 -6
- package/dist/cjs/common/useContentTypePermissions.js +1 -1
- package/dist/cjs/common/useEditorPermissions.js +3 -3
- package/dist/cjs/common/useEditorPermissions.spec.js +11 -11
- package/dist/cjs/components/AssetThumbnail/AssetThumbnail.js +3 -1
- package/dist/cjs/components/CreateEntryLinkButton/CreateEntryLinkButton.js +5 -3
- package/dist/cjs/components/CreateEntryLinkButton/CreateEntryLinkButton.spec.js +15 -13
- package/dist/cjs/components/CreateEntryLinkButton/CreateEntryMenuTrigger.js +5 -3
- package/dist/cjs/components/CreateEntryLinkButton/CreateEntryMenuTrigger.spec.js +8 -6
- package/dist/cjs/components/LinkActions/CombinedLinkActions.js +3 -1
- package/dist/cjs/components/LinkActions/LinkActions.js +6 -4
- package/dist/cjs/components/LinkActions/LinkEntityActions.js +11 -9
- package/dist/cjs/components/LinkActions/NoLinkPermissionsInfo.js +3 -1
- package/dist/cjs/components/LinkActions/helpers.js +5 -5
- package/dist/cjs/components/LinkActions/redesignStyles.js +3 -3
- package/dist/cjs/components/MissingEntityCard/MissingEntityCard.js +3 -1
- package/dist/cjs/components/ResourceEntityErrorCard/ResourceEntityErrorCard.js +3 -1
- package/dist/cjs/components/ResourceEntityErrorCard/UnsupportedEntityCard.js +3 -1
- package/dist/cjs/components/ScheduledIconWithTooltip/ScheduleTooltip.js +8 -6
- package/dist/cjs/components/ScheduledIconWithTooltip/ScheduledIconWithTooltip.js +4 -2
- package/dist/cjs/components/ScheduledIconWithTooltip/formatDateAndTime.js +3 -3
- package/dist/cjs/components/SpaceName/SpaceName.js +3 -1
- package/dist/cjs/components/index.js +12 -12
- package/dist/cjs/entries/MultipleEntryReferenceEditor.js +5 -3
- package/dist/cjs/entries/SingleEntryReferenceEditor.js +4 -2
- package/dist/cjs/entries/WrappedEntryCard/FetchingWrappedEntryCard.js +8 -6
- package/dist/cjs/entries/WrappedEntryCard/WrappedEntryCard.js +5 -3
- package/dist/cjs/entries/index.js +3 -3
- package/dist/cjs/index.js +37 -37
- package/dist/cjs/resources/Cards/ContentfulEntryCard.js +4 -2
- package/dist/cjs/resources/Cards/ResourceCard.js +6 -4
- package/dist/cjs/resources/Cards/ResourceCard.spec.js +12 -10
- package/dist/cjs/resources/MultipleResourceReferenceEditor.js +10 -8
- package/dist/cjs/resources/MultipleResourceReferenceEditor.spec.js +7 -5
- package/dist/cjs/resources/SingleResourceReferenceEditor.js +5 -3
- package/dist/cjs/resources/SingleResourceReferenceEditor.spec.js +3 -1
- package/dist/cjs/resources/testHelpers/resourceEditorHelpers.js +5 -5
- package/dist/cjs/resources/useResourceLinkActions.js +1 -1
- package/dist/cjs/types.js +3 -3
- package/dist/cjs/utils/useSortIDs.js +5 -3
- package/dist/esm/__fixtures__/FakeSdk.js +3 -3
- package/dist/esm/assets/MultipleMediaEditor.js +1 -1
- package/dist/esm/assets/SingleMediaEditor.js +1 -1
- package/dist/esm/assets/WrappedAssetCard/AssetCardActions.js +2 -2
- package/dist/esm/assets/WrappedAssetCard/FetchingWrappedAssetCard.js +5 -5
- package/dist/esm/assets/WrappedAssetCard/WrappedAssetCard.js +1 -1
- package/dist/esm/assets/WrappedAssetCard/WrappedAssetLink.js +1 -1
- package/dist/esm/common/EntityStore.js +20 -20
- package/dist/esm/common/MultipleReferenceEditor.js +4 -4
- package/dist/esm/common/SingleReferenceEditor.js +2 -2
- package/dist/esm/common/SortableLinkList.js +5 -5
- package/dist/esm/common/queryClient.js +1 -1
- package/dist/esm/common/useContentTypePermissions.js +1 -1
- package/dist/esm/common/useEditorPermissions.js +3 -3
- package/dist/esm/common/useEditorPermissions.spec.js +11 -11
- package/dist/esm/components/CreateEntryLinkButton/CreateEntryLinkButton.js +2 -2
- package/dist/esm/components/CreateEntryLinkButton/CreateEntryLinkButton.spec.js +12 -12
- package/dist/esm/components/CreateEntryLinkButton/CreateEntryMenuTrigger.js +2 -2
- package/dist/esm/components/CreateEntryLinkButton/CreateEntryMenuTrigger.spec.js +5 -5
- package/dist/esm/components/LinkActions/LinkEntityActions.js +4 -4
- package/dist/esm/components/LinkActions/helpers.js +2 -2
- package/dist/esm/components/ScheduledIconWithTooltip/ScheduleTooltip.js +2 -2
- package/dist/esm/components/ScheduledIconWithTooltip/ScheduledIconWithTooltip.js +1 -1
- package/dist/esm/entries/MultipleEntryReferenceEditor.js +2 -2
- package/dist/esm/entries/SingleEntryReferenceEditor.js +1 -1
- package/dist/esm/entries/WrappedEntryCard/FetchingWrappedEntryCard.js +5 -5
- package/dist/esm/entries/WrappedEntryCard/WrappedEntryCard.js +2 -2
- package/dist/esm/resources/Cards/ContentfulEntryCard.js +1 -1
- package/dist/esm/resources/Cards/ResourceCard.js +3 -3
- package/dist/esm/resources/Cards/ResourceCard.spec.js +9 -9
- package/dist/esm/resources/MultipleResourceReferenceEditor.js +7 -7
- package/dist/esm/resources/MultipleResourceReferenceEditor.spec.js +4 -4
- package/dist/esm/resources/SingleResourceReferenceEditor.js +2 -2
- package/dist/esm/resources/testHelpers/resourceEditorHelpers.js +2 -2
- package/dist/esm/resources/useResourceLinkActions.js +1 -1
- package/dist/esm/utils/useSortIDs.js +2 -2
- package/package.json +5 -5
|
@@ -36,9 +36,9 @@ const styles = {
|
|
|
36
36
|
borderColor: tokens.gray200
|
|
37
37
|
})
|
|
38
38
|
};
|
|
39
|
-
export const CreateEntryMenuTrigger = ({ contentTypes
|
|
39
|
+
export const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, contentTypesLabel, onSelect, testId, dropdownSettings = {
|
|
40
40
|
position: 'bottom-left'
|
|
41
|
-
}
|
|
41
|
+
}, customDropdownItems, children, menuProps })=>{
|
|
42
42
|
const [isOpen, setOpen] = useState(false);
|
|
43
43
|
const [isSelecting, setSelecting] = useState(false);
|
|
44
44
|
const [searchInput, setSearchInput] = useState('');
|
|
@@ -53,7 +53,7 @@ describe('CreateEntryMenuTrigger general', ()=>{
|
|
|
53
53
|
});
|
|
54
54
|
it('should set isSelecting to true in case onSelect returns a promise', async ()=>{
|
|
55
55
|
const selectStub = jest.fn(()=>new Promise((resolve)=>setTimeout(resolve, 1000)));
|
|
56
|
-
const { getAllByTestId
|
|
56
|
+
const { getAllByTestId, getByTestId } = render(React.createElement(CreateEntryMenuTrigger, {
|
|
57
57
|
...props,
|
|
58
58
|
onSelect: selectStub
|
|
59
59
|
}, stub));
|
|
@@ -67,7 +67,7 @@ describe('CreateEntryMenuTrigger general', ()=>{
|
|
|
67
67
|
});
|
|
68
68
|
it('should not set isSelecting to true in case onSelect is sync', async ()=>{
|
|
69
69
|
const selectStub = jest.fn();
|
|
70
|
-
const { getAllByTestId
|
|
70
|
+
const { getAllByTestId, getByTestId } = render(React.createElement(CreateEntryMenuTrigger, {
|
|
71
71
|
...props,
|
|
72
72
|
onSelect: selectStub
|
|
73
73
|
}, stub));
|
|
@@ -84,7 +84,7 @@ describe('CreateEntryMenuTrigger general', ()=>{
|
|
|
84
84
|
expect(selectStub).toHaveBeenCalled();
|
|
85
85
|
});
|
|
86
86
|
it('renders text input if contentTypes.length > 20', ()=>{
|
|
87
|
-
const { getByTestId
|
|
87
|
+
const { getByTestId } = render(React.createElement(CreateEntryMenuTrigger, {
|
|
88
88
|
...props,
|
|
89
89
|
contentTypes: fill(Array(21), CONTENT_TYPE_3)
|
|
90
90
|
}, stub));
|
|
@@ -95,7 +95,7 @@ describe('CreateEntryMenuTrigger general', ()=>{
|
|
|
95
95
|
});
|
|
96
96
|
it('shows the search results if typed in input', ()=>{
|
|
97
97
|
const contentTypes = fill(fill(fill(Array(21), CONTENT_TYPE_1, 0, 10), CONTENT_TYPE_2, 10, 20), CONTENT_TYPE_3, 20);
|
|
98
|
-
const { getByTestId
|
|
98
|
+
const { getByTestId, getAllByTestId } = render(React.createElement(CreateEntryMenuTrigger, {
|
|
99
99
|
...props,
|
|
100
100
|
contentTypes: contentTypes
|
|
101
101
|
}, stub));
|
|
@@ -128,7 +128,7 @@ describe('CreateEntryMenuTrigger general', ()=>{
|
|
|
128
128
|
expect(getByTestId('add-entru-menu-search-results').textContent).toBe('No results found');
|
|
129
129
|
});
|
|
130
130
|
it('shows suggestedContentType in the list', ()=>{
|
|
131
|
-
const { getByTestId
|
|
131
|
+
const { getByTestId } = render(React.createElement(CreateEntryMenuTrigger, {
|
|
132
132
|
...props,
|
|
133
133
|
suggestedContentTypeId: props.contentTypes[0].sys.id
|
|
134
134
|
}, stub));
|
|
@@ -4,7 +4,7 @@ import { CombinedLinkActions } from './CombinedLinkActions';
|
|
|
4
4
|
import { createEntity, selectMultipleEntities, selectSingleEntity } from './helpers';
|
|
5
5
|
import { LinkActions } from './LinkActions';
|
|
6
6
|
export function useLinkActionsProps(props) {
|
|
7
|
-
const { sdk
|
|
7
|
+
const { sdk, editorPermissions, entityType, canLinkMultiple, isDisabled, actionLabels, itemsLength } = props;
|
|
8
8
|
const maxLinksCount = editorPermissions.validations.numberOfLinks?.max;
|
|
9
9
|
const value = sdk.field.getValue();
|
|
10
10
|
const linkCount = Array.isArray(value) ? value.length : value ? 1 : 0;
|
|
@@ -40,7 +40,7 @@ export function useLinkActionsProps(props) {
|
|
|
40
40
|
props.onAction
|
|
41
41
|
]);
|
|
42
42
|
const onCreate = React.useCallback(async (contentTypeId, index)=>{
|
|
43
|
-
const { entity
|
|
43
|
+
const { entity, slide } = await createEntity({
|
|
44
44
|
sdk,
|
|
45
45
|
entityType,
|
|
46
46
|
contentTypeId
|
|
@@ -119,9 +119,9 @@ export function useLinkActionsProps(props) {
|
|
|
119
119
|
itemsLength
|
|
120
120
|
]);
|
|
121
121
|
}
|
|
122
|
-
export function LinkEntityActions({ renderCustomActions
|
|
122
|
+
export function LinkEntityActions({ renderCustomActions, ...props }) {
|
|
123
123
|
return renderCustomActions ? renderCustomActions(props) : React.createElement(LinkActions, props);
|
|
124
124
|
}
|
|
125
|
-
export function CombinedLinkEntityActions({ renderCustomActions
|
|
125
|
+
export function CombinedLinkEntityActions({ renderCustomActions, ...props }) {
|
|
126
126
|
return renderCustomActions ? renderCustomActions(props) : React.createElement(CombinedLinkActions, props);
|
|
127
127
|
}
|
|
@@ -4,7 +4,7 @@ export async function createEntity(props) {
|
|
|
4
4
|
if (!props.contentTypeId) {
|
|
5
5
|
return {};
|
|
6
6
|
}
|
|
7
|
-
const { entity
|
|
7
|
+
const { entity, slide } = await props.sdk.navigator.openNewEntry(props.contentTypeId, {
|
|
8
8
|
slideIn: true
|
|
9
9
|
});
|
|
10
10
|
return {
|
|
@@ -12,7 +12,7 @@ export async function createEntity(props) {
|
|
|
12
12
|
slide
|
|
13
13
|
};
|
|
14
14
|
} else {
|
|
15
|
-
const { entity
|
|
15
|
+
const { entity, slide } = await props.sdk.navigator.openNewAsset({
|
|
16
16
|
slideIn: true
|
|
17
17
|
});
|
|
18
18
|
return {
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { Tooltip } from '@contentful/f36-components';
|
|
3
3
|
import { formatDateAndTime } from './formatDateAndTime';
|
|
4
|
-
export const getScheduleTooltipContent = ({ job
|
|
4
|
+
export const getScheduleTooltipContent = ({ job, jobsCount })=>{
|
|
5
5
|
return `Will ${job.action.toLowerCase()} ${formatDateAndTime(job.scheduledFor.datetime).toLowerCase()}
|
|
6
6
|
${jobsCount > 1 ? `+ ${jobsCount - 1} more` : ''}`;
|
|
7
7
|
};
|
|
8
|
-
export const ScheduleTooltip = ({ job
|
|
8
|
+
export const ScheduleTooltip = ({ job, jobsCount, children })=>{
|
|
9
9
|
return React.createElement(Tooltip, {
|
|
10
10
|
placement: "top",
|
|
11
11
|
testId: job.sys.id,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { ScheduleTooltip } from './ScheduleTooltip';
|
|
3
|
-
export const ScheduledIconWithTooltip = ({ entityType
|
|
3
|
+
export const ScheduledIconWithTooltip = ({ entityType, entityId, getEntityScheduledActions, children })=>{
|
|
4
4
|
const [status, setStatus] = React.useState({
|
|
5
5
|
type: 'loading'
|
|
6
6
|
});
|
|
@@ -5,7 +5,7 @@ import { SortableLinkList } from '../common/SortableLinkList';
|
|
|
5
5
|
import { FetchingWrappedEntryCard } from './WrappedEntryCard/FetchingWrappedEntryCard';
|
|
6
6
|
export function MultipleEntryReferenceEditor(props) {
|
|
7
7
|
const [indexToUpdate, setIndexToUpdate] = React.useState(undefined);
|
|
8
|
-
const updateBeforeSortStart = ({ index
|
|
8
|
+
const updateBeforeSortStart = ({ index })=>{
|
|
9
9
|
setIndexToUpdate(index);
|
|
10
10
|
};
|
|
11
11
|
return React.createElement(MultipleReferenceEditor, {
|
|
@@ -16,7 +16,7 @@ export function MultipleEntryReferenceEditor(props) {
|
|
|
16
16
|
...childrenProps,
|
|
17
17
|
sortingStrategy: verticalListSortingStrategy,
|
|
18
18
|
updateBeforeSortStart: updateBeforeSortStart
|
|
19
|
-
}, ({ items
|
|
19
|
+
}, ({ items, item, index, isDisabled, DragHandle })=>{
|
|
20
20
|
const lastIndex = items.length - 1;
|
|
21
21
|
return React.createElement(FetchingWrappedEntryCard, {
|
|
22
22
|
...childrenProps,
|
|
@@ -5,7 +5,7 @@ export function SingleEntryReferenceEditor(props) {
|
|
|
5
5
|
return React.createElement(SingleReferenceEditor, {
|
|
6
6
|
...props,
|
|
7
7
|
entityType: "Entry"
|
|
8
|
-
}, ({ allContentTypes
|
|
8
|
+
}, ({ allContentTypes, isDisabled, entityId, setValue, renderCustomCard, hasCardRemoveActions, hasCardEditActions })=>{
|
|
9
9
|
return React.createElement(FetchingWrappedEntryCard, {
|
|
10
10
|
...props,
|
|
11
11
|
allContentTypes: allContentTypes,
|
|
@@ -24,14 +24,14 @@ async function openEntry(sdk, entryId, options) {
|
|
|
24
24
|
return slide;
|
|
25
25
|
}
|
|
26
26
|
export function FetchingWrappedEntryCard(props) {
|
|
27
|
-
const { data: entry
|
|
28
|
-
const { getEntityScheduledActions
|
|
27
|
+
const { data: entry, status } = useEntity('Entry', props.entryId);
|
|
28
|
+
const { getEntityScheduledActions } = useEntityLoader();
|
|
29
29
|
const loadEntityScheduledActions = React.useCallback(()=>getEntityScheduledActions('Entry', props.entryId), [
|
|
30
30
|
getEntityScheduledActions,
|
|
31
31
|
props.entryId
|
|
32
32
|
]);
|
|
33
33
|
const size = props.viewType === 'link' ? 'small' : 'default';
|
|
34
|
-
const { getEntity
|
|
34
|
+
const { getEntity } = useEntityLoader();
|
|
35
35
|
const getAsset = (assetId)=>getEntity('Asset', assetId);
|
|
36
36
|
const onEdit = async ()=>{
|
|
37
37
|
const slide = await openEntry(props.sdk, props.entryId, {
|
|
@@ -105,7 +105,7 @@ export function FetchingWrappedEntryCard(props) {
|
|
|
105
105
|
onMoveBottom: props.onMoveBottom,
|
|
106
106
|
isBeingDragged: props.isBeingDragged
|
|
107
107
|
};
|
|
108
|
-
const { hasCardEditActions
|
|
108
|
+
const { hasCardEditActions, hasCardMoveActions, hasCardRemoveActions } = props;
|
|
109
109
|
function renderDefaultCard(props) {
|
|
110
110
|
const builtinCardProps = {
|
|
111
111
|
...sharedCardProps,
|
|
@@ -115,7 +115,7 @@ export function FetchingWrappedEntryCard(props) {
|
|
|
115
115
|
hasCardRemoveActions,
|
|
116
116
|
getAsset,
|
|
117
117
|
getEntityScheduledActions: loadEntityScheduledActions,
|
|
118
|
-
entry:
|
|
118
|
+
entry: props?.entity || sharedCardProps.entity,
|
|
119
119
|
entryUrl: props?.entityUrl || sharedCardProps.entityUrl
|
|
120
120
|
};
|
|
121
121
|
return React.createElement(WrappedEntryCard, builtinCardProps);
|
|
@@ -6,7 +6,7 @@ import { entityHelpers, isValidImage } from '@contentful/field-editor-shared';
|
|
|
6
6
|
import { css } from 'emotion';
|
|
7
7
|
import { AssetThumbnail, MissingEntityCard, ScheduledIconWithTooltip } from '../../components';
|
|
8
8
|
import { SpaceName } from '../../components/SpaceName/SpaceName';
|
|
9
|
-
const { getEntryTitle
|
|
9
|
+
const { getEntryTitle, getEntityDescription, getEntryStatus, getEntryImage } = entityHelpers;
|
|
10
10
|
const styles = {
|
|
11
11
|
scheduleIcon: css({
|
|
12
12
|
marginRight: tokens.spacing2Xs
|
|
@@ -20,7 +20,7 @@ const defaultProps = {
|
|
|
20
20
|
};
|
|
21
21
|
export function WrappedEntryCard(props) {
|
|
22
22
|
const [file, setFile] = React.useState(null);
|
|
23
|
-
const { contentType
|
|
23
|
+
const { contentType } = props;
|
|
24
24
|
React.useEffect(()=>{
|
|
25
25
|
if (props.entry) {
|
|
26
26
|
getEntryImage({
|
|
@@ -2,7 +2,7 @@ import * as React from 'react';
|
|
|
2
2
|
import { WrappedEntryCard } from '../../entries';
|
|
3
3
|
const resolveAsset = ()=>Promise.resolve();
|
|
4
4
|
const resolveScheduledActions = ()=>Promise.resolve([]);
|
|
5
|
-
export function ContentfulEntryCard({ info
|
|
5
|
+
export function ContentfulEntryCard({ info, isDisabled, renderDragHandle, onRemove, onMoveTop, onMoveBottom, getEntryRouteHref }) {
|
|
6
6
|
const resourceSys = info.resource.sys;
|
|
7
7
|
const spaceId = resourceSys.space.sys.id;
|
|
8
8
|
const environmentId = resourceSys.environment.sys.id;
|
|
@@ -11,12 +11,12 @@ function ResourceCardSkeleton() {
|
|
|
11
11
|
});
|
|
12
12
|
}
|
|
13
13
|
function ExistingResourceCard(props) {
|
|
14
|
-
const { resourceLink
|
|
14
|
+
const { resourceLink, inView, index = 0 } = props;
|
|
15
15
|
const resourceOptions = {
|
|
16
16
|
priority: index * -1,
|
|
17
17
|
enabled: inView
|
|
18
18
|
};
|
|
19
|
-
const { data
|
|
19
|
+
const { data, error } = useResource(resourceLink.sys.linkType, resourceLink.sys.urn, resourceOptions);
|
|
20
20
|
if (!data && !error) {
|
|
21
21
|
return React.createElement(ResourceCardSkeleton, null);
|
|
22
22
|
}
|
|
@@ -44,7 +44,7 @@ function ResourceCardWrapper(props) {
|
|
|
44
44
|
});
|
|
45
45
|
}
|
|
46
46
|
export function ResourceCard(props) {
|
|
47
|
-
const { ref
|
|
47
|
+
const { ref, inView } = useInView({
|
|
48
48
|
triggerOnce: true,
|
|
49
49
|
rootMargin: '300px 0px 0px 300px'
|
|
50
50
|
});
|
|
@@ -27,7 +27,7 @@ const sdk = {
|
|
|
27
27
|
get: jest.fn().mockReturnValue(publishedCT)
|
|
28
28
|
},
|
|
29
29
|
Entry: {
|
|
30
|
-
get: jest.fn().mockImplementation(({ spaceId
|
|
30
|
+
get: jest.fn().mockImplementation(({ spaceId, environmentId, entryId })=>{
|
|
31
31
|
if (spaceId === 'space-id' && environmentId === 'master' && entryId === 'linked-entry-urn') {
|
|
32
32
|
return Promise.resolve(publishedEntry);
|
|
33
33
|
}
|
|
@@ -66,7 +66,7 @@ const sdk = {
|
|
|
66
66
|
environment: 'environment-id'
|
|
67
67
|
}
|
|
68
68
|
};
|
|
69
|
-
function renderResourceCard({ linkType ='Contentful:Entry'
|
|
69
|
+
function renderResourceCard({ linkType = 'Contentful:Entry', entryUrn = resolvableEntryUrn } = {}) {
|
|
70
70
|
return render(React.createElement(EntityProvider, {
|
|
71
71
|
sdk: sdk
|
|
72
72
|
}, React.createElement(ResourceCard, {
|
|
@@ -83,7 +83,7 @@ function renderResourceCard({ linkType ='Contentful:Entry' , entryUrn =resolvabl
|
|
|
83
83
|
}
|
|
84
84
|
describe('ResourceCard', ()=>{
|
|
85
85
|
it('renders entry card with implicit master crn', async ()=>{
|
|
86
|
-
const { getByTestId
|
|
86
|
+
const { getByTestId, getByText } = renderResourceCard();
|
|
87
87
|
const tooltipContent = `Space: ${space.name} (Env.: ${publishedEntry.sys.environment.sys.id})`;
|
|
88
88
|
await waitFor(()=>expect(getByTestId('cf-ui-entry-card')).toBeDefined());
|
|
89
89
|
expect(getByText(publishedEntry.fields.exField['en-US'])).toBeDefined();
|
|
@@ -92,7 +92,7 @@ describe('ResourceCard', ()=>{
|
|
|
92
92
|
await waitFor(()=>expect(getByText(tooltipContent)).toBeDefined());
|
|
93
93
|
});
|
|
94
94
|
it('renders entry card with explicit master crn', async ()=>{
|
|
95
|
-
const { getByTestId
|
|
95
|
+
const { getByTestId, getByText } = renderResourceCard({
|
|
96
96
|
entryUrn: resolvableEntryUrnWithExplicitMaster
|
|
97
97
|
});
|
|
98
98
|
const tooltipContent = `Space: ${space.name} (Env.: ${publishedEntry.sys.environment.sys.id})`;
|
|
@@ -103,7 +103,7 @@ describe('ResourceCard', ()=>{
|
|
|
103
103
|
await waitFor(()=>expect(getByText(tooltipContent)).toBeDefined());
|
|
104
104
|
});
|
|
105
105
|
it('renders entry card with a non master environment', async ()=>{
|
|
106
|
-
const { getByTestId
|
|
106
|
+
const { getByTestId, getByText } = renderResourceCard({
|
|
107
107
|
entryUrn: resolvableEntryUrnWithAnotherEnvironment
|
|
108
108
|
});
|
|
109
109
|
await waitFor(()=>expect(getByTestId('cf-ui-entry-card')).toBeDefined());
|
|
@@ -114,23 +114,23 @@ describe('ResourceCard', ()=>{
|
|
|
114
114
|
await waitFor(()=>expect(getByText(tooltipContent)).toBeDefined());
|
|
115
115
|
});
|
|
116
116
|
it('renders skeleton when no data is provided', ()=>{
|
|
117
|
-
const { getByTestId
|
|
117
|
+
const { getByTestId } = renderResourceCard();
|
|
118
118
|
expect(getByTestId('cf-ui-skeleton-form')).toBeDefined();
|
|
119
119
|
});
|
|
120
120
|
it('renders unsupported entity card when unsupported link is passed', async ()=>{
|
|
121
|
-
const { getByText
|
|
121
|
+
const { getByText } = renderResourceCard({
|
|
122
122
|
linkType: 'Contentful:UnsupportedLink'
|
|
123
123
|
});
|
|
124
124
|
await waitFor(()=>expect(getByText('Resource type Contentful:UnsupportedLink is currently not supported')).toBeDefined());
|
|
125
125
|
});
|
|
126
126
|
it('renders missing entity card when unknown error is returned', async ()=>{
|
|
127
|
-
const { getByTestId
|
|
127
|
+
const { getByTestId } = renderResourceCard({
|
|
128
128
|
entryUrn: unknownEntryUrn
|
|
129
129
|
});
|
|
130
130
|
await waitFor(()=>expect(getByTestId('cf-ui-missing-entry-card')).toBeDefined());
|
|
131
131
|
});
|
|
132
132
|
it('renders missing entity card when crn is invalid', async ()=>{
|
|
133
|
-
const { getByTestId
|
|
133
|
+
const { getByTestId } = renderResourceCard({
|
|
134
134
|
entryUrn: ''
|
|
135
135
|
});
|
|
136
136
|
await waitFor(()=>expect(getByTestId('cf-ui-missing-entry-card')).toBeDefined());
|
|
@@ -10,9 +10,9 @@ import { CombinedLinkEntityActions } from '../components/LinkActions/LinkEntityA
|
|
|
10
10
|
import { ResourceCard } from './Cards/ResourceCard';
|
|
11
11
|
import { useResourceLinkActions } from './useResourceLinkActions';
|
|
12
12
|
function ResourceEditor(props) {
|
|
13
|
-
const { setValue
|
|
13
|
+
const { setValue, items, apiUrl } = props;
|
|
14
14
|
const onSortStart = ()=>noop();
|
|
15
|
-
const onSortEnd = useCallback(({ oldIndex
|
|
15
|
+
const onSortEnd = useCallback(({ oldIndex, newIndex })=>{
|
|
16
16
|
const newItems = arrayMove(items, oldIndex, newIndex);
|
|
17
17
|
setValue(newItems);
|
|
18
18
|
}, [
|
|
@@ -32,7 +32,7 @@ function ResourceEditor(props) {
|
|
|
32
32
|
items,
|
|
33
33
|
setValue
|
|
34
34
|
]);
|
|
35
|
-
const { dialogs
|
|
35
|
+
const { dialogs, field } = props.sdk;
|
|
36
36
|
const linkActionsProps = useResourceLinkActions({
|
|
37
37
|
dialogs,
|
|
38
38
|
field,
|
|
@@ -49,7 +49,7 @@ function ResourceEditor(props) {
|
|
|
49
49
|
renderCustomActions: props.renderCustomActions
|
|
50
50
|
}));
|
|
51
51
|
}
|
|
52
|
-
function WithPerItemCallbacks({ listLength
|
|
52
|
+
function WithPerItemCallbacks({ listLength, index, onMove, onRemoteItemAtIndex, children }) {
|
|
53
53
|
const handleMoveTop = React.useMemo(()=>index > 0 ? ()=>onMove(index, 0) : undefined, [
|
|
54
54
|
index,
|
|
55
55
|
onMove
|
|
@@ -78,7 +78,7 @@ export function MultipleResourceReferenceEditor(props) {
|
|
|
78
78
|
field: props.sdk.field,
|
|
79
79
|
isInitiallyDisabled: props.isInitiallyDisabled,
|
|
80
80
|
isEqualValues: deepEqual
|
|
81
|
-
}, ({ value
|
|
81
|
+
}, ({ value, disabled, setValue, externalReset })=>{
|
|
82
82
|
return React.createElement(ResourceEditor, {
|
|
83
83
|
...props,
|
|
84
84
|
items: value || EMPTY_ARRAY,
|
|
@@ -86,13 +86,13 @@ export function MultipleResourceReferenceEditor(props) {
|
|
|
86
86
|
setValue: setValue,
|
|
87
87
|
renderCustomActions: props.renderCustomActions,
|
|
88
88
|
key: `${externalReset}-list`
|
|
89
|
-
}, (editorProps)=>React.createElement(SortableLinkList, editorProps, ({ item
|
|
89
|
+
}, (editorProps)=>React.createElement(SortableLinkList, editorProps, ({ item, isDisabled, DragHandle, index })=>React.createElement(WithPerItemCallbacks, {
|
|
90
90
|
key: index,
|
|
91
91
|
index: index,
|
|
92
92
|
onMove: editorProps.onMove,
|
|
93
93
|
onRemoteItemAtIndex: editorProps.onRemoteItemAtIndex,
|
|
94
94
|
listLength: value?.length || 0
|
|
95
|
-
}, ({ onMoveBottom
|
|
95
|
+
}, ({ onMoveBottom, onMoveTop, onRemove })=>React.createElement(ResourceCard, {
|
|
96
96
|
key: index,
|
|
97
97
|
index: index,
|
|
98
98
|
resourceLink: item,
|
|
@@ -80,7 +80,7 @@ describe('Multiple resource editor', ()=>{
|
|
|
80
80
|
});
|
|
81
81
|
describe('with value', ()=>{
|
|
82
82
|
it('renders the cards', async ()=>{
|
|
83
|
-
const { entryLinks
|
|
83
|
+
const { entryLinks, entryInfos } = generateMultipleTestResources();
|
|
84
84
|
mockedResources = {};
|
|
85
85
|
for (const [spaceId, link] of Object.entries(entryLinks)){
|
|
86
86
|
mockedResources[`${link.sys.linkType}.${link.sys.urn}`] = entryInfos[spaceId];
|
|
@@ -107,7 +107,7 @@ describe('Multiple resource editor', ()=>{
|
|
|
107
107
|
});
|
|
108
108
|
describe('card actions', ()=>{
|
|
109
109
|
it('should have a move to top button', async ()=>{
|
|
110
|
-
const { entryLinks
|
|
110
|
+
const { entryLinks, entryInfos } = generateMultipleTestResources();
|
|
111
111
|
mockedResources = {};
|
|
112
112
|
for (const [spaceId, link] of Object.entries(entryLinks)){
|
|
113
113
|
mockedResources[`${link.sys.linkType}.${link.sys.urn}`] = entryInfos[spaceId];
|
|
@@ -133,7 +133,7 @@ describe('Multiple resource editor', ()=>{
|
|
|
133
133
|
}
|
|
134
134
|
});
|
|
135
135
|
it('should have a move to bottom button', async ()=>{
|
|
136
|
-
const { entryLinks
|
|
136
|
+
const { entryLinks, entryInfos } = generateMultipleTestResources();
|
|
137
137
|
mockedResources = {};
|
|
138
138
|
for (const [spaceId, link] of Object.entries(entryLinks)){
|
|
139
139
|
mockedResources[`${link.sys.linkType}.${link.sys.urn}`] = entryInfos[spaceId];
|
|
@@ -159,7 +159,7 @@ describe('Multiple resource editor', ()=>{
|
|
|
159
159
|
}
|
|
160
160
|
});
|
|
161
161
|
it('works when using remove action', async ()=>{
|
|
162
|
-
const { entryLinks
|
|
162
|
+
const { entryLinks, entryInfos } = generateMultipleTestResources();
|
|
163
163
|
mockedResources = {};
|
|
164
164
|
for (const [spaceId, link] of Object.entries(entryLinks)){
|
|
165
165
|
mockedResources[`${link.sys.linkType}.${link.sys.urn}`] = entryInfos[spaceId];
|
|
@@ -6,7 +6,7 @@ import { CombinedLinkEntityActions } from '../components/LinkActions/LinkEntityA
|
|
|
6
6
|
import { ResourceCard } from './Cards/ResourceCard';
|
|
7
7
|
import { useResourceLinkActions } from './useResourceLinkActions';
|
|
8
8
|
export function SingleResourceReferenceEditor(props) {
|
|
9
|
-
const { dialogs
|
|
9
|
+
const { dialogs, field } = props.sdk;
|
|
10
10
|
const linkActionsProps = useResourceLinkActions({
|
|
11
11
|
dialogs,
|
|
12
12
|
field,
|
|
@@ -19,7 +19,7 @@ export function SingleResourceReferenceEditor(props) {
|
|
|
19
19
|
field: props.sdk.field,
|
|
20
20
|
isInitiallyDisabled: props.isInitiallyDisabled,
|
|
21
21
|
isEqualValues: deepEqual
|
|
22
|
-
}, ({ value
|
|
22
|
+
}, ({ value, disabled })=>{
|
|
23
23
|
return value ? React.createElement(ResourceCard, {
|
|
24
24
|
onRemove: ()=>props.sdk.field.removeValue(),
|
|
25
25
|
resourceLink: value,
|
|
@@ -57,8 +57,8 @@ export function mockSdkForField(fieldDefinition, fieldValue) {
|
|
|
57
57
|
}
|
|
58
58
|
};
|
|
59
59
|
}
|
|
60
|
-
export const createFakeEntryResource = ({ title
|
|
61
|
-
const { id: spaceId
|
|
60
|
+
export const createFakeEntryResource = ({ title, id, space })=>{
|
|
61
|
+
const { id: spaceId, name: spaceName } = space;
|
|
62
62
|
return {
|
|
63
63
|
resource: {
|
|
64
64
|
sys: {
|
|
@@ -19,7 +19,7 @@ const getUpdatedValue = (field, entries, apiUrl)=>{
|
|
|
19
19
|
return toLinkItem(entries[0], apiUrl);
|
|
20
20
|
}
|
|
21
21
|
};
|
|
22
|
-
export function useResourceLinkActions({ dialogs
|
|
22
|
+
export function useResourceLinkActions({ dialogs, field, onAfterLink, apiUrl }) {
|
|
23
23
|
const handleAfterLink = useCallback((entries)=>{
|
|
24
24
|
if (!onAfterLink) {
|
|
25
25
|
return;
|
|
@@ -2,7 +2,7 @@ import React, { useCallback, useState } from 'react';
|
|
|
2
2
|
import { arrayMove } from '@dnd-kit/sortable';
|
|
3
3
|
export const useSortIDs = (items)=>{
|
|
4
4
|
const ids = (items || []).map((item, index)=>{
|
|
5
|
-
const { type
|
|
5
|
+
const { type } = item.sys;
|
|
6
6
|
return {
|
|
7
7
|
id: type === 'ResourceLink' ? `${item.sys.urn}-${index}` : `${item.sys.id}-${index}`
|
|
8
8
|
};
|
|
@@ -11,7 +11,7 @@ export const useSortIDs = (items)=>{
|
|
|
11
11
|
React.useEffect(()=>{
|
|
12
12
|
if (items.length !== sortIDs.length) {
|
|
13
13
|
const ids = items.map((item, index)=>{
|
|
14
|
-
const { type
|
|
14
|
+
const { type } = item.sys;
|
|
15
15
|
return {
|
|
16
16
|
id: type === 'ResourceLink' ? `${item.sys.urn}-${index}` : `${item.sys.id}-${index}`
|
|
17
17
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@contentful/field-editor-reference",
|
|
3
|
-
"version": "5.21.
|
|
3
|
+
"version": "5.21.6",
|
|
4
4
|
"main": "dist/cjs/index.js",
|
|
5
5
|
"module": "dist/esm/index.js",
|
|
6
6
|
"types": "dist/types/index.d.ts",
|
|
@@ -38,8 +38,8 @@
|
|
|
38
38
|
"@contentful/f36-components": "^4.0.27",
|
|
39
39
|
"@contentful/f36-icons": "^4.1.0",
|
|
40
40
|
"@contentful/f36-tokens": "^4.0.0",
|
|
41
|
-
"@contentful/field-editor-shared": "^1.4.
|
|
42
|
-
"@contentful/mimetype": "^
|
|
41
|
+
"@contentful/field-editor-shared": "^1.4.5",
|
|
42
|
+
"@contentful/mimetype": "^2.2.29",
|
|
43
43
|
"@dnd-kit/core": "^6.0.8",
|
|
44
44
|
"@dnd-kit/modifiers": "^6.0.1",
|
|
45
45
|
"@dnd-kit/sortable": "^7.0.2",
|
|
@@ -57,7 +57,7 @@
|
|
|
57
57
|
},
|
|
58
58
|
"devDependencies": {
|
|
59
59
|
"@contentful/app-sdk": "^4.17.1",
|
|
60
|
-
"@contentful/field-editor-test-utils": "^1.4.
|
|
60
|
+
"@contentful/field-editor-test-utils": "^1.4.6",
|
|
61
61
|
"@testing-library/react-hooks": "^5.0.3"
|
|
62
62
|
},
|
|
63
63
|
"peerDependencies": {
|
|
@@ -67,5 +67,5 @@
|
|
|
67
67
|
"publishConfig": {
|
|
68
68
|
"registry": "https://npm.pkg.github.com/"
|
|
69
69
|
},
|
|
70
|
-
"gitHead": "
|
|
70
|
+
"gitHead": "142d2039f023bf4ced956aae1dd08b27c35fdbaa"
|
|
71
71
|
}
|