@contentful/field-editor-reference 5.26.3 → 5.27.1
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/assets/WrappedAssetCard/FetchingWrappedAssetCard.js +1 -2
- package/dist/cjs/assets/WrappedAssetCard/WrappedAssetCard.js +1 -2
- package/dist/cjs/assets/WrappedAssetCard/WrappedAssetLink.js +1 -2
- package/dist/cjs/components/MissingAssetCard/MissingAssetCard.js +78 -0
- package/dist/cjs/components/MissingEntityCard/MissingEntityCard.js +27 -62
- package/dist/cjs/components/ResourceEntityErrorCard/ResourceEntityErrorCard.js +6 -4
- package/dist/cjs/components/ResourceEntityErrorCard/UnsupportedEntityCard.js +6 -13
- package/dist/cjs/components/index.js +4 -0
- package/dist/cjs/entries/WrappedEntryCard/FetchingWrappedEntryCard.js +2 -2
- package/dist/cjs/entries/WrappedEntryCard/WrappedEntryCard.js +2 -2
- package/dist/cjs/resources/Cards/ResourceCard.spec.js +8 -6
- package/dist/cjs/utils/getProviderName.js +17 -0
- package/dist/cjs/utils/getProviderName.spec.js +13 -0
- package/dist/esm/assets/WrappedAssetCard/FetchingWrappedAssetCard.js +2 -3
- package/dist/esm/assets/WrappedAssetCard/WrappedAssetCard.js +2 -3
- package/dist/esm/assets/WrappedAssetCard/WrappedAssetLink.js +2 -3
- package/dist/esm/components/MissingAssetCard/MissingAssetCard.js +27 -0
- package/dist/esm/components/MissingEntityCard/MissingEntityCard.js +25 -24
- package/dist/esm/components/ResourceEntityErrorCard/ResourceEntityErrorCard.js +6 -4
- package/dist/esm/components/ResourceEntityErrorCard/UnsupportedEntityCard.js +6 -13
- package/dist/esm/components/index.js +1 -0
- package/dist/esm/entries/WrappedEntryCard/FetchingWrappedEntryCard.js +2 -2
- package/dist/esm/entries/WrappedEntryCard/WrappedEntryCard.js +2 -2
- package/dist/esm/resources/Cards/ResourceCard.spec.js +8 -6
- package/dist/esm/utils/getProviderName.js +7 -0
- package/dist/esm/utils/getProviderName.spec.js +9 -0
- package/dist/types/components/MissingAssetCard/MissingAssetCard.d.ts +7 -0
- package/dist/types/components/MissingEntityCard/MissingEntityCard.d.ts +7 -6
- package/dist/types/components/ResourceEntityErrorCard/ResourceEntityErrorCard.d.ts +4 -2
- package/dist/types/components/ResourceEntityErrorCard/UnsupportedEntityCard.d.ts +5 -3
- package/dist/types/components/index.d.ts +1 -0
- package/dist/types/utils/getProviderName.d.ts +1 -0
- package/dist/types/utils/getProviderName.spec.d.ts +1 -0
- package/package.json +3 -3
- /package/dist/cjs/components/{MissingEntityCard → MissingAssetCard}/styles.js +0 -0
- /package/dist/esm/components/{MissingEntityCard → MissingAssetCard}/styles.js +0 -0
- /package/dist/types/components/{MissingEntityCard → MissingAssetCard}/styles.d.ts +0 -0
|
@@ -95,8 +95,7 @@ function FetchingWrappedAssetCard(props) {
|
|
|
95
95
|
};
|
|
96
96
|
return _react.useMemo(()=>{
|
|
97
97
|
if (status === 'error') {
|
|
98
|
-
const card = _react.createElement(_components.
|
|
99
|
-
entityType: "Asset",
|
|
98
|
+
const card = _react.createElement(_components.MissingAssetCard, {
|
|
100
99
|
asSquare: props.viewType !== 'link',
|
|
101
100
|
isDisabled: props.isDisabled,
|
|
102
101
|
onRemove: onRemove
|
|
@@ -98,8 +98,7 @@ const WrappedAssetCard = (props)=>{
|
|
|
98
98
|
const { className, onEdit, getAssetUrl, onRemove, size, isDisabled, isSelected, isClickable } = props;
|
|
99
99
|
const status = _fieldeditorshared.entityHelpers.getEntryStatus(props.asset.sys);
|
|
100
100
|
if (status === 'deleted') {
|
|
101
|
-
return _react.createElement(_components.
|
|
102
|
-
entityType: "Asset",
|
|
101
|
+
return _react.createElement(_components.MissingAssetCard, {
|
|
103
102
|
asSquare: true,
|
|
104
103
|
isDisabled: props.isDisabled,
|
|
105
104
|
onRemove: props.onRemove
|
|
@@ -71,8 +71,7 @@ const WrappedAssetLink = (props)=>{
|
|
|
71
71
|
const { className, href, onEdit, onRemove, isDisabled } = props;
|
|
72
72
|
const status = _fieldeditorshared.entityHelpers.getEntryStatus(props.asset.sys);
|
|
73
73
|
if (status === 'deleted') {
|
|
74
|
-
return _react.createElement(_components.
|
|
75
|
-
entityType: "Asset",
|
|
74
|
+
return _react.createElement(_components.MissingAssetCard, {
|
|
76
75
|
isDisabled: props.isDisabled,
|
|
77
76
|
onRemove: props.onRemove
|
|
78
77
|
});
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "MissingAssetCard", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return MissingAssetCard;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _react = _interop_require_wildcard(require("react"));
|
|
12
|
+
const _f36components = require("@contentful/f36-components");
|
|
13
|
+
const _f36icons = require("@contentful/f36-icons");
|
|
14
|
+
const _styles = _interop_require_wildcard(require("./styles"));
|
|
15
|
+
function _getRequireWildcardCache(nodeInterop) {
|
|
16
|
+
if (typeof WeakMap !== "function") return null;
|
|
17
|
+
var cacheBabelInterop = new WeakMap();
|
|
18
|
+
var cacheNodeInterop = new WeakMap();
|
|
19
|
+
return (_getRequireWildcardCache = function(nodeInterop) {
|
|
20
|
+
return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
|
|
21
|
+
})(nodeInterop);
|
|
22
|
+
}
|
|
23
|
+
function _interop_require_wildcard(obj, nodeInterop) {
|
|
24
|
+
if (!nodeInterop && obj && obj.__esModule) {
|
|
25
|
+
return obj;
|
|
26
|
+
}
|
|
27
|
+
if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
|
|
28
|
+
return {
|
|
29
|
+
default: obj
|
|
30
|
+
};
|
|
31
|
+
}
|
|
32
|
+
var cache = _getRequireWildcardCache(nodeInterop);
|
|
33
|
+
if (cache && cache.has(obj)) {
|
|
34
|
+
return cache.get(obj);
|
|
35
|
+
}
|
|
36
|
+
var newObj = {
|
|
37
|
+
__proto__: null
|
|
38
|
+
};
|
|
39
|
+
var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
|
|
40
|
+
for(var key in obj){
|
|
41
|
+
if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
|
|
42
|
+
var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
|
|
43
|
+
if (desc && (desc.get || desc.set)) {
|
|
44
|
+
Object.defineProperty(newObj, key, desc);
|
|
45
|
+
} else {
|
|
46
|
+
newObj[key] = obj[key];
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
newObj.default = obj;
|
|
51
|
+
if (cache) {
|
|
52
|
+
cache.set(obj, newObj);
|
|
53
|
+
}
|
|
54
|
+
return newObj;
|
|
55
|
+
}
|
|
56
|
+
function MissingAssetCard(props) {
|
|
57
|
+
return _react.createElement(_f36components.Card, {
|
|
58
|
+
className: _styles.card,
|
|
59
|
+
testId: "cf-ui-missing-asset-card",
|
|
60
|
+
isSelected: props.isSelected
|
|
61
|
+
}, _react.createElement(_f36components.Flex, {
|
|
62
|
+
alignItems: "center",
|
|
63
|
+
justifyContent: "space-between"
|
|
64
|
+
}, _react.createElement("div", {
|
|
65
|
+
className: props.asSquare ? _styles.squareCard : ''
|
|
66
|
+
}, _react.createElement(_f36components.SectionHeading, {
|
|
67
|
+
marginBottom: "none"
|
|
68
|
+
}, "Asset is missing or inaccessible")), !props.isDisabled && props.onRemove && _react.createElement(_f36components.IconButton, {
|
|
69
|
+
variant: "transparent",
|
|
70
|
+
icon: _react.createElement(_f36icons.CloseIcon, {
|
|
71
|
+
variant: "muted"
|
|
72
|
+
}),
|
|
73
|
+
"aria-label": "Delete",
|
|
74
|
+
onClick: ()=>{
|
|
75
|
+
props.onRemove && props.onRemove();
|
|
76
|
+
}
|
|
77
|
+
})));
|
|
78
|
+
}
|
|
@@ -8,71 +8,36 @@ Object.defineProperty(exports, "MissingEntityCard", {
|
|
|
8
8
|
return MissingEntityCard;
|
|
9
9
|
}
|
|
10
10
|
});
|
|
11
|
-
const _react =
|
|
11
|
+
const _react = _interop_require_default(require("react"));
|
|
12
12
|
const _f36components = require("@contentful/f36-components");
|
|
13
13
|
const _f36icons = require("@contentful/f36-icons");
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
var cacheBabelInterop = new WeakMap();
|
|
18
|
-
var cacheNodeInterop = new WeakMap();
|
|
19
|
-
return (_getRequireWildcardCache = function(nodeInterop) {
|
|
20
|
-
return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
|
|
21
|
-
})(nodeInterop);
|
|
22
|
-
}
|
|
23
|
-
function _interop_require_wildcard(obj, nodeInterop) {
|
|
24
|
-
if (!nodeInterop && obj && obj.__esModule) {
|
|
25
|
-
return obj;
|
|
26
|
-
}
|
|
27
|
-
if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
|
|
28
|
-
return {
|
|
29
|
-
default: obj
|
|
30
|
-
};
|
|
31
|
-
}
|
|
32
|
-
var cache = _getRequireWildcardCache(nodeInterop);
|
|
33
|
-
if (cache && cache.has(obj)) {
|
|
34
|
-
return cache.get(obj);
|
|
35
|
-
}
|
|
36
|
-
var newObj = {
|
|
37
|
-
__proto__: null
|
|
14
|
+
function _interop_require_default(obj) {
|
|
15
|
+
return obj && obj.__esModule ? obj : {
|
|
16
|
+
default: obj
|
|
38
17
|
};
|
|
39
|
-
var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
|
|
40
|
-
for(var key in obj){
|
|
41
|
-
if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
|
|
42
|
-
var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
|
|
43
|
-
if (desc && (desc.get || desc.set)) {
|
|
44
|
-
Object.defineProperty(newObj, key, desc);
|
|
45
|
-
} else {
|
|
46
|
-
newObj[key] = obj[key];
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
newObj.default = obj;
|
|
51
|
-
if (cache) {
|
|
52
|
-
cache.set(obj, newObj);
|
|
53
|
-
}
|
|
54
|
-
return newObj;
|
|
55
18
|
}
|
|
56
19
|
function MissingEntityCard(props) {
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
20
|
+
const providerName = props.providerName ?? 'Source';
|
|
21
|
+
const description = props.customMessage ?? 'Content missing or inaccessible';
|
|
22
|
+
function CustomActionButton() {
|
|
23
|
+
return _react.default.createElement(_f36components.IconButton, {
|
|
24
|
+
"aria-label": "Actions",
|
|
25
|
+
icon: _react.default.createElement(_f36icons.CloseIcon, {
|
|
26
|
+
variant: "muted"
|
|
27
|
+
}),
|
|
28
|
+
size: "small",
|
|
29
|
+
variant: "transparent",
|
|
30
|
+
onClick: ()=>{
|
|
31
|
+
props.onRemove && props.onRemove();
|
|
32
|
+
}
|
|
33
|
+
});
|
|
34
|
+
}
|
|
35
|
+
return _react.default.createElement(_f36components.EntryCard, {
|
|
36
|
+
as: "a",
|
|
37
|
+
contentType: providerName,
|
|
38
|
+
description: description,
|
|
39
|
+
isSelected: props.isSelected,
|
|
40
|
+
customActionButton: _react.default.createElement(CustomActionButton, null),
|
|
41
|
+
testId: "cf-ui-missing-entity-card"
|
|
42
|
+
});
|
|
78
43
|
}
|
|
@@ -10,6 +10,7 @@ Object.defineProperty(exports, "ResourceEntityErrorCard", {
|
|
|
10
10
|
});
|
|
11
11
|
const _react = _interop_require_wildcard(require("react"));
|
|
12
12
|
const _EntityStore = require("../../common/EntityStore");
|
|
13
|
+
const _getProviderName = require("../../utils/getProviderName");
|
|
13
14
|
const _MissingEntityCard = require("../MissingEntityCard/MissingEntityCard");
|
|
14
15
|
const _UnsupportedEntityCard = require("./UnsupportedEntityCard");
|
|
15
16
|
function _getRequireWildcardCache(nodeInterop) {
|
|
@@ -56,14 +57,15 @@ function _interop_require_wildcard(obj, nodeInterop) {
|
|
|
56
57
|
function ResourceEntityErrorCard(props) {
|
|
57
58
|
if ((0, _EntityStore.isUnsupportedError)(props.error)) {
|
|
58
59
|
return _react.createElement(_UnsupportedEntityCard.UnsupportedEntityCard, {
|
|
59
|
-
|
|
60
|
-
|
|
60
|
+
isSelected: props.isSelected,
|
|
61
|
+
onRemove: props.onRemove
|
|
61
62
|
});
|
|
62
63
|
}
|
|
64
|
+
const providerName = (0, _getProviderName.getProviderName)(props.linkType);
|
|
63
65
|
return _react.createElement(_MissingEntityCard.MissingEntityCard, {
|
|
64
|
-
entityType: "Entry",
|
|
65
66
|
isDisabled: props.isDisabled,
|
|
66
67
|
isSelected: props.isSelected,
|
|
67
|
-
onRemove: props.onRemove
|
|
68
|
+
onRemove: props.onRemove,
|
|
69
|
+
providerName: providerName
|
|
68
70
|
});
|
|
69
71
|
}
|
|
@@ -9,8 +9,7 @@ Object.defineProperty(exports, "UnsupportedEntityCard", {
|
|
|
9
9
|
}
|
|
10
10
|
});
|
|
11
11
|
const _react = _interop_require_wildcard(require("react"));
|
|
12
|
-
const
|
|
13
|
-
const _emotion = require("emotion");
|
|
12
|
+
const _MissingEntityCard = require("../MissingEntityCard/MissingEntityCard");
|
|
14
13
|
function _getRequireWildcardCache(nodeInterop) {
|
|
15
14
|
if (typeof WeakMap !== "function") return null;
|
|
16
15
|
var cacheBabelInterop = new WeakMap();
|
|
@@ -52,16 +51,10 @@ function _interop_require_wildcard(obj, nodeInterop) {
|
|
|
52
51
|
}
|
|
53
52
|
return newObj;
|
|
54
53
|
}
|
|
55
|
-
const styles = {
|
|
56
|
-
card: (0, _emotion.css)({
|
|
57
|
-
position: 'relative'
|
|
58
|
-
})
|
|
59
|
-
};
|
|
60
54
|
function UnsupportedEntityCard(props) {
|
|
61
|
-
return _react.createElement(
|
|
62
|
-
|
|
63
|
-
isSelected: props.isSelected
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
}, "Resource type ", props.linkType, " is currently not supported"));
|
|
55
|
+
return _react.createElement(_MissingEntityCard.MissingEntityCard, {
|
|
56
|
+
customMessage: "Unsupported API information",
|
|
57
|
+
isSelected: props.isSelected,
|
|
58
|
+
onRemove: props.onRemove
|
|
59
|
+
});
|
|
67
60
|
}
|
|
@@ -24,6 +24,9 @@ _export(exports, {
|
|
|
24
24
|
LinkEntityActions: function() {
|
|
25
25
|
return _LinkEntityActions.LinkEntityActions;
|
|
26
26
|
},
|
|
27
|
+
MissingAssetCard: function() {
|
|
28
|
+
return _MissingAssetCard.MissingAssetCard;
|
|
29
|
+
},
|
|
27
30
|
MissingEntityCard: function() {
|
|
28
31
|
return _MissingEntityCard.MissingEntityCard;
|
|
29
32
|
},
|
|
@@ -38,6 +41,7 @@ _export(exports, {
|
|
|
38
41
|
}
|
|
39
42
|
});
|
|
40
43
|
const _CombinedLinkActions = require("./LinkActions/CombinedLinkActions");
|
|
44
|
+
const _MissingAssetCard = require("./MissingAssetCard/MissingAssetCard");
|
|
41
45
|
const _MissingEntityCard = require("./MissingEntityCard/MissingEntityCard");
|
|
42
46
|
const _LinkEntityActions = require("./LinkActions/LinkEntityActions");
|
|
43
47
|
const _CreateEntryLinkButton = require("./CreateEntryLinkButton/CreateEntryLinkButton");
|
|
@@ -124,9 +124,9 @@ function FetchingWrappedEntryCard(props) {
|
|
|
124
124
|
return _react.useMemo(()=>{
|
|
125
125
|
if (status === 'error') {
|
|
126
126
|
const card = _react.createElement(_components.MissingEntityCard, {
|
|
127
|
-
entityType: "Entry",
|
|
128
127
|
isDisabled: props.isDisabled,
|
|
129
|
-
onRemove: onRemoveEntry
|
|
128
|
+
onRemove: onRemoveEntry,
|
|
129
|
+
providerName: "Contentful"
|
|
130
130
|
});
|
|
131
131
|
if (props.renderCustomMissingEntityCard) {
|
|
132
132
|
return props.renderCustomMissingEntityCard({
|
|
@@ -100,9 +100,9 @@ function WrappedEntryCard(props) {
|
|
|
100
100
|
const status = getEntryStatus(props.entry?.sys);
|
|
101
101
|
if (status === 'deleted') {
|
|
102
102
|
return _react.createElement(_components.MissingEntityCard, {
|
|
103
|
-
entityType: "Entry",
|
|
104
103
|
isDisabled: props.isDisabled,
|
|
105
|
-
onRemove: props.onRemove
|
|
104
|
+
onRemove: props.onRemove,
|
|
105
|
+
providerName: "Contentful"
|
|
106
106
|
});
|
|
107
107
|
}
|
|
108
108
|
const title = getEntryTitle({
|
|
@@ -196,26 +196,28 @@ describe('ResourceCard', ()=>{
|
|
|
196
196
|
const { getByText } = renderResourceCard({
|
|
197
197
|
linkType: 'Contentful:UnsupportedLink'
|
|
198
198
|
});
|
|
199
|
-
await (0, _react1.waitFor)(()=>expect(getByText('
|
|
199
|
+
await (0, _react1.waitFor)(()=>expect(getByText('Unsupported API information')).toBeDefined());
|
|
200
200
|
});
|
|
201
201
|
it('renders missing entity card when unknown error is returned', async ()=>{
|
|
202
202
|
const { getByTestId } = renderResourceCard({
|
|
203
203
|
entityUrn: unknownEntryUrn
|
|
204
204
|
});
|
|
205
|
-
await (0, _react1.waitFor)(()=>expect(getByTestId('cf-ui-missing-
|
|
205
|
+
await (0, _react1.waitFor)(()=>expect(getByTestId('cf-ui-missing-entity-card')).toBeDefined());
|
|
206
206
|
});
|
|
207
207
|
it('renders missing entity card when crn is invalid', async ()=>{
|
|
208
|
-
const { getByTestId } = renderResourceCard({
|
|
208
|
+
const { getByTestId, getByText } = renderResourceCard({
|
|
209
209
|
entityUrn: ''
|
|
210
210
|
});
|
|
211
|
-
await (0, _react1.waitFor)(()=>expect(getByTestId('cf-ui-missing-
|
|
211
|
+
await (0, _react1.waitFor)(()=>expect(getByTestId('cf-ui-missing-entity-card')).toBeDefined());
|
|
212
|
+
await (0, _react1.waitFor)(()=>expect(getByText('Content missing or inaccessible')).toBeDefined());
|
|
212
213
|
});
|
|
213
214
|
it('renders missing entity card when external urn is invalid', async ()=>{
|
|
214
|
-
const { getByTestId } = renderResourceCard({
|
|
215
|
+
const { getByTestId, getByText } = renderResourceCard({
|
|
215
216
|
linkType: resolvableExternalResourceType,
|
|
216
217
|
entityUrn: ''
|
|
217
218
|
});
|
|
218
|
-
await (0, _react1.waitFor)(()=>expect(getByTestId('cf-ui-missing-
|
|
219
|
+
await (0, _react1.waitFor)(()=>expect(getByTestId('cf-ui-missing-entity-card')).toBeDefined());
|
|
220
|
+
await (0, _react1.waitFor)(()=>expect(getByText('Content missing or inaccessible')).toBeDefined());
|
|
219
221
|
});
|
|
220
222
|
it('renders entry card for external resource', async ()=>{
|
|
221
223
|
const { getByTestId, getByText } = renderResourceCard({
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "getProviderName", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return getProviderName;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
function getProviderName(resourceLink) {
|
|
12
|
+
if (resourceLink.indexOf(':') === -1) {
|
|
13
|
+
return undefined;
|
|
14
|
+
}
|
|
15
|
+
const [provider] = resourceLink.split(':');
|
|
16
|
+
return provider;
|
|
17
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
const _getProviderName = require("./getProviderName");
|
|
6
|
+
describe('getProviderName', ()=>{
|
|
7
|
+
it('should return undefined if Resource Link is not in format "Provider:ResourceType"', ()=>{
|
|
8
|
+
expect((0, _getProviderName.getProviderName)('This is not a correct resource link')).toBeUndefined();
|
|
9
|
+
});
|
|
10
|
+
it('should return the provider when format is Provider:ResourceType', ()=>{
|
|
11
|
+
expect((0, _getProviderName.getProviderName)('Provider:ResourceType')).toBe('Provider');
|
|
12
|
+
});
|
|
13
|
+
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { AssetCard, EntryCard } from '@contentful/f36-components';
|
|
3
3
|
import { useEntity, useEntityLoader } from '../../common/EntityStore';
|
|
4
|
-
import {
|
|
4
|
+
import { MissingAssetCard } from '../../components';
|
|
5
5
|
import { WrappedAssetCard } from './WrappedAssetCard';
|
|
6
6
|
import { WrappedAssetLink } from './WrappedAssetLink';
|
|
7
7
|
export function FetchingWrappedAssetCard(props) {
|
|
@@ -44,8 +44,7 @@ export function FetchingWrappedAssetCard(props) {
|
|
|
44
44
|
};
|
|
45
45
|
return React.useMemo(()=>{
|
|
46
46
|
if (status === 'error') {
|
|
47
|
-
const card = React.createElement(
|
|
48
|
-
entityType: "Asset",
|
|
47
|
+
const card = React.createElement(MissingAssetCard, {
|
|
49
48
|
asSquare: props.viewType !== 'link',
|
|
50
49
|
isDisabled: props.isDisabled,
|
|
51
50
|
onRemove: onRemove
|
|
@@ -5,7 +5,7 @@ import tokens from '@contentful/f36-tokens';
|
|
|
5
5
|
import { entityHelpers } from '@contentful/field-editor-shared';
|
|
6
6
|
import mimetype from '@contentful/mimetype';
|
|
7
7
|
import { css } from 'emotion';
|
|
8
|
-
import {
|
|
8
|
+
import { MissingAssetCard, ScheduledIconWithTooltip } from '../../components';
|
|
9
9
|
import { renderActions, renderAssetInfo } from './AssetCardActions';
|
|
10
10
|
const groupToIconMap = {
|
|
11
11
|
image: 'image',
|
|
@@ -42,8 +42,7 @@ export const WrappedAssetCard = (props)=>{
|
|
|
42
42
|
const { className, onEdit, getAssetUrl, onRemove, size, isDisabled, isSelected, isClickable } = props;
|
|
43
43
|
const status = entityHelpers.getEntryStatus(props.asset.sys);
|
|
44
44
|
if (status === 'deleted') {
|
|
45
|
-
return React.createElement(
|
|
46
|
-
entityType: "Asset",
|
|
45
|
+
return React.createElement(MissingAssetCard, {
|
|
47
46
|
asSquare: true,
|
|
48
47
|
isDisabled: props.isDisabled,
|
|
49
48
|
onRemove: props.onRemove
|
|
@@ -4,7 +4,7 @@ import { ClockIcon } from '@contentful/f36-icons';
|
|
|
4
4
|
import tokens from '@contentful/f36-tokens';
|
|
5
5
|
import { entityHelpers, isValidImage } from '@contentful/field-editor-shared';
|
|
6
6
|
import { css } from 'emotion';
|
|
7
|
-
import { AssetThumbnail,
|
|
7
|
+
import { AssetThumbnail, MissingAssetCard, ScheduledIconWithTooltip } from '../../components';
|
|
8
8
|
import { renderActions, renderAssetInfo } from './AssetCardActions';
|
|
9
9
|
const styles = {
|
|
10
10
|
scheduleIcon: css({
|
|
@@ -15,8 +15,7 @@ export const WrappedAssetLink = (props)=>{
|
|
|
15
15
|
const { className, href, onEdit, onRemove, isDisabled } = props;
|
|
16
16
|
const status = entityHelpers.getEntryStatus(props.asset.sys);
|
|
17
17
|
if (status === 'deleted') {
|
|
18
|
-
return React.createElement(
|
|
19
|
-
entityType: "Asset",
|
|
18
|
+
return React.createElement(MissingAssetCard, {
|
|
20
19
|
isDisabled: props.isDisabled,
|
|
21
20
|
onRemove: props.onRemove
|
|
22
21
|
});
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { Card, Flex, IconButton, SectionHeading } from '@contentful/f36-components';
|
|
3
|
+
import { CloseIcon } from '@contentful/f36-icons';
|
|
4
|
+
import * as styles from './styles';
|
|
5
|
+
export function MissingAssetCard(props) {
|
|
6
|
+
return React.createElement(Card, {
|
|
7
|
+
className: styles.card,
|
|
8
|
+
testId: "cf-ui-missing-asset-card",
|
|
9
|
+
isSelected: props.isSelected
|
|
10
|
+
}, React.createElement(Flex, {
|
|
11
|
+
alignItems: "center",
|
|
12
|
+
justifyContent: "space-between"
|
|
13
|
+
}, React.createElement("div", {
|
|
14
|
+
className: props.asSquare ? styles.squareCard : ''
|
|
15
|
+
}, React.createElement(SectionHeading, {
|
|
16
|
+
marginBottom: "none"
|
|
17
|
+
}, "Asset is missing or inaccessible")), !props.isDisabled && props.onRemove && React.createElement(IconButton, {
|
|
18
|
+
variant: "transparent",
|
|
19
|
+
icon: React.createElement(CloseIcon, {
|
|
20
|
+
variant: "muted"
|
|
21
|
+
}),
|
|
22
|
+
"aria-label": "Delete",
|
|
23
|
+
onClick: ()=>{
|
|
24
|
+
props.onRemove && props.onRemove();
|
|
25
|
+
}
|
|
26
|
+
})));
|
|
27
|
+
}
|
|
@@ -1,27 +1,28 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { EntryCard, IconButton } from '@contentful/f36-components';
|
|
3
3
|
import { CloseIcon } from '@contentful/f36-icons';
|
|
4
|
-
import * as styles from './styles';
|
|
5
4
|
export function MissingEntityCard(props) {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
5
|
+
const providerName = props.providerName ?? 'Source';
|
|
6
|
+
const description = props.customMessage ?? 'Content missing or inaccessible';
|
|
7
|
+
function CustomActionButton() {
|
|
8
|
+
return React.createElement(IconButton, {
|
|
9
|
+
"aria-label": "Actions",
|
|
10
|
+
icon: React.createElement(CloseIcon, {
|
|
11
|
+
variant: "muted"
|
|
12
|
+
}),
|
|
13
|
+
size: "small",
|
|
14
|
+
variant: "transparent",
|
|
15
|
+
onClick: ()=>{
|
|
16
|
+
props.onRemove && props.onRemove();
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
}
|
|
20
|
+
return React.createElement(EntryCard, {
|
|
21
|
+
as: "a",
|
|
22
|
+
contentType: providerName,
|
|
23
|
+
description: description,
|
|
24
|
+
isSelected: props.isSelected,
|
|
25
|
+
customActionButton: React.createElement(CustomActionButton, null),
|
|
26
|
+
testId: "cf-ui-missing-entity-card"
|
|
27
|
+
});
|
|
27
28
|
}
|
|
@@ -1,18 +1,20 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { isUnsupportedError } from '../../common/EntityStore';
|
|
3
|
+
import { getProviderName } from '../../utils/getProviderName';
|
|
3
4
|
import { MissingEntityCard } from '../MissingEntityCard/MissingEntityCard';
|
|
4
5
|
import { UnsupportedEntityCard } from './UnsupportedEntityCard';
|
|
5
6
|
export function ResourceEntityErrorCard(props) {
|
|
6
7
|
if (isUnsupportedError(props.error)) {
|
|
7
8
|
return React.createElement(UnsupportedEntityCard, {
|
|
8
|
-
|
|
9
|
-
|
|
9
|
+
isSelected: props.isSelected,
|
|
10
|
+
onRemove: props.onRemove
|
|
10
11
|
});
|
|
11
12
|
}
|
|
13
|
+
const providerName = getProviderName(props.linkType);
|
|
12
14
|
return React.createElement(MissingEntityCard, {
|
|
13
|
-
entityType: "Entry",
|
|
14
15
|
isDisabled: props.isDisabled,
|
|
15
16
|
isSelected: props.isSelected,
|
|
16
|
-
onRemove: props.onRemove
|
|
17
|
+
onRemove: props.onRemove,
|
|
18
|
+
providerName: providerName
|
|
17
19
|
});
|
|
18
20
|
}
|
|
@@ -1,16 +1,9 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
import { css } from 'emotion';
|
|
4
|
-
const styles = {
|
|
5
|
-
card: css({
|
|
6
|
-
position: 'relative'
|
|
7
|
-
})
|
|
8
|
-
};
|
|
2
|
+
import { MissingEntityCard } from '../MissingEntityCard/MissingEntityCard';
|
|
9
3
|
export function UnsupportedEntityCard(props) {
|
|
10
|
-
return React.createElement(
|
|
11
|
-
|
|
12
|
-
isSelected: props.isSelected
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
}, "Resource type ", props.linkType, " is currently not supported"));
|
|
4
|
+
return React.createElement(MissingEntityCard, {
|
|
5
|
+
customMessage: "Unsupported API information",
|
|
6
|
+
isSelected: props.isSelected,
|
|
7
|
+
onRemove: props.onRemove
|
|
8
|
+
});
|
|
16
9
|
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export { CombinedLinkActions } from './LinkActions/CombinedLinkActions';
|
|
2
|
+
export { MissingAssetCard } from './MissingAssetCard/MissingAssetCard';
|
|
2
3
|
export { MissingEntityCard } from './MissingEntityCard/MissingEntityCard';
|
|
3
4
|
export { LinkEntityActions } from './LinkActions/LinkEntityActions';
|
|
4
5
|
export { CreateEntryLinkButton } from './CreateEntryLinkButton/CreateEntryLinkButton';
|
|
@@ -68,9 +68,9 @@ export function FetchingWrappedEntryCard(props) {
|
|
|
68
68
|
return React.useMemo(()=>{
|
|
69
69
|
if (status === 'error') {
|
|
70
70
|
const card = React.createElement(MissingEntityCard, {
|
|
71
|
-
entityType: "Entry",
|
|
72
71
|
isDisabled: props.isDisabled,
|
|
73
|
-
onRemove: onRemoveEntry
|
|
72
|
+
onRemove: onRemoveEntry,
|
|
73
|
+
providerName: "Contentful"
|
|
74
74
|
});
|
|
75
75
|
if (props.renderCustomMissingEntityCard) {
|
|
76
76
|
return props.renderCustomMissingEntityCard({
|
|
@@ -44,9 +44,9 @@ export function WrappedEntryCard(props) {
|
|
|
44
44
|
const status = getEntryStatus(props.entry?.sys);
|
|
45
45
|
if (status === 'deleted') {
|
|
46
46
|
return React.createElement(MissingEntityCard, {
|
|
47
|
-
entityType: "Entry",
|
|
48
47
|
isDisabled: props.isDisabled,
|
|
49
|
-
onRemove: props.onRemove
|
|
48
|
+
onRemove: props.onRemove,
|
|
49
|
+
providerName: "Contentful"
|
|
50
50
|
});
|
|
51
51
|
}
|
|
52
52
|
const title = getEntryTitle({
|
|
@@ -146,26 +146,28 @@ describe('ResourceCard', ()=>{
|
|
|
146
146
|
const { getByText } = renderResourceCard({
|
|
147
147
|
linkType: 'Contentful:UnsupportedLink'
|
|
148
148
|
});
|
|
149
|
-
await waitFor(()=>expect(getByText('
|
|
149
|
+
await waitFor(()=>expect(getByText('Unsupported API information')).toBeDefined());
|
|
150
150
|
});
|
|
151
151
|
it('renders missing entity card when unknown error is returned', async ()=>{
|
|
152
152
|
const { getByTestId } = renderResourceCard({
|
|
153
153
|
entityUrn: unknownEntryUrn
|
|
154
154
|
});
|
|
155
|
-
await waitFor(()=>expect(getByTestId('cf-ui-missing-
|
|
155
|
+
await waitFor(()=>expect(getByTestId('cf-ui-missing-entity-card')).toBeDefined());
|
|
156
156
|
});
|
|
157
157
|
it('renders missing entity card when crn is invalid', async ()=>{
|
|
158
|
-
const { getByTestId } = renderResourceCard({
|
|
158
|
+
const { getByTestId, getByText } = renderResourceCard({
|
|
159
159
|
entityUrn: ''
|
|
160
160
|
});
|
|
161
|
-
await waitFor(()=>expect(getByTestId('cf-ui-missing-
|
|
161
|
+
await waitFor(()=>expect(getByTestId('cf-ui-missing-entity-card')).toBeDefined());
|
|
162
|
+
await waitFor(()=>expect(getByText('Content missing or inaccessible')).toBeDefined());
|
|
162
163
|
});
|
|
163
164
|
it('renders missing entity card when external urn is invalid', async ()=>{
|
|
164
|
-
const { getByTestId } = renderResourceCard({
|
|
165
|
+
const { getByTestId, getByText } = renderResourceCard({
|
|
165
166
|
linkType: resolvableExternalResourceType,
|
|
166
167
|
entityUrn: ''
|
|
167
168
|
});
|
|
168
|
-
await waitFor(()=>expect(getByTestId('cf-ui-missing-
|
|
169
|
+
await waitFor(()=>expect(getByTestId('cf-ui-missing-entity-card')).toBeDefined());
|
|
170
|
+
await waitFor(()=>expect(getByText('Content missing or inaccessible')).toBeDefined());
|
|
169
171
|
});
|
|
170
172
|
it('renders entry card for external resource', async ()=>{
|
|
171
173
|
const { getByTestId, getByText } = renderResourceCard({
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { getProviderName } from './getProviderName';
|
|
2
|
+
describe('getProviderName', ()=>{
|
|
3
|
+
it('should return undefined if Resource Link is not in format "Provider:ResourceType"', ()=>{
|
|
4
|
+
expect(getProviderName('This is not a correct resource link')).toBeUndefined();
|
|
5
|
+
});
|
|
6
|
+
it('should return the provider when format is Provider:ResourceType', ()=>{
|
|
7
|
+
expect(getProviderName('Provider:ResourceType')).toBe('Provider');
|
|
8
|
+
});
|
|
9
|
+
});
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
asSquare?: boolean;
|
|
2
|
+
type MissingEntityCardProps = {
|
|
3
|
+
customMessage?: string;
|
|
4
|
+
isDisabled?: boolean;
|
|
6
5
|
isSelected?: boolean;
|
|
7
|
-
isDisabled: boolean;
|
|
8
6
|
onRemove?: Function;
|
|
9
|
-
|
|
7
|
+
providerName?: string;
|
|
8
|
+
};
|
|
9
|
+
export declare function MissingEntityCard(props: MissingEntityCardProps): JSX.Element;
|
|
10
|
+
export {};
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
|
|
2
|
+
type ResourceEntityErrorCardProps = {
|
|
3
3
|
linkType: string;
|
|
4
4
|
error: unknown;
|
|
5
5
|
isSelected?: boolean;
|
|
6
6
|
isDisabled: boolean;
|
|
7
7
|
onRemove?: Function;
|
|
8
|
-
}
|
|
8
|
+
};
|
|
9
|
+
export declare function ResourceEntityErrorCard(props: ResourceEntityErrorCardProps): JSX.Element;
|
|
10
|
+
export {};
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
|
|
3
|
-
linkType: string;
|
|
2
|
+
type UnsupportedEntityCardProps = {
|
|
4
3
|
isSelected?: boolean;
|
|
5
|
-
|
|
4
|
+
onRemove?: Function;
|
|
5
|
+
};
|
|
6
|
+
export declare function UnsupportedEntityCard(props: UnsupportedEntityCardProps): JSX.Element;
|
|
7
|
+
export {};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export type { LinkActionsProps } from './LinkActions/LinkActions';
|
|
2
2
|
export { CombinedLinkActions } from './LinkActions/CombinedLinkActions';
|
|
3
|
+
export { MissingAssetCard } from './MissingAssetCard/MissingAssetCard';
|
|
3
4
|
export { MissingEntityCard } from './MissingEntityCard/MissingEntityCard';
|
|
4
5
|
export { LinkEntityActions } from './LinkActions/LinkEntityActions';
|
|
5
6
|
export { CreateEntryLinkButton } from './CreateEntryLinkButton/CreateEntryLinkButton';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function getProviderName(resourceLink: string): string | undefined;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@contentful/field-editor-reference",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.27.1",
|
|
4
4
|
"main": "dist/cjs/index.js",
|
|
5
5
|
"module": "dist/esm/index.js",
|
|
6
6
|
"types": "dist/types/index.d.ts",
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
"@contentful/f36-components": "^4.60.0",
|
|
39
39
|
"@contentful/f36-icons": "^4.27.0",
|
|
40
40
|
"@contentful/f36-tokens": "^4.0.4",
|
|
41
|
-
"@contentful/field-editor-shared": "^1.4.
|
|
41
|
+
"@contentful/field-editor-shared": "^1.4.8",
|
|
42
42
|
"@contentful/mimetype": "^2.2.29",
|
|
43
43
|
"@dnd-kit/core": "^6.0.8",
|
|
44
44
|
"@dnd-kit/modifiers": "^6.0.1",
|
|
@@ -67,5 +67,5 @@
|
|
|
67
67
|
"publishConfig": {
|
|
68
68
|
"registry": "https://npm.pkg.github.com/"
|
|
69
69
|
},
|
|
70
|
-
"gitHead": "
|
|
70
|
+
"gitHead": "1d7d630fe6f9576ee4cf35feed8badc8440acbf1"
|
|
71
71
|
}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|