@backstage/plugin-catalog-graph 0.5.8-next.1 → 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 +71 -0
- package/README.md +62 -50
- package/dist/alpha.d.ts +28 -26
- package/dist/alpha.esm.js +3 -2
- package/dist/alpha.esm.js.map +1 -1
- package/dist/components/CatalogGraphCard/CatalogGraphCard.esm.js +16 -24
- package/dist/components/CatalogGraphCard/CatalogGraphCard.esm.js.map +1 -1
- package/dist/index.d.ts +26 -3
- package/dist/index.esm.js +1 -0
- package/dist/index.esm.js.map +1 -1
- package/dist/package.json.esm.js +3 -1
- package/dist/package.json.esm.js.map +1 -1
- package/dist/translation.esm.js.map +1 -1
- package/package.json +16 -14
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,76 @@
|
|
|
1
1
|
# @backstage/plugin-catalog-graph
|
|
2
2
|
|
|
3
|
+
## 0.6.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- d14b6e0: **BREAKING**: Migrated `MembersListCard`, `OwnershipCard`, and `CatalogGraphCard` to use BUI card primitives via `EntityInfoCard`.
|
|
8
|
+
|
|
9
|
+
- `OwnershipCard`: Removed `variant` and `maxScrollHeight` props. Card height and scrolling are now controlled by the parent container — the card fills its container and the body scrolls automatically when content overflows.
|
|
10
|
+
- `CatalogGraphCard`: Removed `variant` prop.
|
|
11
|
+
- `MembersListCard`: Translation keys `subtitle`, `paginationLabel`, `aggregateMembersToggle.directMembers`, `aggregateMembersToggle.aggregatedMembers`, and `aggregateMembersToggle.ariaLabel` have been removed. The `title` key now includes `{{groupName}}`. New keys added: `cardLabel`, `noSearchResult`, `aggregateMembersToggle.label`.
|
|
12
|
+
- `OwnershipCard`: Translation keys `aggregateRelationsToggle.directRelations`, `aggregateRelationsToggle.aggregatedRelations`, and `aggregateRelationsToggle.ariaLabel` have been removed. New key added: `aggregateRelationsToggle.label`.
|
|
13
|
+
- Removed `MemberComponentClassKey` export, and `root` and `cardContent` from `MembersListCardClassKey`, `card` from `OwnershipCardClassKey`, and `card` from `CatalogGraphCardClassKey`.
|
|
14
|
+
|
|
15
|
+
**Migration:**
|
|
16
|
+
|
|
17
|
+
```diff
|
|
18
|
+
- <EntityOwnershipCard variant="gridItem" />
|
|
19
|
+
+ <EntityOwnershipCard />
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
```diff
|
|
23
|
+
- <EntityCatalogGraphCard variant="gridItem" height={400} />
|
|
24
|
+
+ <EntityCatalogGraphCard height={400} />
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
### Patch Changes
|
|
28
|
+
|
|
29
|
+
- 538c985: Updated installation documentation to use feature discovery as the default.
|
|
30
|
+
- 0be2541: Promoted the plugin's translation ref to the stable package entry point. It was previously only available through the alpha entry point.
|
|
31
|
+
- Updated dependencies
|
|
32
|
+
- @backstage/plugin-catalog-react@2.1.0
|
|
33
|
+
- @backstage/ui@0.13.0
|
|
34
|
+
- @backstage/core-plugin-api@1.12.4
|
|
35
|
+
- @backstage/core-components@0.18.8
|
|
36
|
+
- @backstage/frontend-plugin-api@0.15.0
|
|
37
|
+
- @backstage/catalog-client@1.14.0
|
|
38
|
+
- @backstage/catalog-model@1.7.7
|
|
39
|
+
|
|
40
|
+
## 0.6.0-next.2
|
|
41
|
+
|
|
42
|
+
### Minor Changes
|
|
43
|
+
|
|
44
|
+
- d14b6e0: **BREAKING**: Migrated `MembersListCard`, `OwnershipCard`, and `CatalogGraphCard` to use BUI card primitives via `EntityInfoCard`.
|
|
45
|
+
|
|
46
|
+
- `OwnershipCard`: Removed `variant` and `maxScrollHeight` props. Card height and scrolling are now controlled by the parent container — the card fills its container and the body scrolls automatically when content overflows.
|
|
47
|
+
- `CatalogGraphCard`: Removed `variant` prop.
|
|
48
|
+
- `MembersListCard`: Translation keys `subtitle`, `paginationLabel`, `aggregateMembersToggle.directMembers`, `aggregateMembersToggle.aggregatedMembers`, and `aggregateMembersToggle.ariaLabel` have been removed. The `title` key now includes `{{groupName}}`. New keys added: `cardLabel`, `noSearchResult`, `aggregateMembersToggle.label`.
|
|
49
|
+
- `OwnershipCard`: Translation keys `aggregateRelationsToggle.directRelations`, `aggregateRelationsToggle.aggregatedRelations`, and `aggregateRelationsToggle.ariaLabel` have been removed. New key added: `aggregateRelationsToggle.label`.
|
|
50
|
+
- Removed `MemberComponentClassKey` export, and `root` and `cardContent` from `MembersListCardClassKey`, `card` from `OwnershipCardClassKey`, and `card` from `CatalogGraphCardClassKey`.
|
|
51
|
+
|
|
52
|
+
**Migration:**
|
|
53
|
+
|
|
54
|
+
```diff
|
|
55
|
+
- <EntityOwnershipCard variant="gridItem" />
|
|
56
|
+
+ <EntityOwnershipCard />
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
```diff
|
|
60
|
+
- <EntityCatalogGraphCard variant="gridItem" height={400} />
|
|
61
|
+
+ <EntityCatalogGraphCard height={400} />
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
### Patch Changes
|
|
65
|
+
|
|
66
|
+
- Updated dependencies
|
|
67
|
+
- @backstage/ui@0.13.0-next.2
|
|
68
|
+
- @backstage/frontend-plugin-api@0.15.0-next.1
|
|
69
|
+
- @backstage/core-plugin-api@1.12.4-next.1
|
|
70
|
+
- @backstage/catalog-client@1.14.0-next.2
|
|
71
|
+
- @backstage/plugin-catalog-react@2.1.0-next.2
|
|
72
|
+
- @backstage/core-components@0.18.8-next.1
|
|
73
|
+
|
|
3
74
|
## 0.5.8-next.1
|
|
4
75
|
|
|
5
76
|
### Patch Changes
|
package/README.md
CHANGED
|
@@ -1,8 +1,5 @@
|
|
|
1
1
|
# catalog-graph
|
|
2
2
|
|
|
3
|
-
> Disclaimer:
|
|
4
|
-
> If you are looking for documentation on the experimental new frontend system support, please go [here](./README-alpha.md).
|
|
5
|
-
|
|
6
3
|
Welcome to the catalog graph plugin! The catalog graph visualizes the relations
|
|
7
4
|
between entities, like ownership, grouping or API relationships.
|
|
8
5
|
|
|
@@ -23,58 +20,25 @@ The plugin comes with these features:
|
|
|
23
20
|
- `EntityRelationsGraph`:
|
|
24
21
|
A react component that can be used to build own customized entity relation graphs.
|
|
25
22
|
|
|
26
|
-
##
|
|
27
|
-
|
|
28
|
-
To use the catalog graph plugin, you have to add some things to your Backstage app:
|
|
29
|
-
|
|
30
|
-
1. Add a dependency to your `packages/app/package.json`:
|
|
31
|
-
```sh
|
|
32
|
-
# From your Backstage root directory
|
|
33
|
-
yarn --cwd packages/app add @backstage/plugin-catalog-graph
|
|
34
|
-
```
|
|
35
|
-
2. Add the `CatalogGraphPage` to your `packages/app/src/App.tsx`:
|
|
36
|
-
|
|
37
|
-
```typescript
|
|
38
|
-
<FlatRoutes>
|
|
39
|
-
…
|
|
40
|
-
<Route path="/catalog-graph" element={<CatalogGraphPage />} />…
|
|
41
|
-
</FlatRoutes>
|
|
42
|
-
```
|
|
23
|
+
## Installation
|
|
43
24
|
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
path="/catalog-graph"
|
|
49
|
-
element={
|
|
50
|
-
<CatalogGraphPage
|
|
51
|
-
initialState={{
|
|
52
|
-
selectedKinds: ['component', 'domain', 'system', 'api', 'group'],
|
|
53
|
-
}}
|
|
54
|
-
/>
|
|
55
|
-
}
|
|
56
|
-
/>
|
|
57
|
-
```
|
|
25
|
+
```sh
|
|
26
|
+
# From your Backstage root directory
|
|
27
|
+
yarn --cwd packages/app add @backstage/plugin-catalog-graph
|
|
28
|
+
```
|
|
58
29
|
|
|
59
|
-
|
|
30
|
+
Once installed, the plugin is automatically available in your app through the default feature discovery. For more details and alternative installation methods, see [installing plugins](https://backstage.io/docs/frontend-system/building-apps/installing-plugins).
|
|
60
31
|
|
|
61
|
-
|
|
62
|
-
bindRoutes({ bind }) {
|
|
63
|
-
…
|
|
64
|
-
bind(catalogGraphPlugin.externalRoutes, {
|
|
65
|
-
catalogEntity: catalogPlugin.routes.catalogEntity,
|
|
66
|
-
});
|
|
67
|
-
…
|
|
68
|
-
}
|
|
69
|
-
```
|
|
32
|
+
To enable the entity relations graph card on the catalog entity page, add the following configuration:
|
|
70
33
|
|
|
71
|
-
|
|
34
|
+
```yaml
|
|
35
|
+
# app-config.yaml
|
|
36
|
+
app:
|
|
37
|
+
extensions:
|
|
38
|
+
- entity-card:catalog-graph/relations
|
|
39
|
+
```
|
|
72
40
|
|
|
73
|
-
|
|
74
|
-
<Grid item md={6} xs={12}>
|
|
75
|
-
<EntityCatalogGraphCard variant="gridItem" height={400} />
|
|
76
|
-
</Grid>
|
|
77
|
-
```
|
|
41
|
+
For the full list of available extensions and their configuration options, see the [README-alpha.md](./README-alpha.md).
|
|
78
42
|
|
|
79
43
|
### Customizing the UI
|
|
80
44
|
|
|
@@ -177,6 +141,54 @@ import {
|
|
|
177
141
|
}),
|
|
178
142
|
```
|
|
179
143
|
|
|
144
|
+
## Old Frontend System
|
|
145
|
+
|
|
146
|
+
If your Backstage app uses the old frontend system, you need to manually wire the plugin into your app as outlined in this section. If you are on the new frontend system, you can skip this.
|
|
147
|
+
|
|
148
|
+
1. Add the `CatalogGraphPage` to your `packages/app/src/App.tsx`:
|
|
149
|
+
|
|
150
|
+
```typescript
|
|
151
|
+
<FlatRoutes>
|
|
152
|
+
…
|
|
153
|
+
<Route path="/catalog-graph" element={<CatalogGraphPage />} />…
|
|
154
|
+
</FlatRoutes>
|
|
155
|
+
```
|
|
156
|
+
|
|
157
|
+
You can configure the page to open with some initial filters:
|
|
158
|
+
|
|
159
|
+
```typescript
|
|
160
|
+
<Route
|
|
161
|
+
path="/catalog-graph"
|
|
162
|
+
element={
|
|
163
|
+
<CatalogGraphPage
|
|
164
|
+
initialState={{
|
|
165
|
+
selectedKinds: ['component', 'domain', 'system', 'api', 'group'],
|
|
166
|
+
}}
|
|
167
|
+
/>
|
|
168
|
+
}
|
|
169
|
+
/>
|
|
170
|
+
```
|
|
171
|
+
|
|
172
|
+
2. Bind the external routes of the `catalogGraphPlugin` in your `packages/app/src/App.tsx`:
|
|
173
|
+
|
|
174
|
+
```typescript
|
|
175
|
+
bindRoutes({ bind }) {
|
|
176
|
+
…
|
|
177
|
+
bind(catalogGraphPlugin.externalRoutes, {
|
|
178
|
+
catalogEntity: catalogPlugin.routes.catalogEntity,
|
|
179
|
+
});
|
|
180
|
+
…
|
|
181
|
+
}
|
|
182
|
+
```
|
|
183
|
+
|
|
184
|
+
3. Add `EntityCatalogGraphCard` to any entity page that you want in your `packages/app/src/components/catalog/EntityPage.tsx`:
|
|
185
|
+
|
|
186
|
+
```typescript
|
|
187
|
+
<Grid item md={6} xs={12}>
|
|
188
|
+
<EntityCatalogGraphCard variant="gridItem" height={400} />
|
|
189
|
+
</Grid>
|
|
190
|
+
```
|
|
191
|
+
|
|
180
192
|
## Development
|
|
181
193
|
|
|
182
194
|
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.
|
package/dist/alpha.d.ts
CHANGED
|
@@ -5,31 +5,6 @@ import * as _backstage_filter_predicates from '@backstage/filter-predicates';
|
|
|
5
5
|
import * as _backstage_frontend_plugin_api from '@backstage/frontend-plugin-api';
|
|
6
6
|
import * as _backstage_core_plugin_api from '@backstage/core-plugin-api';
|
|
7
7
|
|
|
8
|
-
/** @alpha */
|
|
9
|
-
declare const catalogGraphTranslationRef: _backstage_frontend_plugin_api.TranslationRef<"catalog-graph", {
|
|
10
|
-
readonly "catalogGraphCard.title": "Relations";
|
|
11
|
-
readonly "catalogGraphCard.deepLinkTitle": "View graph";
|
|
12
|
-
readonly "catalogGraphPage.title": "Catalog Graph";
|
|
13
|
-
readonly "catalogGraphPage.filterToggleButtonTitle": "Filters";
|
|
14
|
-
readonly "catalogGraphPage.supportButtonDescription": "Start tracking your component in by adding it to the software catalog.";
|
|
15
|
-
readonly "catalogGraphPage.simplifiedSwitchLabel": "Simplified";
|
|
16
|
-
readonly "catalogGraphPage.mergeRelationsSwitchLabel": "Merge relations";
|
|
17
|
-
readonly "catalogGraphPage.zoomOutDescription": "Use pinch & zoom to move around the diagram. Click to change active node, shift click to navigate to entity.";
|
|
18
|
-
readonly "catalogGraphPage.curveFilter.title": "Curve";
|
|
19
|
-
readonly "catalogGraphPage.curveFilter.curveStepBefore": "Step Before";
|
|
20
|
-
readonly "catalogGraphPage.curveFilter.curveMonotoneX": "Monotone X";
|
|
21
|
-
readonly "catalogGraphPage.directionFilter.title": "Direction";
|
|
22
|
-
readonly "catalogGraphPage.directionFilter.leftToRight": "Left to right";
|
|
23
|
-
readonly "catalogGraphPage.directionFilter.rightToLeft": "Right to left";
|
|
24
|
-
readonly "catalogGraphPage.directionFilter.topToBottom": "Top to bottom";
|
|
25
|
-
readonly "catalogGraphPage.directionFilter.bottomToTop": "Bottom to top";
|
|
26
|
-
readonly "catalogGraphPage.maxDepthFilter.title": "Max depth";
|
|
27
|
-
readonly "catalogGraphPage.maxDepthFilter.inputPlaceholder": "∞ Infinite";
|
|
28
|
-
readonly "catalogGraphPage.maxDepthFilter.clearButtonAriaLabel": "clear max depth";
|
|
29
|
-
readonly "catalogGraphPage.selectedKindsFilter.title": "Kinds";
|
|
30
|
-
readonly "catalogGraphPage.selectedRelationsFilter.title": "Relations";
|
|
31
|
-
}>;
|
|
32
|
-
|
|
33
8
|
declare const _default: _backstage_frontend_plugin_api.OverridableFrontendPlugin<{
|
|
34
9
|
catalogGraph: _backstage_core_plugin_api.RouteRef<undefined>;
|
|
35
10
|
}, {
|
|
@@ -153,7 +128,6 @@ declare const _default: _backstage_frontend_plugin_api.OverridableFrontendPlugin
|
|
|
153
128
|
kind: "page";
|
|
154
129
|
name: undefined;
|
|
155
130
|
params: {
|
|
156
|
-
defaultPath?: [Error: `Use the 'path' param instead`];
|
|
157
131
|
path: string;
|
|
158
132
|
title?: string;
|
|
159
133
|
icon?: _backstage_frontend_plugin_api.IconElement;
|
|
@@ -164,4 +138,32 @@ declare const _default: _backstage_frontend_plugin_api.OverridableFrontendPlugin
|
|
|
164
138
|
}>;
|
|
165
139
|
}>;
|
|
166
140
|
|
|
141
|
+
/**
|
|
142
|
+
* @alpha
|
|
143
|
+
* @deprecated Import from `@backstage/plugin-catalog-graph` instead.
|
|
144
|
+
*/
|
|
145
|
+
declare const catalogGraphTranslationRef: _backstage_frontend_plugin_api.TranslationRef<"catalog-graph", {
|
|
146
|
+
readonly "catalogGraphCard.title": "Relations";
|
|
147
|
+
readonly "catalogGraphCard.deepLinkTitle": "View graph";
|
|
148
|
+
readonly "catalogGraphPage.title": "Catalog Graph";
|
|
149
|
+
readonly "catalogGraphPage.filterToggleButtonTitle": "Filters";
|
|
150
|
+
readonly "catalogGraphPage.supportButtonDescription": "Start tracking your component in by adding it to the software catalog.";
|
|
151
|
+
readonly "catalogGraphPage.simplifiedSwitchLabel": "Simplified";
|
|
152
|
+
readonly "catalogGraphPage.mergeRelationsSwitchLabel": "Merge relations";
|
|
153
|
+
readonly "catalogGraphPage.zoomOutDescription": "Use pinch & zoom to move around the diagram. Click to change active node, shift click to navigate to entity.";
|
|
154
|
+
readonly "catalogGraphPage.curveFilter.title": "Curve";
|
|
155
|
+
readonly "catalogGraphPage.curveFilter.curveStepBefore": "Step Before";
|
|
156
|
+
readonly "catalogGraphPage.curveFilter.curveMonotoneX": "Monotone X";
|
|
157
|
+
readonly "catalogGraphPage.directionFilter.title": "Direction";
|
|
158
|
+
readonly "catalogGraphPage.directionFilter.leftToRight": "Left to right";
|
|
159
|
+
readonly "catalogGraphPage.directionFilter.rightToLeft": "Right to left";
|
|
160
|
+
readonly "catalogGraphPage.directionFilter.topToBottom": "Top to bottom";
|
|
161
|
+
readonly "catalogGraphPage.directionFilter.bottomToTop": "Bottom to top";
|
|
162
|
+
readonly "catalogGraphPage.maxDepthFilter.title": "Max depth";
|
|
163
|
+
readonly "catalogGraphPage.maxDepthFilter.inputPlaceholder": "∞ Infinite";
|
|
164
|
+
readonly "catalogGraphPage.maxDepthFilter.clearButtonAriaLabel": "clear max depth";
|
|
165
|
+
readonly "catalogGraphPage.selectedKindsFilter.title": "Kinds";
|
|
166
|
+
readonly "catalogGraphPage.selectedRelationsFilter.title": "Relations";
|
|
167
|
+
}>;
|
|
168
|
+
|
|
167
169
|
export { catalogGraphTranslationRef, _default as default };
|
package/dist/alpha.esm.js
CHANGED
|
@@ -3,7 +3,7 @@ import { PageBlueprint, ApiBlueprint, createFrontendPlugin } from '@backstage/fr
|
|
|
3
3
|
import { EntityCardBlueprint } from '@backstage/plugin-catalog-react/alpha';
|
|
4
4
|
import { catalogGraphRouteRef, catalogEntityRouteRef } from './routes.esm.js';
|
|
5
5
|
import { Direction, DefaultCatalogGraphApi, catalogGraphApiRef } from '@backstage/plugin-catalog-graph';
|
|
6
|
-
|
|
6
|
+
import { catalogGraphTranslationRef as catalogGraphTranslationRef$1 } from './translation.esm.js';
|
|
7
7
|
|
|
8
8
|
const CatalogGraphEntityCard = EntityCardBlueprint.makeWithOverrides({
|
|
9
9
|
name: "relations",
|
|
@@ -74,6 +74,7 @@ var alpha = createFrontendPlugin({
|
|
|
74
74
|
},
|
|
75
75
|
extensions: [CatalogGraphPage, CatalogGraphEntityCard, CatalogGraphApi]
|
|
76
76
|
});
|
|
77
|
+
const catalogGraphTranslationRef = catalogGraphTranslationRef$1;
|
|
77
78
|
|
|
78
|
-
export { alpha as default };
|
|
79
|
+
export { catalogGraphTranslationRef, alpha as default };
|
|
79
80
|
//# sourceMappingURL=alpha.esm.js.map
|
package/dist/alpha.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alpha.esm.js","sources":["../src/alpha.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n ApiBlueprint,\n createFrontendPlugin,\n PageBlueprint,\n} from '@backstage/frontend-plugin-api';\nimport { EntityCardBlueprint } from '@backstage/plugin-catalog-react/alpha';\nimport { catalogGraphRouteRef, catalogEntityRouteRef } from './routes';\nimport {\n catalogGraphApiRef,\n DefaultCatalogGraphApi,\n Direction,\n} from '@backstage/plugin-catalog-graph';\n\nconst CatalogGraphEntityCard = EntityCardBlueprint.makeWithOverrides({\n name: 'relations',\n config: {\n schema: {\n kinds: z => z.array(z.string()).optional(),\n relations: z => z.array(z.string()).optional(),\n maxDepth: z => z.number().optional(),\n unidirectional: z => z.boolean().optional(),\n mergeRelations: z => z.boolean().optional(),\n direction: z => z.nativeEnum(Direction).optional(),\n relationPairs: z => z.array(z.tuple([z.string(), z.string()])).optional(),\n zoom: z => z.enum(['enabled', 'disabled', 'enable-on-click']).optional(),\n curve: z => z.enum(['curveStepBefore', 'curveMonotoneX']).optional(),\n // Skipping a \"variant\" config for now, defaulting to \"gridItem\" in the component\n // For more details, see this comment: https://github.com/backstage/backstage/pull/22619#discussion_r1477333252\n title: z => z.string().optional(),\n height: z => z.number().optional(),\n },\n },\n factory(originalFactory, { config }) {\n return originalFactory({\n loader: async () =>\n import('./components/CatalogGraphCard').then(m => (\n <m.CatalogGraphCard {...config} />\n )),\n });\n },\n});\n\nconst CatalogGraphPage = PageBlueprint.makeWithOverrides({\n config: {\n schema: {\n selectedKinds: z => z.array(z.string()).optional(),\n selectedRelations: z => z.array(z.string()).optional(),\n rootEntityRefs: z => z.array(z.string()).optional(),\n maxDepth: z => z.number().optional(),\n unidirectional: z => z.boolean().optional(),\n mergeRelations: z => z.boolean().optional(),\n direction: z => z.nativeEnum(Direction).optional(),\n showFilters: z => z.boolean().optional(),\n curve: z => z.enum(['curveStepBefore', 'curveMonotoneX']).optional(),\n kinds: z => z.array(z.string()).optional(),\n relations: z => z.array(z.string()).optional(),\n relationPairs: z => z.array(z.tuple([z.string(), z.string()])).optional(),\n zoom: z => z.enum(['enabled', 'disabled', 'enable-on-click']).optional(),\n },\n },\n factory(originalFactory, { config }) {\n return originalFactory({\n path: '/catalog-graph',\n routeRef: catalogGraphRouteRef,\n loader: () =>\n import('./components/CatalogGraphPage').then(m => (\n <m.CatalogGraphPage {...config} />\n )),\n });\n },\n});\n\nconst CatalogGraphApi = ApiBlueprint.make({\n params: defineParams =>\n defineParams({\n api: catalogGraphApiRef,\n deps: {},\n factory: () => new DefaultCatalogGraphApi(),\n }),\n});\n\nexport default createFrontendPlugin({\n pluginId: 'catalog-graph',\n info: { packageJson: () => import('../package.json') },\n routes: {\n catalogGraph: catalogGraphRouteRef,\n },\n externalRoutes: {\n catalogEntity: catalogEntityRouteRef,\n },\n extensions: [CatalogGraphPage, CatalogGraphEntityCard, CatalogGraphApi],\n});\n\
|
|
1
|
+
{"version":3,"file":"alpha.esm.js","sources":["../src/alpha.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n ApiBlueprint,\n createFrontendPlugin,\n PageBlueprint,\n} from '@backstage/frontend-plugin-api';\nimport { EntityCardBlueprint } from '@backstage/plugin-catalog-react/alpha';\nimport { catalogGraphRouteRef, catalogEntityRouteRef } from './routes';\nimport {\n catalogGraphApiRef,\n DefaultCatalogGraphApi,\n Direction,\n} from '@backstage/plugin-catalog-graph';\n\nconst CatalogGraphEntityCard = EntityCardBlueprint.makeWithOverrides({\n name: 'relations',\n config: {\n schema: {\n kinds: z => z.array(z.string()).optional(),\n relations: z => z.array(z.string()).optional(),\n maxDepth: z => z.number().optional(),\n unidirectional: z => z.boolean().optional(),\n mergeRelations: z => z.boolean().optional(),\n direction: z => z.nativeEnum(Direction).optional(),\n relationPairs: z => z.array(z.tuple([z.string(), z.string()])).optional(),\n zoom: z => z.enum(['enabled', 'disabled', 'enable-on-click']).optional(),\n curve: z => z.enum(['curveStepBefore', 'curveMonotoneX']).optional(),\n // Skipping a \"variant\" config for now, defaulting to \"gridItem\" in the component\n // For more details, see this comment: https://github.com/backstage/backstage/pull/22619#discussion_r1477333252\n title: z => z.string().optional(),\n height: z => z.number().optional(),\n },\n },\n factory(originalFactory, { config }) {\n return originalFactory({\n loader: async () =>\n import('./components/CatalogGraphCard').then(m => (\n <m.CatalogGraphCard {...config} />\n )),\n });\n },\n});\n\nconst CatalogGraphPage = PageBlueprint.makeWithOverrides({\n config: {\n schema: {\n selectedKinds: z => z.array(z.string()).optional(),\n selectedRelations: z => z.array(z.string()).optional(),\n rootEntityRefs: z => z.array(z.string()).optional(),\n maxDepth: z => z.number().optional(),\n unidirectional: z => z.boolean().optional(),\n mergeRelations: z => z.boolean().optional(),\n direction: z => z.nativeEnum(Direction).optional(),\n showFilters: z => z.boolean().optional(),\n curve: z => z.enum(['curveStepBefore', 'curveMonotoneX']).optional(),\n kinds: z => z.array(z.string()).optional(),\n relations: z => z.array(z.string()).optional(),\n relationPairs: z => z.array(z.tuple([z.string(), z.string()])).optional(),\n zoom: z => z.enum(['enabled', 'disabled', 'enable-on-click']).optional(),\n },\n },\n factory(originalFactory, { config }) {\n return originalFactory({\n path: '/catalog-graph',\n routeRef: catalogGraphRouteRef,\n loader: () =>\n import('./components/CatalogGraphPage').then(m => (\n <m.CatalogGraphPage {...config} />\n )),\n });\n },\n});\n\nconst CatalogGraphApi = ApiBlueprint.make({\n params: defineParams =>\n defineParams({\n api: catalogGraphApiRef,\n deps: {},\n factory: () => new DefaultCatalogGraphApi(),\n }),\n});\n\nexport default createFrontendPlugin({\n pluginId: 'catalog-graph',\n info: { packageJson: () => import('../package.json') },\n routes: {\n catalogGraph: catalogGraphRouteRef,\n },\n externalRoutes: {\n catalogEntity: catalogEntityRouteRef,\n },\n extensions: [CatalogGraphPage, CatalogGraphEntityCard, CatalogGraphApi],\n});\n\nimport { catalogGraphTranslationRef as _catalogGraphTranslationRef } from './translation';\n\n/**\n * @alpha\n * @deprecated Import from `@backstage/plugin-catalog-graph` instead.\n */\nexport const catalogGraphTranslationRef = _catalogGraphTranslationRef;\n"],"names":["_catalogGraphTranslationRef"],"mappings":"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"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { getCompoundEntityRef, parseEntityRef, stringifyEntityRef } from '@backstage/catalog-model';
|
|
3
|
-
import { InfoCard } from '@backstage/core-components';
|
|
4
3
|
import { useRouteRef, useAnalytics } from '@backstage/core-plugin-api';
|
|
5
|
-
import { useEntity, entityRouteRef, humanizeEntityRef } from '@backstage/plugin-catalog-react';
|
|
4
|
+
import { useEntity, entityRouteRef, humanizeEntityRef, EntityInfoCard } from '@backstage/plugin-catalog-react';
|
|
5
|
+
import { ButtonLink } from '@backstage/ui';
|
|
6
|
+
import { RiArrowRightLine } from '@remixicon/react';
|
|
6
7
|
import { makeStyles } from '@material-ui/core/styles';
|
|
7
8
|
import qs from 'qs';
|
|
8
9
|
import { useMemo, useCallback } from 'react';
|
|
@@ -16,19 +17,9 @@ import classNames from 'classnames';
|
|
|
16
17
|
|
|
17
18
|
const useStyles = makeStyles(
|
|
18
19
|
{
|
|
19
|
-
card: ({ height }) => ({
|
|
20
|
-
display: "flex",
|
|
21
|
-
flexDirection: "column",
|
|
22
|
-
...height && {
|
|
23
|
-
height,
|
|
24
|
-
maxHeight: height,
|
|
25
|
-
minHeight: height
|
|
26
|
-
}
|
|
27
|
-
}),
|
|
28
20
|
graph: ({ height }) => ({
|
|
29
|
-
|
|
30
|
-
minHeight: 0
|
|
31
|
-
...height && { height }
|
|
21
|
+
height: height ?? "100%",
|
|
22
|
+
minHeight: 0
|
|
32
23
|
})
|
|
33
24
|
},
|
|
34
25
|
{ name: "PluginCatalogGraphCatalogGraphCard" }
|
|
@@ -36,7 +27,6 @@ const useStyles = makeStyles(
|
|
|
36
27
|
const CatalogGraphCard = (props) => {
|
|
37
28
|
const { t } = useTranslationRef(catalogGraphTranslationRef);
|
|
38
29
|
const {
|
|
39
|
-
variant = "gridItem",
|
|
40
30
|
relationPairs,
|
|
41
31
|
maxDepth = 1,
|
|
42
32
|
unidirectional = true,
|
|
@@ -91,17 +81,19 @@ const CatalogGraphCard = (props) => {
|
|
|
91
81
|
);
|
|
92
82
|
const catalogGraphUrl = `${catalogGraphRoute()}${catalogGraphParams}`;
|
|
93
83
|
return /* @__PURE__ */ jsx(
|
|
94
|
-
|
|
84
|
+
EntityInfoCard,
|
|
95
85
|
{
|
|
96
86
|
title,
|
|
97
|
-
action,
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
87
|
+
headerActions: action,
|
|
88
|
+
footerActions: /* @__PURE__ */ jsx(
|
|
89
|
+
ButtonLink,
|
|
90
|
+
{
|
|
91
|
+
iconEnd: /* @__PURE__ */ jsx(RiArrowRightLine, {}),
|
|
92
|
+
variant: "tertiary",
|
|
93
|
+
href: catalogGraphUrl,
|
|
94
|
+
children: t("catalogGraphCard.deepLinkTitle")
|
|
95
|
+
}
|
|
96
|
+
),
|
|
105
97
|
children: /* @__PURE__ */ jsx(
|
|
106
98
|
EntityRelationsGraph,
|
|
107
99
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CatalogGraphCard.esm.js","sources":["../../../src/components/CatalogGraphCard/CatalogGraphCard.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n getCompoundEntityRef,\n parseEntityRef,\n stringifyEntityRef,\n} from '@backstage/catalog-model';\nimport {
|
|
1
|
+
{"version":3,"file":"CatalogGraphCard.esm.js","sources":["../../../src/components/CatalogGraphCard/CatalogGraphCard.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n getCompoundEntityRef,\n parseEntityRef,\n stringifyEntityRef,\n} from '@backstage/catalog-model';\nimport { useAnalytics, useRouteRef } from '@backstage/core-plugin-api';\nimport {\n EntityInfoCard,\n humanizeEntityRef,\n useEntity,\n entityRouteRef,\n} from '@backstage/plugin-catalog-react';\nimport { ButtonLink } from '@backstage/ui';\nimport { RiArrowRightLine } from '@remixicon/react';\nimport { makeStyles, Theme } from '@material-ui/core/styles';\nimport qs from 'qs';\nimport { MouseEvent, ReactNode, useCallback, useMemo } from 'react';\nimport { useNavigate } from 'react-router-dom';\nimport { catalogGraphRouteRef } from '../../routes';\nimport {\n EntityRelationsGraph,\n EntityRelationsGraphProps,\n} from '../EntityRelationsGraph';\nimport { useTranslationRef } from '@backstage/frontend-plugin-api';\nimport { catalogGraphTranslationRef } from '../../translation';\nimport { Direction, EntityNode } from '../../lib/types';\nimport classNames from 'classnames';\n\n/** @public */\nexport type CatalogGraphCardClassKey = 'graph';\n\nconst useStyles = makeStyles<Theme, { height?: number }>(\n {\n graph: ({ height }) => ({\n height: height ?? '100%',\n minHeight: 0,\n }),\n },\n { name: 'PluginCatalogGraphCatalogGraphCard' },\n);\n\nexport const CatalogGraphCard = (\n props: Partial<EntityRelationsGraphProps> & {\n height?: number;\n title?: string;\n action?: ReactNode;\n },\n) => {\n const { t } = useTranslationRef(catalogGraphTranslationRef);\n const {\n relationPairs,\n maxDepth = 1,\n unidirectional = true,\n mergeRelations = true,\n direction = Direction.LEFT_RIGHT,\n kinds,\n relations,\n entityFilter,\n height,\n className,\n action,\n rootEntityNames,\n onNodeClick,\n title = t('catalogGraphCard.title'),\n zoom = 'enable-on-click',\n } = props;\n\n const { entity } = useEntity();\n const entityName = useMemo(() => getCompoundEntityRef(entity), [entity]);\n const catalogEntityRoute = useRouteRef(entityRouteRef);\n const catalogGraphRoute = useRouteRef(catalogGraphRouteRef);\n const navigate = useNavigate();\n const classes = useStyles({ height });\n const analytics = useAnalytics();\n\n const defaultOnNodeClick = useCallback(\n (node: EntityNode, _: MouseEvent<unknown>) => {\n const nodeEntityName = parseEntityRef(node.id);\n const path = catalogEntityRoute({\n kind: nodeEntityName.kind.toLocaleLowerCase('en-US'),\n namespace: nodeEntityName.namespace.toLocaleLowerCase('en-US'),\n name: nodeEntityName.name,\n });\n analytics.captureEvent(\n 'click',\n node.entity.metadata.title ?? humanizeEntityRef(nodeEntityName),\n { attributes: { to: path } },\n );\n navigate(path);\n },\n [catalogEntityRoute, navigate, analytics],\n );\n\n const catalogGraphParams = qs.stringify(\n {\n rootEntityRefs: [stringifyEntityRef(entity)],\n maxDepth: maxDepth,\n unidirectional,\n mergeRelations,\n selectedKinds: kinds,\n selectedRelations: relations,\n direction,\n },\n { arrayFormat: 'brackets', addQueryPrefix: true },\n );\n const catalogGraphUrl = `${catalogGraphRoute()}${catalogGraphParams}`;\n\n return (\n <EntityInfoCard\n title={title}\n headerActions={action}\n footerActions={\n <ButtonLink\n iconEnd={<RiArrowRightLine />}\n variant=\"tertiary\"\n href={catalogGraphUrl}\n >\n {t('catalogGraphCard.deepLinkTitle')}\n </ButtonLink>\n }\n >\n <EntityRelationsGraph\n {...props}\n rootEntityNames={rootEntityNames || entityName}\n onNodeClick={onNodeClick || defaultOnNodeClick}\n className={classNames(classes.graph, className)}\n maxDepth={maxDepth}\n unidirectional={unidirectional}\n mergeRelations={mergeRelations}\n direction={direction}\n relationPairs={relationPairs}\n entityFilter={entityFilter}\n zoom={zoom}\n />\n </EntityInfoCard>\n );\n};\n"],"names":[],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import { Entity, CompoundEntityRef } from '@backstage/catalog-model';
|
|
3
|
-
import * as _backstage_core_components from '@backstage/core-components';
|
|
4
3
|
import { DependencyGraphTypes } from '@backstage/core-components';
|
|
5
4
|
import * as react from 'react';
|
|
6
5
|
import { MouseEventHandler, MouseEvent } from 'react';
|
|
@@ -187,7 +186,6 @@ type CustomNodeClassKey = 'node' | 'text' | 'clickable';
|
|
|
187
186
|
* @public
|
|
188
187
|
*/
|
|
189
188
|
declare const EntityCatalogGraphCard: (props: Partial<EntityRelationsGraphProps> & {
|
|
190
|
-
variant?: _backstage_core_components.InfoCardVariants;
|
|
191
189
|
height?: number;
|
|
192
190
|
title?: string;
|
|
193
191
|
action?: react.ReactNode;
|
|
@@ -309,5 +307,30 @@ interface TransformationContext {
|
|
|
309
307
|
maxDepth: number;
|
|
310
308
|
}
|
|
311
309
|
|
|
312
|
-
|
|
310
|
+
/** @public */
|
|
311
|
+
declare const catalogGraphTranslationRef: _backstage_frontend_plugin_api.TranslationRef<"catalog-graph", {
|
|
312
|
+
readonly "catalogGraphCard.title": "Relations";
|
|
313
|
+
readonly "catalogGraphCard.deepLinkTitle": "View graph";
|
|
314
|
+
readonly "catalogGraphPage.title": "Catalog Graph";
|
|
315
|
+
readonly "catalogGraphPage.filterToggleButtonTitle": "Filters";
|
|
316
|
+
readonly "catalogGraphPage.supportButtonDescription": "Start tracking your component in by adding it to the software catalog.";
|
|
317
|
+
readonly "catalogGraphPage.simplifiedSwitchLabel": "Simplified";
|
|
318
|
+
readonly "catalogGraphPage.mergeRelationsSwitchLabel": "Merge relations";
|
|
319
|
+
readonly "catalogGraphPage.zoomOutDescription": "Use pinch & zoom to move around the diagram. Click to change active node, shift click to navigate to entity.";
|
|
320
|
+
readonly "catalogGraphPage.curveFilter.title": "Curve";
|
|
321
|
+
readonly "catalogGraphPage.curveFilter.curveStepBefore": "Step Before";
|
|
322
|
+
readonly "catalogGraphPage.curveFilter.curveMonotoneX": "Monotone X";
|
|
323
|
+
readonly "catalogGraphPage.directionFilter.title": "Direction";
|
|
324
|
+
readonly "catalogGraphPage.directionFilter.leftToRight": "Left to right";
|
|
325
|
+
readonly "catalogGraphPage.directionFilter.rightToLeft": "Right to left";
|
|
326
|
+
readonly "catalogGraphPage.directionFilter.topToBottom": "Top to bottom";
|
|
327
|
+
readonly "catalogGraphPage.directionFilter.bottomToTop": "Bottom to top";
|
|
328
|
+
readonly "catalogGraphPage.maxDepthFilter.title": "Max depth";
|
|
329
|
+
readonly "catalogGraphPage.maxDepthFilter.inputPlaceholder": "∞ Infinite";
|
|
330
|
+
readonly "catalogGraphPage.maxDepthFilter.clearButtonAriaLabel": "clear max depth";
|
|
331
|
+
readonly "catalogGraphPage.selectedKindsFilter.title": "Kinds";
|
|
332
|
+
readonly "catalogGraphPage.selectedRelationsFilter.title": "Relations";
|
|
333
|
+
}>;
|
|
334
|
+
|
|
335
|
+
export { ALL_RELATIONS, ALL_RELATION_PAIRS, CatalogGraphPage, DefaultCatalogGraphApi, Direction, EntityCatalogGraphCard, EntityRelationsGraph, catalogGraphApiRef, catalogGraphPlugin, catalogGraphRouteRef, catalogGraphTranslationRef };
|
|
313
336
|
export type { CatalogGraphApi, CustomLabelClassKey, CustomNodeClassKey, DefaultCatalogGraphApiOptions, DefaultRelations, DefaultRelationsExclude, DefaultRelationsInclude, EntityEdge, EntityEdgeData, EntityNode, EntityNodeData, EntityRelationsGraphClassKey, EntityRelationsGraphProps, RelationPairs, TransformationContext };
|
package/dist/index.esm.js
CHANGED
|
@@ -6,4 +6,5 @@ export { catalogGraphPlugin } from './plugin.esm.js';
|
|
|
6
6
|
export { catalogGraphRouteRef } from './routes.esm.js';
|
|
7
7
|
export { ALL_RELATIONS, ALL_RELATION_PAIRS } from './lib/types/relations.esm.js';
|
|
8
8
|
export { Direction } from './lib/types/graph.esm.js';
|
|
9
|
+
export { catalogGraphTranslationRef } from './translation.esm.js';
|
|
9
10
|
//# sourceMappingURL=index.esm.js.map
|
package/dist/index.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
package/dist/package.json.esm.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
var name = "@backstage/plugin-catalog-graph";
|
|
2
|
-
var version = "0.
|
|
2
|
+
var version = "0.6.0";
|
|
3
3
|
var backstage = {
|
|
4
4
|
role: "frontend-plugin",
|
|
5
5
|
pluginId: "catalog-graph",
|
|
@@ -55,9 +55,11 @@ var dependencies = {
|
|
|
55
55
|
"@backstage/frontend-plugin-api": "workspace:^",
|
|
56
56
|
"@backstage/plugin-catalog-react": "workspace:^",
|
|
57
57
|
"@backstage/types": "workspace:^",
|
|
58
|
+
"@backstage/ui": "workspace:^",
|
|
58
59
|
"@material-ui/core": "^4.12.2",
|
|
59
60
|
"@material-ui/icons": "^4.9.1",
|
|
60
61
|
"@material-ui/lab": "4.0.0-alpha.61",
|
|
62
|
+
"@remixicon/react": "^4.6.0",
|
|
61
63
|
classnames: "^2.3.1",
|
|
62
64
|
lodash: "^4.17.15",
|
|
63
65
|
"p-limit": "^3.1.0",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"package.json.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"package.json.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"translation.esm.js","sources":["../src/translation.ts"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { createTranslationRef } from '@backstage/frontend-plugin-api';\n\n/** @
|
|
1
|
+
{"version":3,"file":"translation.esm.js","sources":["../src/translation.ts"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { createTranslationRef } from '@backstage/frontend-plugin-api';\n\n/** @public */\nexport const catalogGraphTranslationRef = createTranslationRef({\n id: 'catalog-graph',\n messages: {\n catalogGraphCard: {\n title: 'Relations',\n deepLinkTitle: 'View graph',\n },\n catalogGraphPage: {\n title: 'Catalog Graph',\n filterToggleButtonTitle: 'Filters',\n supportButtonDescription:\n 'Start tracking your component in by adding it to the software catalog.',\n simplifiedSwitchLabel: 'Simplified',\n mergeRelationsSwitchLabel: 'Merge relations',\n zoomOutDescription:\n 'Use pinch & zoom to move around the diagram. Click to change active node, shift click to navigate to entity.',\n curveFilter: {\n title: 'Curve',\n curveMonotoneX: 'Monotone X',\n curveStepBefore: 'Step Before',\n },\n directionFilter: {\n title: 'Direction',\n leftToRight: 'Left to right',\n rightToLeft: 'Right to left',\n topToBottom: 'Top to bottom',\n bottomToTop: 'Bottom to top',\n },\n maxDepthFilter: {\n title: 'Max depth',\n inputPlaceholder: '∞ Infinite',\n clearButtonAriaLabel: 'clear max depth',\n },\n selectedKindsFilter: {\n title: 'Kinds',\n },\n selectedRelationsFilter: {\n title: 'Relations',\n },\n },\n },\n});\n"],"names":[],"mappings":";;AAkBO,MAAM,6BAA6B,oBAAA,CAAqB;AAAA,EAC7D,EAAA,EAAI,eAAA;AAAA,EACJ,QAAA,EAAU;AAAA,IACR,gBAAA,EAAkB;AAAA,MAChB,KAAA,EAAO,WAAA;AAAA,MACP,aAAA,EAAe;AAAA,KACjB;AAAA,IACA,gBAAA,EAAkB;AAAA,MAChB,KAAA,EAAO,eAAA;AAAA,MACP,uBAAA,EAAyB,SAAA;AAAA,MACzB,wBAAA,EACE,wEAAA;AAAA,MACF,qBAAA,EAAuB,YAAA;AAAA,MACvB,yBAAA,EAA2B,iBAAA;AAAA,MAC3B,kBAAA,EACE,8GAAA;AAAA,MACF,WAAA,EAAa;AAAA,QACX,KAAA,EAAO,OAAA;AAAA,QACP,cAAA,EAAgB,YAAA;AAAA,QAChB,eAAA,EAAiB;AAAA,OACnB;AAAA,MACA,eAAA,EAAiB;AAAA,QACf,KAAA,EAAO,WAAA;AAAA,QACP,WAAA,EAAa,eAAA;AAAA,QACb,WAAA,EAAa,eAAA;AAAA,QACb,WAAA,EAAa,eAAA;AAAA,QACb,WAAA,EAAa;AAAA,OACf;AAAA,MACA,cAAA,EAAgB;AAAA,QACd,KAAA,EAAO,WAAA;AAAA,QACP,gBAAA,EAAkB,iBAAA;AAAA,QAClB,oBAAA,EAAsB;AAAA,OACxB;AAAA,MACA,mBAAA,EAAqB;AAAA,QACnB,KAAA,EAAO;AAAA,OACT;AAAA,MACA,uBAAA,EAAyB;AAAA,QACvB,KAAA,EAAO;AAAA;AACT;AACF;AAEJ,CAAC;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@backstage/plugin-catalog-graph",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.6.0",
|
|
4
4
|
"backstage": {
|
|
5
5
|
"role": "frontend-plugin",
|
|
6
6
|
"pluginId": "catalog-graph",
|
|
@@ -61,16 +61,18 @@
|
|
|
61
61
|
"test": "backstage-cli package test"
|
|
62
62
|
},
|
|
63
63
|
"dependencies": {
|
|
64
|
-
"@backstage/catalog-client": "1.14.0
|
|
65
|
-
"@backstage/catalog-model": "1.7.
|
|
66
|
-
"@backstage/core-components": "0.18.8
|
|
67
|
-
"@backstage/core-plugin-api": "1.12.4
|
|
68
|
-
"@backstage/frontend-plugin-api": "0.
|
|
69
|
-
"@backstage/plugin-catalog-react": "2.1.0
|
|
70
|
-
"@backstage/types": "1.2.2",
|
|
64
|
+
"@backstage/catalog-client": "^1.14.0",
|
|
65
|
+
"@backstage/catalog-model": "^1.7.7",
|
|
66
|
+
"@backstage/core-components": "^0.18.8",
|
|
67
|
+
"@backstage/core-plugin-api": "^1.12.4",
|
|
68
|
+
"@backstage/frontend-plugin-api": "^0.15.0",
|
|
69
|
+
"@backstage/plugin-catalog-react": "^2.1.0",
|
|
70
|
+
"@backstage/types": "^1.2.2",
|
|
71
|
+
"@backstage/ui": "^0.13.0",
|
|
71
72
|
"@material-ui/core": "^4.12.2",
|
|
72
73
|
"@material-ui/icons": "^4.9.1",
|
|
73
74
|
"@material-ui/lab": "4.0.0-alpha.61",
|
|
75
|
+
"@remixicon/react": "^4.6.0",
|
|
74
76
|
"classnames": "^2.3.1",
|
|
75
77
|
"lodash": "^4.17.15",
|
|
76
78
|
"p-limit": "^3.1.0",
|
|
@@ -78,12 +80,12 @@
|
|
|
78
80
|
"react-use": "^17.2.4"
|
|
79
81
|
},
|
|
80
82
|
"devDependencies": {
|
|
81
|
-
"@backstage/cli": "0.36.0
|
|
82
|
-
"@backstage/core-app-api": "1.19.6
|
|
83
|
-
"@backstage/dev-utils": "1.1.21
|
|
84
|
-
"@backstage/frontend-test-utils": "0.5.1
|
|
85
|
-
"@backstage/plugin-catalog": "
|
|
86
|
-
"@backstage/test-utils": "1.7.16
|
|
83
|
+
"@backstage/cli": "^0.36.0",
|
|
84
|
+
"@backstage/core-app-api": "^1.19.6",
|
|
85
|
+
"@backstage/dev-utils": "^1.1.21",
|
|
86
|
+
"@backstage/frontend-test-utils": "^0.5.1",
|
|
87
|
+
"@backstage/plugin-catalog": "^2.0.0",
|
|
88
|
+
"@backstage/test-utils": "^1.7.16",
|
|
87
89
|
"@testing-library/dom": "^10.0.0",
|
|
88
90
|
"@testing-library/jest-dom": "^6.0.0",
|
|
89
91
|
"@testing-library/react": "^16.0.0",
|