@backstage/plugin-catalog-react 0.4.6 → 0.6.0
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/CHANGELOG.md +62 -0
- package/dist/index.cjs.js +174 -67
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.d.ts +55 -5
- package/dist/index.esm.js +172 -69
- package/dist/index.esm.js.map +1 -1
- package/package.json +15 -17
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,67 @@
|
|
|
1
1
|
# @backstage/plugin-catalog-react
|
|
2
2
|
|
|
3
|
+
## 0.6.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 82fbda923e: Introduce a new `StarredEntitiesApi` that is used in the `useStarredEntities` hook.
|
|
8
|
+
The `@backstage/plugin-catalog` installs a default implementation that is backed by the `StorageApi`, but one can also override the `starredEntitiesApiRef`.
|
|
9
|
+
|
|
10
|
+
This change also updates the storage format from a custom string to an entity reference and moves the location in the local storage.
|
|
11
|
+
A migration will convert the previously starred entities to the location on the first load of Backstage.
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- 0366c9b667: Introduce a `useStarredEntity` hook to check if a single entity is starred.
|
|
16
|
+
It provides a more efficient implementation compared to the `useStarredEntities` hook, because the rendering is only triggered if the selected entity is starred, not if _any_ entity is starred.
|
|
17
|
+
- 4aca84f86b: Support `material-ui` overrides in plugin-catalog-react components
|
|
18
|
+
- b03b9f19e0: added sorting in entity `Name` column by `metadata.title` if present
|
|
19
|
+
- Updated dependencies
|
|
20
|
+
- @backstage/integration@0.6.8
|
|
21
|
+
- @backstage/core-app-api@0.1.17
|
|
22
|
+
- @backstage/core-components@0.7.0
|
|
23
|
+
|
|
24
|
+
## 0.5.2
|
|
25
|
+
|
|
26
|
+
### Patch Changes
|
|
27
|
+
|
|
28
|
+
- 5aae9bb61e: Name column will now render entity `metadata.title` if its present
|
|
29
|
+
- ca0559444c: Avoid usage of `.to*Case()`, preferring `.toLocale*Case('en-US')` instead.
|
|
30
|
+
- Updated dependencies
|
|
31
|
+
- @backstage/core-components@0.6.1
|
|
32
|
+
- @backstage/core-plugin-api@0.1.10
|
|
33
|
+
- @backstage/core-app-api@0.1.16
|
|
34
|
+
- @backstage/catalog-model@0.9.4
|
|
35
|
+
- @backstage/catalog-client@0.5.0
|
|
36
|
+
- @backstage/integration@0.6.7
|
|
37
|
+
|
|
38
|
+
## 0.5.1
|
|
39
|
+
|
|
40
|
+
### Patch Changes
|
|
41
|
+
|
|
42
|
+
- Updated dependencies
|
|
43
|
+
- @backstage/core-app-api@0.1.15
|
|
44
|
+
- @backstage/integration@0.6.6
|
|
45
|
+
- @backstage/core-plugin-api@0.1.9
|
|
46
|
+
- @backstage/core-components@0.6.0
|
|
47
|
+
|
|
48
|
+
## 0.5.0
|
|
49
|
+
|
|
50
|
+
### Minor Changes
|
|
51
|
+
|
|
52
|
+
- dbcaa6387a: Extends the `CatalogClient` interface with a `refreshEntity` method.
|
|
53
|
+
|
|
54
|
+
### Patch Changes
|
|
55
|
+
|
|
56
|
+
- cc464a56b3: This makes Type and Lifecycle columns consistent for all table cases and adds a new line in Description column for better readability
|
|
57
|
+
- febddedcb2: Bump `lodash` to remediate `SNYK-JS-LODASH-590103` security vulnerability
|
|
58
|
+
- Updated dependencies
|
|
59
|
+
- @backstage/core-components@0.5.0
|
|
60
|
+
- @backstage/integration@0.6.5
|
|
61
|
+
- @backstage/catalog-client@0.4.0
|
|
62
|
+
- @backstage/catalog-model@0.9.3
|
|
63
|
+
- @backstage/core-app-api@0.1.14
|
|
64
|
+
|
|
3
65
|
## 0.4.6
|
|
4
66
|
|
|
5
67
|
### Patch Changes
|
package/dist/index.cjs.js
CHANGED
|
@@ -4,30 +4,32 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var catalogClient = require('@backstage/catalog-client');
|
|
6
6
|
var corePluginApi = require('@backstage/core-plugin-api');
|
|
7
|
+
var ObservableImpl = require('zen-observable');
|
|
8
|
+
var catalogModel = require('@backstage/catalog-model');
|
|
9
|
+
var lodash = require('lodash');
|
|
7
10
|
var React = require('react');
|
|
8
11
|
var lab = require('@material-ui/lab');
|
|
9
12
|
var versionBridge = require('@backstage/version-bridge');
|
|
10
13
|
var reactRouter = require('react-router');
|
|
11
14
|
var reactUse = require('react-use');
|
|
12
|
-
var catalogModel = require('@backstage/catalog-model');
|
|
13
|
-
var lodash = require('lodash');
|
|
14
15
|
var qs = require('qs');
|
|
15
16
|
var coreComponents = require('@backstage/core-components');
|
|
16
|
-
var jwtDecoder = require('jwt-decode');
|
|
17
17
|
var core = require('@material-ui/core');
|
|
18
|
+
var jwtDecoder = require('jwt-decode');
|
|
18
19
|
var CheckBoxIcon = require('@material-ui/icons/CheckBox');
|
|
19
20
|
var CheckBoxOutlineBlankIcon = require('@material-ui/icons/CheckBoxOutlineBlank');
|
|
20
21
|
var ExpandMoreIcon = require('@material-ui/icons/ExpandMore');
|
|
21
22
|
var Clear = require('@material-ui/icons/Clear');
|
|
22
23
|
var Search = require('@material-ui/icons/Search');
|
|
23
24
|
var capitalize = require('lodash/capitalize');
|
|
24
|
-
var StarBorder = require('@material-ui/icons/StarBorder');
|
|
25
25
|
var Star = require('@material-ui/icons/Star');
|
|
26
|
+
var StarBorder = require('@material-ui/icons/StarBorder');
|
|
26
27
|
var Alert = require('@material-ui/lab/Alert');
|
|
27
28
|
var SettingsIcon = require('@material-ui/icons/Settings');
|
|
28
29
|
|
|
29
30
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
30
31
|
|
|
32
|
+
var ObservableImpl__default = /*#__PURE__*/_interopDefaultLegacy(ObservableImpl);
|
|
31
33
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
32
34
|
var qs__default = /*#__PURE__*/_interopDefaultLegacy(qs);
|
|
33
35
|
var jwtDecoder__default = /*#__PURE__*/_interopDefaultLegacy(jwtDecoder);
|
|
@@ -37,8 +39,8 @@ var ExpandMoreIcon__default = /*#__PURE__*/_interopDefaultLegacy(ExpandMoreIcon)
|
|
|
37
39
|
var Clear__default = /*#__PURE__*/_interopDefaultLegacy(Clear);
|
|
38
40
|
var Search__default = /*#__PURE__*/_interopDefaultLegacy(Search);
|
|
39
41
|
var capitalize__default = /*#__PURE__*/_interopDefaultLegacy(capitalize);
|
|
40
|
-
var StarBorder__default = /*#__PURE__*/_interopDefaultLegacy(StarBorder);
|
|
41
42
|
var Star__default = /*#__PURE__*/_interopDefaultLegacy(Star);
|
|
43
|
+
var StarBorder__default = /*#__PURE__*/_interopDefaultLegacy(StarBorder);
|
|
42
44
|
var Alert__default = /*#__PURE__*/_interopDefaultLegacy(Alert);
|
|
43
45
|
var SettingsIcon__default = /*#__PURE__*/_interopDefaultLegacy(SettingsIcon);
|
|
44
46
|
|
|
@@ -46,6 +48,69 @@ const catalogApiRef = corePluginApi.createApiRef({
|
|
|
46
48
|
id: "plugin.catalog.service"
|
|
47
49
|
});
|
|
48
50
|
|
|
51
|
+
async function performMigrationToTheNewBucket({
|
|
52
|
+
storageApi
|
|
53
|
+
}) {
|
|
54
|
+
var _a;
|
|
55
|
+
const source = storageApi.forBucket("settings");
|
|
56
|
+
const target = storageApi.forBucket("starredEntities");
|
|
57
|
+
const oldStarredEntities = source.get("starredEntities");
|
|
58
|
+
if (!lodash.isArray(oldStarredEntities)) {
|
|
59
|
+
return;
|
|
60
|
+
}
|
|
61
|
+
const targetEntities = new Set((_a = target.get("entityRefs")) != null ? _a : []);
|
|
62
|
+
oldStarredEntities.filter(lodash.isString).map((old) => old.split(":")).filter((split) => split.length === 4 && split[0] === "entity").map(([_, kind, namespace, name]) => catalogModel.stringifyEntityRef({kind, namespace, name})).forEach((e) => targetEntities.add(e));
|
|
63
|
+
await target.set("entityRefs", Array.from(targetEntities));
|
|
64
|
+
await source.remove("starredEntities");
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
class DefaultStarredEntitiesApi {
|
|
68
|
+
constructor(opts) {
|
|
69
|
+
this.subscribers = new Set();
|
|
70
|
+
this.observable = new ObservableImpl__default['default']((subscriber) => {
|
|
71
|
+
subscriber.next(this.starredEntities);
|
|
72
|
+
this.subscribers.add(subscriber);
|
|
73
|
+
return () => {
|
|
74
|
+
this.subscribers.delete(subscriber);
|
|
75
|
+
};
|
|
76
|
+
});
|
|
77
|
+
var _a;
|
|
78
|
+
performMigrationToTheNewBucket(opts).then();
|
|
79
|
+
this.settingsStore = opts.storageApi.forBucket("starredEntities");
|
|
80
|
+
this.starredEntities = new Set((_a = this.settingsStore.get("entityRefs")) != null ? _a : []);
|
|
81
|
+
this.settingsStore.observe$("entityRefs").subscribe({
|
|
82
|
+
next: (next) => {
|
|
83
|
+
var _a2;
|
|
84
|
+
this.starredEntities = new Set((_a2 = next.newValue) != null ? _a2 : []);
|
|
85
|
+
this.notifyChanges();
|
|
86
|
+
}
|
|
87
|
+
});
|
|
88
|
+
}
|
|
89
|
+
async toggleStarred(entityRef) {
|
|
90
|
+
if (this.starredEntities.has(entityRef)) {
|
|
91
|
+
this.starredEntities.delete(entityRef);
|
|
92
|
+
} else {
|
|
93
|
+
this.starredEntities.add(entityRef);
|
|
94
|
+
}
|
|
95
|
+
await this.settingsStore.set("entityRefs", Array.from(this.starredEntities));
|
|
96
|
+
}
|
|
97
|
+
starredEntitie$() {
|
|
98
|
+
return this.observable;
|
|
99
|
+
}
|
|
100
|
+
isStarred(entityRef) {
|
|
101
|
+
return this.starredEntities.has(entityRef);
|
|
102
|
+
}
|
|
103
|
+
notifyChanges() {
|
|
104
|
+
for (const subscription of this.subscribers) {
|
|
105
|
+
subscription.next(this.starredEntities);
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
const starredEntitiesApiRef = corePluginApi.createApiRef({
|
|
111
|
+
id: "catalog-react.starred-entities"
|
|
112
|
+
});
|
|
113
|
+
|
|
49
114
|
const NoIcon = () => null;
|
|
50
115
|
const rootRoute = corePluginApi.createRouteRef({
|
|
51
116
|
icon: NoIcon,
|
|
@@ -63,8 +128,8 @@ const entityRouteRef = entityRoute;
|
|
|
63
128
|
function entityRouteParams(entity) {
|
|
64
129
|
var _a, _b;
|
|
65
130
|
return {
|
|
66
|
-
kind: entity.kind.
|
|
67
|
-
namespace: (_b = (_a = entity.metadata.namespace) == null ? void 0 : _a.
|
|
131
|
+
kind: entity.kind.toLocaleLowerCase("en-US"),
|
|
132
|
+
namespace: (_b = (_a = entity.metadata.namespace) == null ? void 0 : _a.toLocaleLowerCase("en-US")) != null ? _b : catalogModel.ENTITY_DEFAULT_NAMESPACE,
|
|
68
133
|
name: entity.metadata.name
|
|
69
134
|
};
|
|
70
135
|
}
|
|
@@ -177,7 +242,7 @@ function getEntityRelations(entity, relationType, filter) {
|
|
|
177
242
|
var _a, _b;
|
|
178
243
|
let entityNames = ((_b = (_a = entity == null ? void 0 : entity.relations) == null ? void 0 : _a.filter((r) => r.type === relationType)) == null ? void 0 : _b.map((r) => r.target)) || [];
|
|
179
244
|
if (filter == null ? void 0 : filter.kind) {
|
|
180
|
-
entityNames = entityNames == null ? void 0 : entityNames.filter((e) => e.kind.
|
|
245
|
+
entityNames = entityNames == null ? void 0 : entityNames.filter((e) => e.kind.toLocaleLowerCase("en-US") === filter.kind.toLocaleLowerCase("en-US"));
|
|
181
246
|
}
|
|
182
247
|
return entityNames;
|
|
183
248
|
}
|
|
@@ -317,9 +382,9 @@ function formatEntityRefTitle(entityRef, opts) {
|
|
|
317
382
|
if (namespace === catalogModel.ENTITY_DEFAULT_NAMESPACE) {
|
|
318
383
|
namespace = void 0;
|
|
319
384
|
}
|
|
320
|
-
kind = kind.
|
|
385
|
+
kind = kind.toLocaleLowerCase("en-US");
|
|
321
386
|
return `${catalogModel.serializeEntityRef({
|
|
322
|
-
kind: defaultKind && defaultKind.
|
|
387
|
+
kind: defaultKind && defaultKind.toLocaleLowerCase("en-US") === kind ? void 0 : kind,
|
|
323
388
|
name,
|
|
324
389
|
namespace
|
|
325
390
|
})}`;
|
|
@@ -327,7 +392,8 @@ function formatEntityRefTitle(entityRef, opts) {
|
|
|
327
392
|
|
|
328
393
|
const EntityRefLink = React.forwardRef((props, ref) => {
|
|
329
394
|
var _a;
|
|
330
|
-
const {entityRef, defaultKind, children, ...linkProps} = props;
|
|
395
|
+
const {entityRef, defaultKind, title, children, ...linkProps} = props;
|
|
396
|
+
const entityRoute = corePluginApi.useRouteRef(entityRouteRef);
|
|
331
397
|
let kind;
|
|
332
398
|
let namespace;
|
|
333
399
|
let name;
|
|
@@ -346,11 +412,17 @@ const EntityRefLink = React.forwardRef((props, ref) => {
|
|
|
346
412
|
namespace: (_a = namespace == null ? void 0 : namespace.toLocaleLowerCase("en-US")) != null ? _a : catalogModel.ENTITY_DEFAULT_NAMESPACE,
|
|
347
413
|
name
|
|
348
414
|
};
|
|
349
|
-
|
|
415
|
+
const formattedEntityRefTitle = formatEntityRefTitle(entityRef, {
|
|
416
|
+
defaultKind
|
|
417
|
+
});
|
|
418
|
+
const link = /* @__PURE__ */ React__default['default'].createElement(coreComponents.Link, {
|
|
350
419
|
...linkProps,
|
|
351
420
|
ref,
|
|
352
|
-
to:
|
|
353
|
-
}, children, !children &&
|
|
421
|
+
to: entityRoute(routeParams)
|
|
422
|
+
}, children, !children && (title != null ? title : formattedEntityRefTitle));
|
|
423
|
+
return title ? /* @__PURE__ */ React__default['default'].createElement(core.Tooltip, {
|
|
424
|
+
title: formattedEntityRefTitle
|
|
425
|
+
}, link) : link;
|
|
354
426
|
});
|
|
355
427
|
|
|
356
428
|
const EntityRefLinks = ({
|
|
@@ -556,12 +628,12 @@ function useRelatedEntities(entity, {type, kind}) {
|
|
|
556
628
|
value: entities,
|
|
557
629
|
error
|
|
558
630
|
} = reactUse.useAsync(async () => {
|
|
559
|
-
const relations = entity.relations && entity.relations.filter((r) => (!type || r.type.
|
|
631
|
+
const relations = entity.relations && entity.relations.filter((r) => (!type || r.type.toLocaleLowerCase("en-US") === type.toLocaleLowerCase("en-US")) && (!kind || r.target.kind.toLocaleLowerCase("en-US") === kind.toLocaleLowerCase("en-US")));
|
|
560
632
|
if (!relations) {
|
|
561
633
|
return [];
|
|
562
634
|
}
|
|
563
635
|
const relationsByKindAndNamespace = Object.values(lodash.groupBy(relations, ({target}) => {
|
|
564
|
-
return `${target.kind}:${target.namespace}`.
|
|
636
|
+
return `${target.kind}:${target.namespace}`.toLocaleLowerCase("en-US");
|
|
565
637
|
}));
|
|
566
638
|
const batchedRelationsByKindAndNamespace = [];
|
|
567
639
|
for (const rs of relationsByKindAndNamespace) {
|
|
@@ -591,43 +663,43 @@ function useRelatedEntities(entity, {type, kind}) {
|
|
|
591
663
|
};
|
|
592
664
|
}
|
|
593
665
|
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
const
|
|
599
|
-
|
|
600
|
-
const
|
|
601
|
-
const
|
|
602
|
-
const rawStarredEntityKeys = (_a = settingsStore.get("starredEntities")) != null ? _a : [];
|
|
603
|
-
const [starredEntities, setStarredEntities] = React.useState(new Set(rawStarredEntityKeys));
|
|
604
|
-
const observedItems = reactUse.useObservable(settingsStore.observe$("starredEntities"));
|
|
605
|
-
React.useEffect(() => {
|
|
606
|
-
var _a2;
|
|
607
|
-
if (observedItems == null ? void 0 : observedItems.newValue) {
|
|
608
|
-
const currentValue = (_a2 = observedItems == null ? void 0 : observedItems.newValue) != null ? _a2 : [];
|
|
609
|
-
setStarredEntities(new Set(currentValue));
|
|
610
|
-
}
|
|
611
|
-
}, [observedItems == null ? void 0 : observedItems.newValue]);
|
|
612
|
-
const toggleStarredEntity = React.useCallback((entity) => {
|
|
613
|
-
const entityKey = buildEntityKey(entity);
|
|
614
|
-
if (starredEntities.has(entityKey)) {
|
|
615
|
-
starredEntities.delete(entityKey);
|
|
616
|
-
} else {
|
|
617
|
-
starredEntities.add(entityKey);
|
|
618
|
-
}
|
|
619
|
-
settingsStore.set("starredEntities", Array.from(starredEntities));
|
|
620
|
-
}, [starredEntities, settingsStore]);
|
|
621
|
-
const isStarredEntity = React.useCallback((entity) => {
|
|
622
|
-
const entityKey = buildEntityKey(entity);
|
|
623
|
-
return starredEntities.has(entityKey);
|
|
624
|
-
}, [starredEntities]);
|
|
666
|
+
function getEntityRef$1(entityOrRef) {
|
|
667
|
+
return typeof entityOrRef === "string" ? entityOrRef : catalogModel.stringifyEntityRef(entityOrRef);
|
|
668
|
+
}
|
|
669
|
+
function useStarredEntities() {
|
|
670
|
+
const starredEntitiesApi = corePluginApi.useApi(starredEntitiesApiRef);
|
|
671
|
+
const starredEntities = reactUse.useObservable(starredEntitiesApi.starredEntitie$(), new Set());
|
|
672
|
+
const isStarredEntity = React.useCallback((entityOrRef) => starredEntities.has(getEntityRef$1(entityOrRef)), [starredEntities]);
|
|
673
|
+
const toggleStarredEntity = React.useCallback((entityOrRef) => starredEntitiesApi.toggleStarred(getEntityRef$1(entityOrRef)).then(), [starredEntitiesApi]);
|
|
625
674
|
return {
|
|
626
675
|
starredEntities,
|
|
627
676
|
toggleStarredEntity,
|
|
628
677
|
isStarredEntity
|
|
629
678
|
};
|
|
630
|
-
}
|
|
679
|
+
}
|
|
680
|
+
|
|
681
|
+
function getEntityRef(entityOrRef) {
|
|
682
|
+
return typeof entityOrRef === "string" ? entityOrRef : catalogModel.stringifyEntityRef(entityOrRef);
|
|
683
|
+
}
|
|
684
|
+
function useStarredEntity(entityOrRef) {
|
|
685
|
+
const starredEntitiesApi = corePluginApi.useApi(starredEntitiesApiRef);
|
|
686
|
+
const [isStarredEntity, setIsStarredEntity] = React.useState(false);
|
|
687
|
+
React.useEffect(() => {
|
|
688
|
+
const subscription = starredEntitiesApi.starredEntitie$().subscribe({
|
|
689
|
+
next(starredEntities) {
|
|
690
|
+
setIsStarredEntity(starredEntities.has(getEntityRef(entityOrRef)));
|
|
691
|
+
}
|
|
692
|
+
});
|
|
693
|
+
return () => {
|
|
694
|
+
subscription.unsubscribe();
|
|
695
|
+
};
|
|
696
|
+
}, [entityOrRef, starredEntitiesApi]);
|
|
697
|
+
const toggleStarredEntity = React.useCallback(() => starredEntitiesApi.toggleStarred(getEntityRef(entityOrRef)).then(), [entityOrRef, starredEntitiesApi]);
|
|
698
|
+
return {
|
|
699
|
+
toggleStarredEntity,
|
|
700
|
+
isStarredEntity
|
|
701
|
+
};
|
|
702
|
+
}
|
|
631
703
|
|
|
632
704
|
function extendUserId(id) {
|
|
633
705
|
try {
|
|
@@ -716,6 +788,11 @@ const EntityKindPicker = ({
|
|
|
716
788
|
}, "Kind filter not yet available");
|
|
717
789
|
};
|
|
718
790
|
|
|
791
|
+
const useStyles$6 = core.makeStyles({
|
|
792
|
+
input: {}
|
|
793
|
+
}, {
|
|
794
|
+
name: "CatalogReactEntityLifecyclePicker"
|
|
795
|
+
});
|
|
719
796
|
const icon$2 = /* @__PURE__ */ React__default['default'].createElement(CheckBoxOutlineBlankIcon__default['default'], {
|
|
720
797
|
fontSize: "small"
|
|
721
798
|
});
|
|
@@ -724,6 +801,7 @@ const checkedIcon$2 = /* @__PURE__ */ React__default['default'].createElement(Ch
|
|
|
724
801
|
});
|
|
725
802
|
const EntityLifecyclePicker = () => {
|
|
726
803
|
var _a, _b;
|
|
804
|
+
const classes = useStyles$6();
|
|
727
805
|
const {updateFilters, backendEntities, filters, queryParameters} = useEntityListProvider();
|
|
728
806
|
const queryParamLifecycles = [queryParameters.lifecycles].flat().filter(Boolean);
|
|
729
807
|
const [selectedLifecycles, setSelectedLifecycles] = React.useState(queryParamLifecycles.length ? queryParamLifecycles : (_b = (_a = filters.lifecycles) == null ? void 0 : _a.values) != null ? _b : []);
|
|
@@ -765,11 +843,17 @@ const EntityLifecyclePicker = () => {
|
|
|
765
843
|
}),
|
|
766
844
|
renderInput: (params) => /* @__PURE__ */ React__default['default'].createElement(core.TextField, {
|
|
767
845
|
...params,
|
|
846
|
+
className: classes.input,
|
|
768
847
|
variant: "outlined"
|
|
769
848
|
})
|
|
770
849
|
}));
|
|
771
850
|
};
|
|
772
851
|
|
|
852
|
+
const useStyles$5 = core.makeStyles({
|
|
853
|
+
input: {}
|
|
854
|
+
}, {
|
|
855
|
+
name: "CatalogReactEntityOwnerPicker"
|
|
856
|
+
});
|
|
773
857
|
const icon$1 = /* @__PURE__ */ React__default['default'].createElement(CheckBoxOutlineBlankIcon__default['default'], {
|
|
774
858
|
fontSize: "small"
|
|
775
859
|
});
|
|
@@ -778,6 +862,7 @@ const checkedIcon$1 = /* @__PURE__ */ React__default['default'].createElement(Ch
|
|
|
778
862
|
});
|
|
779
863
|
const EntityOwnerPicker = () => {
|
|
780
864
|
var _a, _b;
|
|
865
|
+
const classes = useStyles$5();
|
|
781
866
|
const {updateFilters, backendEntities, filters, queryParameters} = useEntityListProvider();
|
|
782
867
|
const queryParamOwners = [queryParameters.owners].flat().filter(Boolean);
|
|
783
868
|
const [selectedOwners, setSelectedOwners] = React.useState(queryParamOwners.length ? queryParamOwners : (_b = (_a = filters.owners) == null ? void 0 : _a.values) != null ? _b : []);
|
|
@@ -816,20 +901,24 @@ const EntityOwnerPicker = () => {
|
|
|
816
901
|
}),
|
|
817
902
|
renderInput: (params) => /* @__PURE__ */ React__default['default'].createElement(core.TextField, {
|
|
818
903
|
...params,
|
|
904
|
+
className: classes.input,
|
|
819
905
|
variant: "outlined"
|
|
820
906
|
})
|
|
821
907
|
}));
|
|
822
908
|
};
|
|
823
909
|
|
|
824
|
-
const useStyles$
|
|
910
|
+
const useStyles$4 = core.makeStyles((_theme) => ({
|
|
825
911
|
searchToolbar: {
|
|
826
912
|
paddingLeft: 0,
|
|
827
913
|
paddingRight: 0
|
|
828
|
-
}
|
|
829
|
-
}
|
|
914
|
+
},
|
|
915
|
+
input: {}
|
|
916
|
+
}), {
|
|
917
|
+
name: "CatalogReactEntitySearchBar"
|
|
918
|
+
});
|
|
830
919
|
const EntitySearchBar = () => {
|
|
831
920
|
var _a, _b;
|
|
832
|
-
const
|
|
921
|
+
const classes = useStyles$4();
|
|
833
922
|
const {filters, updateFilters} = useEntityListProvider();
|
|
834
923
|
const [search, setSearch] = React.useState((_b = (_a = filters.text) == null ? void 0 : _a.value) != null ? _b : "");
|
|
835
924
|
reactUse.useDebounce(() => {
|
|
@@ -838,9 +927,10 @@ const EntitySearchBar = () => {
|
|
|
838
927
|
});
|
|
839
928
|
}, 250, [search, updateFilters]);
|
|
840
929
|
return /* @__PURE__ */ React__default['default'].createElement(core.Toolbar, {
|
|
841
|
-
className:
|
|
930
|
+
className: classes.searchToolbar
|
|
842
931
|
}, /* @__PURE__ */ React__default['default'].createElement(core.FormControl, null, /* @__PURE__ */ React__default['default'].createElement(core.Input, {
|
|
843
932
|
id: "input-with-icon-adornment",
|
|
933
|
+
className: classes.input,
|
|
844
934
|
placeholder: "Search",
|
|
845
935
|
autoComplete: "off",
|
|
846
936
|
onChange: (event) => setSearch(event.target.value),
|
|
@@ -863,7 +953,8 @@ function createEntityRefColumn({
|
|
|
863
953
|
defaultKind
|
|
864
954
|
}) {
|
|
865
955
|
function formatContent(entity) {
|
|
866
|
-
|
|
956
|
+
var _a;
|
|
957
|
+
return ((_a = entity.metadata) == null ? void 0 : _a.title) || formatEntityRefTitle(entity, {
|
|
867
958
|
defaultKind
|
|
868
959
|
});
|
|
869
960
|
}
|
|
@@ -876,10 +967,14 @@ function createEntityRefColumn({
|
|
|
876
967
|
customSort(entity1, entity2) {
|
|
877
968
|
return formatContent(entity1).localeCompare(formatContent(entity2));
|
|
878
969
|
},
|
|
879
|
-
render: (entity) =>
|
|
880
|
-
|
|
881
|
-
|
|
882
|
-
|
|
970
|
+
render: (entity) => {
|
|
971
|
+
var _a;
|
|
972
|
+
return /* @__PURE__ */ React__default['default'].createElement(EntityRefLink, {
|
|
973
|
+
entityRef: entity,
|
|
974
|
+
defaultKind,
|
|
975
|
+
title: (_a = entity.metadata) == null ? void 0 : _a.title
|
|
976
|
+
});
|
|
977
|
+
}
|
|
883
978
|
};
|
|
884
979
|
}
|
|
885
980
|
function createEntityRelationColumn({
|
|
@@ -943,7 +1038,8 @@ function createMetadataDescriptionColumn() {
|
|
|
943
1038
|
field: "metadata.description",
|
|
944
1039
|
render: (entity) => /* @__PURE__ */ React__default['default'].createElement(coreComponents.OverflowTooltip, {
|
|
945
1040
|
text: entity.metadata.description,
|
|
946
|
-
placement: "bottom-start"
|
|
1041
|
+
placement: "bottom-start",
|
|
1042
|
+
line: 2
|
|
947
1043
|
}),
|
|
948
1044
|
width: "auto"
|
|
949
1045
|
};
|
|
@@ -988,7 +1084,7 @@ const componentEntityColumns = [
|
|
|
988
1084
|
createMetadataDescriptionColumn()
|
|
989
1085
|
];
|
|
990
1086
|
|
|
991
|
-
const useStyles$
|
|
1087
|
+
const useStyles$3 = core.makeStyles((theme) => ({
|
|
992
1088
|
empty: {
|
|
993
1089
|
padding: theme.spacing(2),
|
|
994
1090
|
display: "flex",
|
|
@@ -1002,7 +1098,7 @@ function EntityTable({
|
|
|
1002
1098
|
variant = "gridItem",
|
|
1003
1099
|
columns
|
|
1004
1100
|
}) {
|
|
1005
|
-
const classes = useStyles$
|
|
1101
|
+
const classes = useStyles$3();
|
|
1006
1102
|
const tableStyle = {
|
|
1007
1103
|
minWidth: "0",
|
|
1008
1104
|
width: "100%"
|
|
@@ -1030,6 +1126,11 @@ EntityTable.columns = columnFactories;
|
|
|
1030
1126
|
EntityTable.systemEntityColumns = systemEntityColumns;
|
|
1031
1127
|
EntityTable.componentEntityColumns = componentEntityColumns;
|
|
1032
1128
|
|
|
1129
|
+
const useStyles$2 = core.makeStyles({
|
|
1130
|
+
input: {}
|
|
1131
|
+
}, {
|
|
1132
|
+
name: "CatalogReactEntityTagPicker"
|
|
1133
|
+
});
|
|
1033
1134
|
const icon = /* @__PURE__ */ React__default['default'].createElement(CheckBoxOutlineBlankIcon__default['default'], {
|
|
1034
1135
|
fontSize: "small"
|
|
1035
1136
|
});
|
|
@@ -1038,6 +1139,7 @@ const checkedIcon = /* @__PURE__ */ React__default['default'].createElement(Chec
|
|
|
1038
1139
|
});
|
|
1039
1140
|
const EntityTagPicker = () => {
|
|
1040
1141
|
var _a, _b;
|
|
1142
|
+
const classes = useStyles$2();
|
|
1041
1143
|
const {updateFilters, backendEntities, filters, queryParameters} = useEntityListProvider();
|
|
1042
1144
|
const queryParamTags = [queryParameters.tags].flat().filter(Boolean);
|
|
1043
1145
|
const [selectedTags, setSelectedTags] = React.useState(queryParamTags.length ? queryParamTags : (_b = (_a = filters.tags) == null ? void 0 : _a.values) != null ? _b : []);
|
|
@@ -1076,6 +1178,7 @@ const EntityTagPicker = () => {
|
|
|
1076
1178
|
}),
|
|
1077
1179
|
renderInput: (params) => /* @__PURE__ */ React__default['default'].createElement(core.TextField, {
|
|
1078
1180
|
...params,
|
|
1181
|
+
className: classes.input,
|
|
1079
1182
|
variant: "outlined"
|
|
1080
1183
|
})
|
|
1081
1184
|
}));
|
|
@@ -1121,15 +1224,14 @@ const YellowStar = core.withStyles({
|
|
|
1121
1224
|
const favoriteEntityTooltip = (isStarred) => isStarred ? "Remove from favorites" : "Add to favorites";
|
|
1122
1225
|
const favoriteEntityIcon = (isStarred) => isStarred ? /* @__PURE__ */ React__default['default'].createElement(YellowStar, null) : /* @__PURE__ */ React__default['default'].createElement(StarBorder__default['default'], null);
|
|
1123
1226
|
const FavoriteEntity = (props) => {
|
|
1124
|
-
const {toggleStarredEntity, isStarredEntity} =
|
|
1125
|
-
const isStarred = isStarredEntity(props.entity);
|
|
1227
|
+
const {toggleStarredEntity, isStarredEntity} = useStarredEntity(props.entity);
|
|
1126
1228
|
return /* @__PURE__ */ React__default['default'].createElement(core.IconButton, {
|
|
1127
1229
|
color: "inherit",
|
|
1128
1230
|
...props,
|
|
1129
|
-
onClick: () => toggleStarredEntity(
|
|
1231
|
+
onClick: () => toggleStarredEntity()
|
|
1130
1232
|
}, /* @__PURE__ */ React__default['default'].createElement(core.Tooltip, {
|
|
1131
|
-
title: favoriteEntityTooltip(
|
|
1132
|
-
}, favoriteEntityIcon(
|
|
1233
|
+
title: favoriteEntityTooltip(isStarredEntity)
|
|
1234
|
+
}, favoriteEntityIcon(isStarredEntity)));
|
|
1133
1235
|
};
|
|
1134
1236
|
|
|
1135
1237
|
function useUnregisterEntityDialogState(entity) {
|
|
@@ -1346,7 +1448,9 @@ const useStyles = core.makeStyles((theme) => ({
|
|
|
1346
1448
|
groupWrapper: {
|
|
1347
1449
|
margin: theme.spacing(1, 1, 2, 1)
|
|
1348
1450
|
}
|
|
1349
|
-
})
|
|
1451
|
+
}), {
|
|
1452
|
+
name: "CatalogReactUserListPicker"
|
|
1453
|
+
});
|
|
1350
1454
|
function getFilterGroups(orgName) {
|
|
1351
1455
|
return [
|
|
1352
1456
|
{
|
|
@@ -1478,6 +1582,7 @@ Object.defineProperty(exports, 'CATALOG_FILTER_EXISTS', {
|
|
|
1478
1582
|
}
|
|
1479
1583
|
});
|
|
1480
1584
|
exports.AsyncEntityProvider = AsyncEntityProvider;
|
|
1585
|
+
exports.DefaultStarredEntitiesApi = DefaultStarredEntitiesApi;
|
|
1481
1586
|
exports.EntityContext = EntityContext;
|
|
1482
1587
|
exports.EntityKindFilter = EntityKindFilter;
|
|
1483
1588
|
exports.EntityKindPicker = EntityKindPicker;
|
|
@@ -1518,6 +1623,7 @@ exports.isOwnerOf = isOwnerOf;
|
|
|
1518
1623
|
exports.reduceCatalogFilters = reduceCatalogFilters;
|
|
1519
1624
|
exports.reduceEntityFilters = reduceEntityFilters;
|
|
1520
1625
|
exports.rootRoute = rootRoute;
|
|
1626
|
+
exports.starredEntitiesApiRef = starredEntitiesApiRef;
|
|
1521
1627
|
exports.useEntity = useEntity;
|
|
1522
1628
|
exports.useEntityCompoundName = useEntityCompoundName;
|
|
1523
1629
|
exports.useEntityFromUrl = useEntityFromUrl;
|
|
@@ -1528,4 +1634,5 @@ exports.useEntityTypeFilter = useEntityTypeFilter;
|
|
|
1528
1634
|
exports.useOwnUser = useOwnUser;
|
|
1529
1635
|
exports.useRelatedEntities = useRelatedEntities;
|
|
1530
1636
|
exports.useStarredEntities = useStarredEntities;
|
|
1637
|
+
exports.useStarredEntity = useStarredEntity;
|
|
1531
1638
|
//# sourceMappingURL=index.cjs.js.map
|