diff --git a/.changeset/short-ears-sit.md b/.changeset/short-ears-sit.md
new file mode 100644
index 0000000000..e75908a37d
--- /dev/null
+++ b/.changeset/short-ears-sit.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-catalog-graph': patch
+---
+
+Fix kind filter error in the dev app
diff --git a/plugins/catalog-graph/README.md b/plugins/catalog-graph/README.md
index 0034cf0c3b..33dee92935 100644
--- a/plugins/catalog-graph/README.md
+++ b/plugins/catalog-graph/README.md
@@ -83,3 +83,9 @@ To use the catalog graph plugin, you have to add some things to your Backstage a
```
+
+## Development
+
+Run `yarn` in the root of this plugin to install all dependencies and then `yarn start` to run a [development version](./dev/index.tsx) of this plugin.
+
+
diff --git a/plugins/catalog-graph/dev/index.tsx b/plugins/catalog-graph/dev/index.tsx
index 7d772702a1..1ef9f676de 100644
--- a/plugins/catalog-graph/dev/index.tsx
+++ b/plugins/catalog-graph/dev/index.tsx
@@ -13,14 +13,20 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
-import { GetEntitiesResponse } from '@backstage/catalog-client';
import {
- Entity,
+ GetEntitiesResponse,
+ GetEntityFacetsRequest,
+ GetEntityFacetsResponse,
+} from '@backstage/catalog-client';
+import {
CompoundEntityRef,
DEFAULT_NAMESPACE,
+ Entity,
RELATION_API_CONSUMED_BY,
RELATION_API_PROVIDED_BY,
RELATION_CONSUMES_API,
+ RELATION_DEPENDENCY_OF,
+ RELATION_DEPENDS_ON,
RELATION_HAS_PART,
RELATION_OWNED_BY,
RELATION_OWNER_OF,
@@ -30,22 +36,24 @@ import {
} from '@backstage/catalog-model';
import { Content, Header, Page } from '@backstage/core-components';
import { createDevApp } from '@backstage/dev-utils';
+import { CatalogEntityPage } from '@backstage/plugin-catalog';
import {
CatalogApi,
catalogApiRef,
EntityProvider,
} from '@backstage/plugin-catalog-react';
+import { JsonObject } from '@backstage/types';
import { Grid } from '@material-ui/core';
+import _ from 'lodash';
import React from 'react';
import {
CatalogGraphPage,
catalogGraphPlugin,
EntityCatalogGraphCard,
} from '../src';
-import { CatalogEntityPage } from '@backstage/plugin-catalog';
type DataRelation = [string, string, string];
-type DataEntity = [string, string, DataRelation[]];
+type DataEntity = [string, string, DataRelation[], JsonObject?];
const entities = (
[
@@ -75,8 +83,19 @@ const entities = (
[RELATION_OWNED_BY, 'Group', 'team-a'],
[RELATION_PART_OF, 'System', 'wayback'],
[RELATION_PROVIDES_API, 'API', 'wayback-api'],
+ [RELATION_DEPENDS_ON, 'Resource', 'wayback-archive-storage'],
],
],
+ [
+ 'Resource',
+ 'wayback-archive-storage',
+ [
+ [RELATION_OWNED_BY, 'Group', 'team-a'],
+ [RELATION_PART_OF, 'System', 'wayback'],
+ [RELATION_DEPENDENCY_OF, 'Component', 'wayback-archive'],
+ ],
+ { type: 's3-bucket' },
+ ],
[
'Component',
'wayback-search',
@@ -84,8 +103,19 @@ const entities = (
[RELATION_OWNED_BY, 'Group', 'team-a'],
[RELATION_PART_OF, 'System', 'wayback'],
[RELATION_CONSUMES_API, 'API', 'wayback-api'],
+ [RELATION_DEPENDS_ON, 'Resource', 'wayback-search-db'],
],
],
+ [
+ 'Resource',
+ 'wayback-search-db',
+ [
+ [RELATION_OWNED_BY, 'Group', 'team-a'],
+ [RELATION_PART_OF, 'System', 'wayback'],
+ [RELATION_DEPENDENCY_OF, 'Component', 'wayback-search'],
+ ],
+ { type: 'database' },
+ ],
[
'API',
'wayback-api',
@@ -101,7 +131,9 @@ const entities = (
'team-a',
[
[RELATION_OWNER_OF, 'Component', 'wayback-archive'],
+ [RELATION_OWNER_OF, 'Resource', 'wayback-archive-storage'],
[RELATION_OWNER_OF, 'Component', 'wayback-search'],
+ [RELATION_OWNER_OF, 'Resource', 'wayback-search-db'],
[RELATION_OWNER_OF, 'API', 'wayback-api'],
[RELATION_OWNER_OF, 'Domain', 'wayback'],
[RELATION_OWNER_OF, 'System', 'wayback'],
@@ -109,7 +141,7 @@ const entities = (
],
] as DataEntity[]
).reduce((o, d) => {
- const [kind, name, relations] = d;
+ const [kind, name, relations, spec] = d;
const entity: Entity = {
apiVersion: 'backstage.io/v1alpha1',
@@ -117,6 +149,7 @@ const entities = (
metadata: {
name,
},
+ spec: spec,
relations: relations.map(([type, k, n]) => ({
target: { kind: k, name: n, namespace: DEFAULT_NAMESPACE },
targetRef: stringifyEntityRef({
@@ -149,6 +182,25 @@ createDevApp()
async getEntities(): Promise {
return { items: Object.values(entities) };
},
+ async getEntityFacets(
+ request: GetEntityFacetsRequest,
+ ): Promise {
+ if (request.facets.includes('kind')) {
+ const kinds: [string, number][] = _.chain(entities)
+ .map(e => e.kind)
+ .groupBy(k => k)
+ .mapValues(v => v.length)
+ .toPairs()
+ .value();
+ const kindFacet = kinds.map(([kind, count]) => ({
+ value: kind,
+ count: count,
+ }));
+
+ return { facets: { kind: kindFacet } };
+ }
+ return { facets: {} };
+ },
} as Partial as unknown as CatalogApi;
},
})
diff --git a/plugins/catalog-graph/package.json b/plugins/catalog-graph/package.json
index 722a08d460..79f98c06a7 100644
--- a/plugins/catalog-graph/package.json
+++ b/plugins/catalog-graph/package.json
@@ -50,6 +50,7 @@
"@backstage/core-app-api": "^1.0.2-next.1",
"@backstage/dev-utils": "^1.0.2-next.2",
"@backstage/test-utils": "^1.1.0-next.2",
+ "@backstage/types": "^1.0.0",
"@testing-library/jest-dom": "^5.10.1",
"@testing-library/react": "^12.1.3",
"@testing-library/react-hooks": "^8.0.0",