@backstage/plugin-catalog-react 0.6.6 → 0.6.10
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 +40 -0
- package/dist/index.cjs.js +61 -19
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.d.ts +43 -3
- package/dist/index.esm.js +42 -8
- package/dist/index.esm.js.map +1 -1
- package/package.json +10 -10
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,45 @@
|
|
|
1
1
|
# @backstage/plugin-catalog-react
|
|
2
2
|
|
|
3
|
+
## 0.6.10
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- fe2a6532ff: Add Override Components for Components in @backstage/plugin-catalog-react
|
|
8
|
+
- 4ce51ab0f1: Internal refactor of the `react-use` imports to use `react-use/lib/*` instead.
|
|
9
|
+
- Updated dependencies
|
|
10
|
+
- @backstage/core-plugin-api@0.4.1
|
|
11
|
+
- @backstage/core-components@0.8.3
|
|
12
|
+
|
|
13
|
+
## 0.6.9
|
|
14
|
+
|
|
15
|
+
### Patch Changes
|
|
16
|
+
|
|
17
|
+
- c6fdddec77: When a user has zero owned entities when viewing an entity kind in the catalog
|
|
18
|
+
page, it will be automatically redirected to see all the entities. Furthermore,
|
|
19
|
+
for the kind User and Group there are no longer the owned selector.
|
|
20
|
+
- Updated dependencies
|
|
21
|
+
- @backstage/integration@0.7.0
|
|
22
|
+
|
|
23
|
+
## 0.6.8
|
|
24
|
+
|
|
25
|
+
### Patch Changes
|
|
26
|
+
|
|
27
|
+
- 3491a36ab9: added useOwnedEntities hook to get the list of entities of the logged-in user
|
|
28
|
+
- Updated dependencies
|
|
29
|
+
- @backstage/core-plugin-api@0.4.0
|
|
30
|
+
- @backstage/core-components@0.8.2
|
|
31
|
+
- @backstage/catalog-client@0.5.3
|
|
32
|
+
|
|
33
|
+
## 0.6.7
|
|
34
|
+
|
|
35
|
+
### Patch Changes
|
|
36
|
+
|
|
37
|
+
- 6156fb8730: `useEntityTypeFilter`: Skip updating selected types if a kind filter change did not change them.
|
|
38
|
+
- Updated dependencies
|
|
39
|
+
- @backstage/core-plugin-api@0.3.1
|
|
40
|
+
- @backstage/core-components@0.8.1
|
|
41
|
+
- @backstage/catalog-model@0.9.8
|
|
42
|
+
|
|
3
43
|
## 0.6.6
|
|
4
44
|
|
|
5
45
|
### Patch Changes
|
package/dist/index.cjs.js
CHANGED
|
@@ -11,10 +11,16 @@ var React = require('react');
|
|
|
11
11
|
var lab = require('@material-ui/lab');
|
|
12
12
|
var versionBridge = require('@backstage/version-bridge');
|
|
13
13
|
var reactRouter = require('react-router');
|
|
14
|
-
var
|
|
14
|
+
var useAsyncRetry = require('react-use/lib/useAsyncRetry');
|
|
15
15
|
var qs = require('qs');
|
|
16
|
+
var useAsyncFn = require('react-use/lib/useAsyncFn');
|
|
17
|
+
var useDebounce = require('react-use/lib/useDebounce');
|
|
18
|
+
var useMountedState = require('react-use/lib/useMountedState');
|
|
19
|
+
var useAsync = require('react-use/lib/useAsync');
|
|
20
|
+
var isEqual = require('lodash/isEqual');
|
|
16
21
|
var coreComponents = require('@backstage/core-components');
|
|
17
22
|
var core = require('@material-ui/core');
|
|
23
|
+
var useObservable = require('react-use/lib/useObservable');
|
|
18
24
|
var jwtDecoder = require('jwt-decode');
|
|
19
25
|
var CheckBoxIcon = require('@material-ui/icons/CheckBox');
|
|
20
26
|
var CheckBoxOutlineBlankIcon = require('@material-ui/icons/CheckBoxOutlineBlank');
|
|
@@ -32,7 +38,14 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
32
38
|
|
|
33
39
|
var ObservableImpl__default = /*#__PURE__*/_interopDefaultLegacy(ObservableImpl);
|
|
34
40
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
41
|
+
var useAsyncRetry__default = /*#__PURE__*/_interopDefaultLegacy(useAsyncRetry);
|
|
35
42
|
var qs__default = /*#__PURE__*/_interopDefaultLegacy(qs);
|
|
43
|
+
var useAsyncFn__default = /*#__PURE__*/_interopDefaultLegacy(useAsyncFn);
|
|
44
|
+
var useDebounce__default = /*#__PURE__*/_interopDefaultLegacy(useDebounce);
|
|
45
|
+
var useMountedState__default = /*#__PURE__*/_interopDefaultLegacy(useMountedState);
|
|
46
|
+
var useAsync__default = /*#__PURE__*/_interopDefaultLegacy(useAsync);
|
|
47
|
+
var isEqual__default = /*#__PURE__*/_interopDefaultLegacy(isEqual);
|
|
48
|
+
var useObservable__default = /*#__PURE__*/_interopDefaultLegacy(useObservable);
|
|
36
49
|
var jwtDecoder__default = /*#__PURE__*/_interopDefaultLegacy(jwtDecoder);
|
|
37
50
|
var CheckBoxIcon__default = /*#__PURE__*/_interopDefaultLegacy(CheckBoxIcon);
|
|
38
51
|
var CheckBoxOutlineBlankIcon__default = /*#__PURE__*/_interopDefaultLegacy(CheckBoxOutlineBlankIcon);
|
|
@@ -185,7 +198,7 @@ const useEntityFromUrl = () => {
|
|
|
185
198
|
error,
|
|
186
199
|
loading,
|
|
187
200
|
retry: refresh
|
|
188
|
-
} =
|
|
201
|
+
} = useAsyncRetry__default["default"](() => catalogApi.getEntityByName({ kind, namespace, name }), [catalogApi, kind, namespace, name]);
|
|
189
202
|
React.useEffect(() => {
|
|
190
203
|
if (!name) {
|
|
191
204
|
errorApi.post(new Error("No name provided!"));
|
|
@@ -279,7 +292,7 @@ const EntityListContext = React.createContext(void 0);
|
|
|
279
292
|
const EntityListProvider = ({
|
|
280
293
|
children
|
|
281
294
|
}) => {
|
|
282
|
-
const isMounted =
|
|
295
|
+
const isMounted = useMountedState__default["default"]();
|
|
283
296
|
const catalogApi = corePluginApi.useApi(catalogApiRef);
|
|
284
297
|
const [requestedFilters, setRequestedFilters] = React.useState({});
|
|
285
298
|
const [outputState, setOutputState] = React.useState(() => {
|
|
@@ -294,7 +307,7 @@ const EntityListProvider = ({
|
|
|
294
307
|
queryParameters: (_a = query.filters) != null ? _a : {}
|
|
295
308
|
};
|
|
296
309
|
});
|
|
297
|
-
const [{ loading, error }, refresh] =
|
|
310
|
+
const [{ loading, error }, refresh] = useAsyncFn__default["default"](async () => {
|
|
298
311
|
var _a;
|
|
299
312
|
const compacted = lodash.compact(Object.values(requestedFilters));
|
|
300
313
|
const entityFilter = reduceEntityFilters(compacted);
|
|
@@ -334,7 +347,7 @@ const EntityListProvider = ({
|
|
|
334
347
|
(_a = window.history) == null ? void 0 : _a.replaceState(null, document.title, newUrl);
|
|
335
348
|
}
|
|
336
349
|
}, [catalogApi, requestedFilters, outputState], { loading: true });
|
|
337
|
-
|
|
350
|
+
useDebounce__default["default"](refresh, 10, [requestedFilters]);
|
|
338
351
|
const updateFilters = React.useCallback((update) => {
|
|
339
352
|
setRequestedFilters((prevFilters) => {
|
|
340
353
|
const newFilters = typeof update === "function" ? update(prevFilters) : update;
|
|
@@ -544,7 +557,7 @@ function useEntityTypeFilter() {
|
|
|
544
557
|
error,
|
|
545
558
|
loading,
|
|
546
559
|
value: entities
|
|
547
|
-
} =
|
|
560
|
+
} = useAsync__default["default"](async () => {
|
|
548
561
|
if (kind) {
|
|
549
562
|
const items = await catalogApi.getEntities({
|
|
550
563
|
filter: { kind },
|
|
@@ -577,7 +590,9 @@ function useEntityTypeFilter() {
|
|
|
577
590
|
const newTypes = Object.entries(countByType).sort(([, count1], [, count2]) => count2 - count1).map(([type]) => type);
|
|
578
591
|
setAvailableTypes(newTypes);
|
|
579
592
|
const stillValidTypes = selectedTypes.filter((value) => newTypes.includes(value));
|
|
580
|
-
|
|
593
|
+
if (!isEqual__default["default"](selectedTypes, stillValidTypes)) {
|
|
594
|
+
setSelectedTypes(stillValidTypes);
|
|
595
|
+
}
|
|
581
596
|
}, [loading, kind, selectedTypes, setSelectedTypes, entities]);
|
|
582
597
|
React.useEffect(() => {
|
|
583
598
|
updateFilters({
|
|
@@ -599,7 +614,7 @@ function useEntityKinds() {
|
|
|
599
614
|
error,
|
|
600
615
|
loading,
|
|
601
616
|
value: kinds
|
|
602
|
-
} =
|
|
617
|
+
} = useAsync__default["default"](async () => {
|
|
603
618
|
const entities = await catalogApi.getEntities({ fields: ["kind"] }).then((response) => response.items);
|
|
604
619
|
return [...new Set(entities.map((e) => e.kind))].sort();
|
|
605
620
|
});
|
|
@@ -609,7 +624,7 @@ function useEntityKinds() {
|
|
|
609
624
|
function useOwnUser() {
|
|
610
625
|
const catalogApi = corePluginApi.useApi(catalogApiRef);
|
|
611
626
|
const identityApi = corePluginApi.useApi(corePluginApi.identityApiRef);
|
|
612
|
-
return
|
|
627
|
+
return useAsync__default["default"](() => catalogApi.getEntityByName({
|
|
613
628
|
kind: "User",
|
|
614
629
|
namespace: "default",
|
|
615
630
|
name: identityApi.getUserId()
|
|
@@ -623,7 +638,7 @@ function useRelatedEntities(entity, { type, kind }) {
|
|
|
623
638
|
loading,
|
|
624
639
|
value: entities,
|
|
625
640
|
error
|
|
626
|
-
} =
|
|
641
|
+
} = useAsync__default["default"](async () => {
|
|
627
642
|
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")));
|
|
628
643
|
if (!relations) {
|
|
629
644
|
return [];
|
|
@@ -664,7 +679,7 @@ function getEntityRef$1(entityOrRef) {
|
|
|
664
679
|
}
|
|
665
680
|
function useStarredEntities() {
|
|
666
681
|
const starredEntitiesApi = corePluginApi.useApi(starredEntitiesApiRef);
|
|
667
|
-
const starredEntities =
|
|
682
|
+
const starredEntities = useObservable__default["default"](starredEntitiesApi.starredEntitie$(), /* @__PURE__ */ new Set());
|
|
668
683
|
const isStarredEntity = React.useCallback((entityOrRef) => starredEntities.has(getEntityRef$1(entityOrRef)), [starredEntities]);
|
|
669
684
|
const toggleStarredEntity = React.useCallback((entityOrRef) => starredEntitiesApi.toggleStarred(getEntityRef$1(entityOrRef)).then(), [starredEntitiesApi]);
|
|
670
685
|
return {
|
|
@@ -745,7 +760,7 @@ async function loadCatalogOwnerRefs(catalogApi, identityOwnerRefs) {
|
|
|
745
760
|
function useEntityOwnership() {
|
|
746
761
|
const identityApi = corePluginApi.useApi(corePluginApi.identityApiRef);
|
|
747
762
|
const catalogApi = corePluginApi.useApi(catalogApiRef);
|
|
748
|
-
const { loading, value: refs } =
|
|
763
|
+
const { loading, value: refs } = useAsync__default["default"](async () => {
|
|
749
764
|
const identityRefs = await loadIdentityOwnerRefs(identityApi);
|
|
750
765
|
const catalogRefs = await loadCatalogOwnerRefs(catalogApi, identityRefs);
|
|
751
766
|
return /* @__PURE__ */ new Set([...identityRefs, ...catalogRefs]);
|
|
@@ -765,6 +780,30 @@ function useEntityOwnership() {
|
|
|
765
780
|
return React.useMemo(() => ({ loading, isOwnedEntity }), [loading, isOwnedEntity]);
|
|
766
781
|
}
|
|
767
782
|
|
|
783
|
+
function useOwnedEntities(allowedKinds) {
|
|
784
|
+
const identityApi = corePluginApi.useApi(corePluginApi.identityApiRef);
|
|
785
|
+
const catalogApi = corePluginApi.useApi(catalogApiRef);
|
|
786
|
+
const { loading, value: refs } = useAsync__default["default"](async () => {
|
|
787
|
+
const identityRefs = await loadIdentityOwnerRefs(identityApi);
|
|
788
|
+
const catalogRefs = await loadCatalogOwnerRefs(catalogApi, identityRefs);
|
|
789
|
+
const catalogs = await catalogApi.getEntities(allowedKinds ? {
|
|
790
|
+
filter: {
|
|
791
|
+
kind: allowedKinds,
|
|
792
|
+
[`relations.${catalogModel.RELATION_OWNED_BY}`]: [...identityRefs, ...catalogRefs]
|
|
793
|
+
}
|
|
794
|
+
} : {
|
|
795
|
+
filter: {
|
|
796
|
+
[`relations.${catalogModel.RELATION_OWNED_BY}`]: [...identityRefs, ...catalogRefs]
|
|
797
|
+
}
|
|
798
|
+
});
|
|
799
|
+
return catalogs;
|
|
800
|
+
}, []);
|
|
801
|
+
const ownedEntities = React.useMemo(() => {
|
|
802
|
+
return refs;
|
|
803
|
+
}, [refs]);
|
|
804
|
+
return React.useMemo(() => ({ loading, ownedEntities }), [loading, ownedEntities]);
|
|
805
|
+
}
|
|
806
|
+
|
|
768
807
|
const EntityKindPicker = ({
|
|
769
808
|
initialFilter,
|
|
770
809
|
hidden
|
|
@@ -917,7 +956,7 @@ const EntitySearchBar = () => {
|
|
|
917
956
|
const classes = useStyles$4();
|
|
918
957
|
const { filters, updateFilters } = useEntityListProvider();
|
|
919
958
|
const [search, setSearch] = React.useState((_b = (_a = filters.text) == null ? void 0 : _a.value) != null ? _b : "");
|
|
920
|
-
|
|
959
|
+
useDebounce__default["default"](() => {
|
|
921
960
|
updateFilters({
|
|
922
961
|
text: search.length ? new EntityTextFilter(search) : void 0
|
|
923
962
|
});
|
|
@@ -1240,7 +1279,7 @@ function useUnregisterEntityDialogState(entity) {
|
|
|
1240
1279
|
const locationRef = (_a = entity.metadata.annotations) == null ? void 0 : _a[catalogModel.ORIGIN_LOCATION_ANNOTATION];
|
|
1241
1280
|
const uid = entity.metadata.uid;
|
|
1242
1281
|
const isBootstrap = locationRef === "bootstrap:bootstrap";
|
|
1243
|
-
const prerequisites =
|
|
1282
|
+
const prerequisites = useAsync__default["default"](async () => {
|
|
1244
1283
|
const locationPromise = catalogApi.getOriginLocationByEntity(entity);
|
|
1245
1284
|
let colocatedEntitiesPromise;
|
|
1246
1285
|
if (!locationRef) {
|
|
@@ -1489,22 +1528,24 @@ const UserListPicker = ({
|
|
|
1489
1528
|
const classes = useStyles();
|
|
1490
1529
|
const configApi = corePluginApi.useApi(corePluginApi.configApiRef);
|
|
1491
1530
|
const orgName = (_a = configApi.getOptionalString("organization.name")) != null ? _a : "Company";
|
|
1531
|
+
const { filters, updateFilters, backendEntities, queryParameters } = useEntityListProvider();
|
|
1532
|
+
const userAndGroupFilterIds = ["starred", "all"];
|
|
1492
1533
|
const filterGroups = getFilterGroups(orgName).map((filterGroup) => ({
|
|
1493
1534
|
...filterGroup,
|
|
1494
|
-
items: filterGroup.items.filter(({ id }) => !availableFilters || availableFilters.includes(id))
|
|
1535
|
+
items: filterGroup.items.filter(({ id }) => ["group", "user"].some((kind) => kind === queryParameters.kind) ? userAndGroupFilterIds.includes(id) : !availableFilters || availableFilters.includes(id))
|
|
1495
1536
|
})).filter(({ items }) => !!items.length);
|
|
1496
|
-
const { filters, updateFilters, backendEntities, queryParameters } = useEntityListProvider();
|
|
1497
1537
|
const { isStarredEntity } = useStarredEntities();
|
|
1498
1538
|
const { isOwnedEntity } = useEntityOwnership();
|
|
1499
|
-
const [selectedUserFilter, setSelectedUserFilter] = React.useState((_b = [queryParameters.user].flat()[0]) != null ? _b : initialFilter);
|
|
1500
1539
|
const ownedFilter = React.useMemo(() => new UserListFilter("owned", isOwnedEntity, isStarredEntity), [isOwnedEntity, isStarredEntity]);
|
|
1501
1540
|
const starredFilter = React.useMemo(() => new UserListFilter("starred", isOwnedEntity, isStarredEntity), [isOwnedEntity, isStarredEntity]);
|
|
1541
|
+
const [entitiesWithoutUserFilter, setEntitiesWithoutUserFilter] = React.useState(backendEntities);
|
|
1542
|
+
const totalOwnedUserEntities = entitiesWithoutUserFilter.filter((entity) => ownedFilter.filterEntity(entity)).length;
|
|
1543
|
+
const [selectedUserFilter, setSelectedUserFilter] = React.useState(totalOwnedUserEntities > 0 ? (_b = [queryParameters.user].flat()[0]) != null ? _b : initialFilter : "all");
|
|
1502
1544
|
React.useEffect(() => {
|
|
1503
1545
|
updateFilters({
|
|
1504
1546
|
user: selectedUserFilter ? new UserListFilter(selectedUserFilter, isOwnedEntity, isStarredEntity) : void 0
|
|
1505
1547
|
});
|
|
1506
1548
|
}, [selectedUserFilter, isOwnedEntity, isStarredEntity, updateFilters]);
|
|
1507
|
-
const [entitiesWithoutUserFilter, setEntitiesWithoutUserFilter] = React.useState(backendEntities);
|
|
1508
1549
|
React.useEffect(() => {
|
|
1509
1550
|
const filterFn = reduceEntityFilters(lodash.compact(Object.values({ ...filters, user: void 0 })));
|
|
1510
1551
|
setEntitiesWithoutUserFilter(backendEntities.filter(filterFn));
|
|
@@ -1512,7 +1553,7 @@ const UserListPicker = ({
|
|
|
1512
1553
|
function getFilterCount(id) {
|
|
1513
1554
|
switch (id) {
|
|
1514
1555
|
case "owned":
|
|
1515
|
-
return
|
|
1556
|
+
return totalOwnedUserEntities;
|
|
1516
1557
|
case "starred":
|
|
1517
1558
|
return entitiesWithoutUserFilter.filter((entity) => starredFilter.filterEntity(entity)).length;
|
|
1518
1559
|
default:
|
|
@@ -1634,6 +1675,7 @@ exports.useEntityListProvider = useEntityListProvider;
|
|
|
1634
1675
|
exports.useEntityOwnership = useEntityOwnership;
|
|
1635
1676
|
exports.useEntityTypeFilter = useEntityTypeFilter;
|
|
1636
1677
|
exports.useOwnUser = useOwnUser;
|
|
1678
|
+
exports.useOwnedEntities = useOwnedEntities;
|
|
1637
1679
|
exports.useRelatedEntities = useRelatedEntities;
|
|
1638
1680
|
exports.useStarredEntities = useStarredEntities;
|
|
1639
1681
|
exports.useStarredEntity = useStarredEntity;
|