@backstage/plugin-catalog-graph 0.4.8-next.3 → 0.4.8

package/CHANGELOG.md

@@ -1,5 +1,36 @@
 # @backstage/plugin-catalog-graph
 
+## 0.4.8
+
+### Patch Changes
+
+- c7603e8: Deprecate the old pattern of `create*Extension`, and replace it with the equivalent Blueprint implementation instead
+- fba7537: Memoize entity graph nodes when applying an `entityFilter` to prevent repeated redraws
+- 4a529c2: Use `entityPresentationApi` for the node title and the icon.
+- Updated dependencies
+  - @backstage/frontend-plugin-api@0.7.0
+  - @backstage/plugin-catalog-react@1.12.3
+  - @backstage/core-components@0.14.10
+  - @backstage/core-compat-api@0.2.8
+  - @backstage/catalog-model@1.6.0
+  - @backstage/catalog-client@1.6.6
+  - @backstage/core-plugin-api@1.9.3
+  - @backstage/types@1.1.1
+
+## 0.4.8-next.4
+
+### Patch Changes
+
+- Updated dependencies
+  - @backstage/frontend-plugin-api@0.7.0-next.3
+  - @backstage/catalog-model@1.6.0-next.0
+  - @backstage/core-compat-api@0.2.8-next.3
+  - @backstage/plugin-catalog-react@1.12.3-next.3
+  - @backstage/catalog-client@1.6.6-next.0
+  - @backstage/core-components@0.14.10-next.0
+  - @backstage/core-plugin-api@1.9.3
+  - @backstage/types@1.1.1
+
 ## 0.4.8-next.3
 
 ### Patch Changes

package/alpha/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-catalog-graph__alpha",
-  "version": "0.4.8-next.3",
+  "version": "0.4.8",
   "main": "../dist/alpha.esm.js",
   "module": "../dist/alpha.esm.js",
   "types": "../dist/alpha.d.ts"

package/dist/alpha.d.ts

@@ -1,4 +1,7 @@
+import * as _backstage_catalog_model from '@backstage/catalog-model';
 import * as _backstage_frontend_plugin_api from '@backstage/frontend-plugin-api';
+import React__default from 'react';
+import { Direction } from '@backstage/plugin-catalog-graph';
 
 declare const _default: _backstage_frontend_plugin_api.BackstagePlugin<{
     catalogGraph: _backstage_frontend_plugin_api.RouteRef<undefined>;
@@ -8,6 +11,93 @@ declare const _default: _backstage_frontend_plugin_api.BackstagePlugin<{
         kind: string;
         namespace: string;
     }>;
+}, {
+    "entity-card:catalog-graph/relations": _backstage_frontend_plugin_api.ExtensionDefinition<{
+        kinds: string[] | undefined;
+        relations: string[] | undefined;
+        maxDepth: number | undefined;
+        unidirectional: boolean | undefined;
+        mergeRelations: boolean | undefined;
+        direction: Direction | undefined;
+        relationPairs: [string, string][] | undefined;
+        zoom: "disabled" | "enabled" | "enable-on-click" | undefined;
+        curve: "curveStepBefore" | "curveMonotoneX" | undefined;
+        title: string | undefined;
+        height: number | undefined;
+    } & {
+        filter: string | undefined;
+    }, {
+        height?: number | undefined;
+        curve?: "curveStepBefore" | "curveMonotoneX" | undefined;
+        direction?: Direction | undefined;
+        title?: string | undefined;
+        zoom?: "disabled" | "enabled" | "enable-on-click" | undefined;
+        relations?: string[] | undefined;
+        maxDepth?: number | undefined;
+        kinds?: string[] | undefined;
+        unidirectional?: boolean | undefined;
+        mergeRelations?: boolean | undefined;
+        relationPairs?: [string, string][] | undefined;
+    } & {
+        filter?: string | undefined;
+    }, _backstage_frontend_plugin_api.ConfigurableExtensionDataRef<React__default.JSX.Element, "core.reactElement", {}> | _backstage_frontend_plugin_api.ConfigurableExtensionDataRef<(entity: _backstage_catalog_model.Entity) => boolean, "catalog.entity-filter-function", {
+        optional: true;
+    }> | _backstage_frontend_plugin_api.ConfigurableExtensionDataRef<string, "catalog.entity-filter-expression", {
+        optional: true;
+    }>, {
+        [x: string]: _backstage_frontend_plugin_api.ExtensionInput<_backstage_frontend_plugin_api.AnyExtensionDataRef, {
+            optional: boolean;
+            singleton: boolean;
+        }>;
+    }, {
+        kind: "entity-card";
+        namespace: undefined;
+        name: "relations";
+    }>;
+    "page:catalog-graph": _backstage_frontend_plugin_api.ExtensionDefinition<{
+        selectedKinds: string[] | undefined;
+        selectedRelations: string[] | undefined;
+        rootEntityRefs: string[] | undefined;
+        maxDepth: number | undefined;
+        unidirectional: boolean | undefined;
+        mergeRelations: boolean | undefined;
+        direction: Direction | undefined;
+        showFilters: boolean | undefined;
+        curve: "curveStepBefore" | "curveMonotoneX" | undefined;
+        kinds: string[] | undefined;
+        relations: string[] | undefined;
+        relationPairs: [string, string][] | undefined;
+        zoom: "disabled" | "enabled" | "enable-on-click" | undefined;
+    } & {
+        path: string | undefined;
+    }, {
+        curve?: "curveStepBefore" | "curveMonotoneX" | undefined;
+        direction?: Direction | undefined;
+        zoom?: "disabled" | "enabled" | "enable-on-click" | undefined;
+        relations?: string[] | undefined;
+        rootEntityRefs?: string[] | undefined;
+        maxDepth?: number | undefined;
+        kinds?: string[] | undefined;
+        unidirectional?: boolean | undefined;
+        mergeRelations?: boolean | undefined;
+        relationPairs?: [string, string][] | undefined;
+        selectedRelations?: string[] | undefined;
+        selectedKinds?: string[] | undefined;
+        showFilters?: boolean | undefined;
+    } & {
+        path?: string | undefined;
+    }, _backstage_frontend_plugin_api.ConfigurableExtensionDataRef<React__default.JSX.Element, "core.reactElement", {}> | _backstage_frontend_plugin_api.ConfigurableExtensionDataRef<string, "core.routing.path", {}> | _backstage_frontend_plugin_api.ConfigurableExtensionDataRef<_backstage_frontend_plugin_api.RouteRef<_backstage_frontend_plugin_api.AnyRouteRefParams>, "core.routing.ref", {
+        optional: true;
+    }>, {
+        [x: string]: _backstage_frontend_plugin_api.ExtensionInput<_backstage_frontend_plugin_api.AnyExtensionDataRef, {
+            optional: boolean;
+            singleton: boolean;
+        }>;
+    }, {
+        kind: "page";
+        namespace: undefined;
+        name: undefined;
+    }>;
 }>;
 
 export { _default as default };

package/dist/alpha.esm.js

@@ -1,67 +1,66 @@
 import React from 'react';
-import { createSchemaFromZod, createPageExtension, createPlugin } from '@backstage/frontend-plugin-api';
+import { PageBlueprint, createFrontendPlugin } from '@backstage/frontend-plugin-api';
 import { compatWrapper, convertLegacyRouteRef } from '@backstage/core-compat-api';
-import { createEntityCardExtension } from '@backstage/plugin-catalog-react/alpha';
+import { EntityCardBlueprint } from '@backstage/plugin-catalog-react/alpha';
 import { catalogGraphRouteRef, catalogEntityRouteRef } from './routes.esm.js';
-import './components/EntityRelationsGraph/EntityRelationsGraph.esm.js';
-import '@backstage/catalog-model';
-import { Direction } from './components/EntityRelationsGraph/types.esm.js';
+import { Direction } from '@backstage/plugin-catalog-graph';
 
-function getEntityGraphRelationsConfigSchema(z) {
-  return z.object({
-    kinds: z.array(z.string()).optional(),
-    relations: z.array(z.string()).optional(),
-    maxDepth: z.number().optional(),
-    unidirectional: z.boolean().optional(),
-    mergeRelations: z.boolean().optional(),
-    direction: z.nativeEnum(Direction).optional(),
-    relationPairs: z.array(z.tuple([z.string(), z.string()])).optional(),
-    zoom: z.enum(["enabled", "disabled", "enable-on-click"]).optional(),
-    curve: z.enum(["curveStepBefore", "curveMonotoneX"]).optional()
-  });
-}
-const CatalogGraphEntityCard = createEntityCardExtension({
+const CatalogGraphEntityCard = EntityCardBlueprint.makeWithOverrides({
   name: "relations",
-  configSchema: createSchemaFromZod(
-    (z) => z.object({
-      // Filter is a config required to all entity cards
-      filter: z.string().optional(),
-      title: z.string().optional(),
-      height: z.number().optional()
+  config: {
+    schema: {
+      kinds: (z) => z.array(z.string()).optional(),
+      relations: (z) => z.array(z.string()).optional(),
+      maxDepth: (z) => z.number().optional(),
+      unidirectional: (z) => z.boolean().optional(),
+      mergeRelations: (z) => z.boolean().optional(),
+      direction: (z) => z.nativeEnum(Direction).optional(),
+      relationPairs: (z) => z.array(z.tuple([z.string(), z.string()])).optional(),
+      zoom: (z) => z.enum(["enabled", "disabled", "enable-on-click"]).optional(),
+      curve: (z) => z.enum(["curveStepBefore", "curveMonotoneX"]).optional(),
       // Skipping a "variant" config for now, defaulting to "gridItem" in the component
       // For more details, see this comment: https://github.com/backstage/backstage/pull/22619#discussion_r1477333252
-    }).merge(getEntityGraphRelationsConfigSchema(z))
-  ),
-  loader: async ({ config: { filter, ...props } }) => import('./components/CatalogGraphCard/index.esm.js').then(
-    (m) => compatWrapper(/* @__PURE__ */ React.createElement(m.CatalogGraphCard, { ...props }))
-  )
+      title: (z) => z.string().optional(),
+      height: (z) => z.number().optional()
+    }
+  },
+  factory(originalFactory, { config }) {
+    return originalFactory({
+      loader: async () => import('./components/CatalogGraphCard/index.esm.js').then(
+        (m) => compatWrapper(/* @__PURE__ */ React.createElement(m.CatalogGraphCard, { ...config }))
+      )
+    });
+  }
 });
-const CatalogGraphPage = createPageExtension({
-  defaultPath: "/catalog-graph",
-  routeRef: convertLegacyRouteRef(catalogGraphRouteRef),
-  configSchema: createSchemaFromZod(
-    (z) => z.object({
-      // Path is a default config required to all pages
-      path: z.string().default("/catalog-graph"),
-      // Mapping intialState prop to config, these are the initial filter values, as opposed to configuration of the available filter values
-      initialState: z.object({
-        selectedKinds: z.array(z.string()).optional(),
-        selectedRelations: z.array(z.string()).optional(),
-        rootEntityRefs: z.array(z.string()).optional(),
-        maxDepth: z.number().optional(),
-        unidirectional: z.boolean().optional(),
-        mergeRelations: z.boolean().optional(),
-        direction: z.nativeEnum(Direction).optional(),
-        showFilters: z.boolean().optional(),
-        curve: z.enum(["curveStepBefore", "curveMonotoneX"]).optional()
-      }).merge(getEntityGraphRelationsConfigSchema(z)).optional()
-    })
-  ),
-  loader: ({ config: { path, ...props } }) => import('./components/CatalogGraphPage/index.esm.js').then(
-    (m) => compatWrapper(/* @__PURE__ */ React.createElement(m.CatalogGraphPage, { ...props }))
-  )
+const CatalogGraphPage = PageBlueprint.makeWithOverrides({
+  config: {
+    schema: {
+      selectedKinds: (z) => z.array(z.string()).optional(),
+      selectedRelations: (z) => z.array(z.string()).optional(),
+      rootEntityRefs: (z) => z.array(z.string()).optional(),
+      maxDepth: (z) => z.number().optional(),
+      unidirectional: (z) => z.boolean().optional(),
+      mergeRelations: (z) => z.boolean().optional(),
+      direction: (z) => z.nativeEnum(Direction).optional(),
+      showFilters: (z) => z.boolean().optional(),
+      curve: (z) => z.enum(["curveStepBefore", "curveMonotoneX"]).optional(),
+      kinds: (z) => z.array(z.string()).optional(),
+      relations: (z) => z.array(z.string()).optional(),
+      relationPairs: (z) => z.array(z.tuple([z.string(), z.string()])).optional(),
+      zoom: (z) => z.enum(["enabled", "disabled", "enable-on-click"]).optional()
+    }
+  },
+  factory(originalFactory, { config }) {
+    return originalFactory({
+      defaultPath: "/catalog-graph",
+      routeRef: convertLegacyRouteRef(catalogGraphRouteRef),
+      loader: () => import('./components/CatalogGraphPage/index.esm.js').then(
+        (m) => compatWrapper(/* @__PURE__ */ React.createElement(m.CatalogGraphPage, { ...config }))
+      )
+    });
+  }
 });
-var alpha = createPlugin({
+var alpha = createFrontendPlugin({
   id: "catalog-graph",
   routes: {
     catalogGraph: convertLegacyRouteRef(catalogGraphRouteRef)

package/dist/alpha.esm.js.map

@@ -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 React from 'react';\nimport {\n  createPageExtension,\n  createPlugin,\n  createSchemaFromZod,\n} from '@backstage/frontend-plugin-api';\nimport {\n  compatWrapper,\n  convertLegacyRouteRef,\n} from '@backstage/core-compat-api';\nimport { createEntityCardExtension } from '@backstage/plugin-catalog-react/alpha';\nimport { catalogGraphRouteRef, catalogEntityRouteRef } from './routes';\nimport { Direction } from './components';\n\nfunction getEntityGraphRelationsConfigSchema(\n  z: Parameters<Parameters<typeof createSchemaFromZod>[0]>[0],\n) {\n  // Mapping EntityRelationsGraphProps to config\n  // The classname and render functions are configurable only via extension overrides\n  return z.object({\n    kinds: z.array(z.string()).optional(),\n    relations: z.array(z.string()).optional(),\n    maxDepth: z.number().optional(),\n    unidirectional: z.boolean().optional(),\n    mergeRelations: z.boolean().optional(),\n    direction: z.nativeEnum(Direction).optional(),\n    relationPairs: z.array(z.tuple([z.string(), z.string()])).optional(),\n    zoom: z.enum(['enabled', 'disabled', 'enable-on-click']).optional(),\n    curve: z.enum(['curveStepBefore', 'curveMonotoneX']).optional(),\n  });\n}\n\nconst CatalogGraphEntityCard = createEntityCardExtension({\n  name: 'relations',\n  configSchema: createSchemaFromZod(z =>\n    z\n      .object({\n        // Filter is a config required to all entity cards\n        filter: z.string().optional(),\n        title: z.string().optional(),\n        height: z.number().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      })\n      .merge(getEntityGraphRelationsConfigSchema(z)),\n  ),\n  loader: async ({ config: { filter, ...props } }) =>\n    import('./components/CatalogGraphCard').then(m =>\n      compatWrapper(<m.CatalogGraphCard {...props} />),\n    ),\n});\n\nconst CatalogGraphPage = createPageExtension({\n  defaultPath: '/catalog-graph',\n  routeRef: convertLegacyRouteRef(catalogGraphRouteRef),\n  configSchema: createSchemaFromZod(z =>\n    z.object({\n      // Path is a default config required to all pages\n      path: z.string().default('/catalog-graph'),\n      // Mapping intialState prop to config, these are the initial filter values, as opposed to configuration of the available filter values\n      initialState: z\n        .object({\n          selectedKinds: z.array(z.string()).optional(),\n          selectedRelations: z.array(z.string()).optional(),\n          rootEntityRefs: z.array(z.string()).optional(),\n          maxDepth: z.number().optional(),\n          unidirectional: z.boolean().optional(),\n          mergeRelations: z.boolean().optional(),\n          direction: z.nativeEnum(Direction).optional(),\n          showFilters: z.boolean().optional(),\n          curve: z.enum(['curveStepBefore', 'curveMonotoneX']).optional(),\n        })\n        .merge(getEntityGraphRelationsConfigSchema(z))\n        .optional(),\n    }),\n  ),\n  loader: ({ config: { path, ...props } }) =>\n    import('./components/CatalogGraphPage').then(m =>\n      compatWrapper(<m.CatalogGraphPage {...props} />),\n    ),\n});\n\nexport default createPlugin({\n  id: 'catalog-graph',\n  routes: {\n    catalogGraph: convertLegacyRouteRef(catalogGraphRouteRef),\n  },\n  externalRoutes: {\n    catalogEntity: convertLegacyRouteRef(catalogEntityRouteRef),\n  },\n  extensions: [CatalogGraphPage, CatalogGraphEntityCard],\n});\n"],"names":[],"mappings":"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"}
+{"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 React from 'react';\nimport {\n  createFrontendPlugin,\n  PageBlueprint,\n} from '@backstage/frontend-plugin-api';\nimport {\n  compatWrapper,\n  convertLegacyRouteRef,\n} from '@backstage/core-compat-api';\nimport { EntityCardBlueprint } from '@backstage/plugin-catalog-react/alpha';\nimport { catalogGraphRouteRef, catalogEntityRouteRef } from './routes';\nimport { Direction } 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          compatWrapper(<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      defaultPath: '/catalog-graph',\n      routeRef: convertLegacyRouteRef(catalogGraphRouteRef),\n      loader: () =>\n        import('./components/CatalogGraphPage').then(m =>\n          compatWrapper(<m.CatalogGraphPage {...config} />),\n        ),\n    });\n  },\n});\n\nexport default createFrontendPlugin({\n  id: 'catalog-graph',\n  routes: {\n    catalogGraph: convertLegacyRouteRef(catalogGraphRouteRef),\n  },\n  externalRoutes: {\n    catalogEntity: convertLegacyRouteRef(catalogEntityRouteRef),\n  },\n  extensions: [CatalogGraphPage, CatalogGraphEntityCard],\n});\n"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -2,8 +2,8 @@
 import { Entity, CompoundEntityRef } from '@backstage/catalog-model';
 import * as _backstage_core_components from '@backstage/core-components';
 import { DependencyGraphTypes } from '@backstage/core-components';
-import * as react from 'react';
-import react__default, { MouseEventHandler, MouseEvent } from 'react';
+import * as React from 'react';
+import React__default, { MouseEventHandler, MouseEvent } from 'react';
 import { JsonObject } from '@backstage/types';
 import * as _backstage_core_plugin_api from '@backstage/core-plugin-api';
 
@@ -149,7 +149,7 @@ type EntityRelationsGraphProps = {
  *
  * @public
  */
-declare const EntityRelationsGraph: (props: EntityRelationsGraphProps) => react__default.JSX.Element;
+declare const EntityRelationsGraph: (props: EntityRelationsGraphProps) => React__default.JSX.Element;
 
 /**
  * A card that displays the directly related entities to the current entity.
@@ -160,7 +160,7 @@ declare const EntityCatalogGraphCard: (props: Partial<EntityRelationsGraphProps>
     variant?: _backstage_core_components.InfoCardVariants | undefined;
     height?: number | undefined;
     title?: string | undefined;
-}) => react.JSX.Element;
+}) => React.JSX.Element;
 /**
  * A standalone page that can be added to your application providing a viewer
  * for your entities and their relations.
@@ -179,7 +179,7 @@ declare const CatalogGraphPage: (props: {
         showFilters?: boolean | undefined;
         curve?: "curveStepBefore" | "curveMonotoneX" | undefined;
     } | undefined;
-} & Partial<EntityRelationsGraphProps>) => react.JSX.Element;
+} & Partial<EntityRelationsGraphProps>) => React.JSX.Element;
 
 /**
  * Catalog Graph Plugin instance.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-catalog-graph",
-  "version": "0.4.8-next.3",
+  "version": "0.4.8",
   "backstage": {
     "role": "frontend-plugin",
     "pluginId": "catalog-graph",
@@ -48,13 +48,13 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
-    "@backstage/catalog-client": "^1.6.5",
-    "@backstage/catalog-model": "^1.5.0",
-    "@backstage/core-compat-api": "^0.2.8-next.2",
-    "@backstage/core-components": "^0.14.10-next.0",
+    "@backstage/catalog-client": "^1.6.6",
+    "@backstage/catalog-model": "^1.6.0",
+    "@backstage/core-compat-api": "^0.2.8",
+    "@backstage/core-components": "^0.14.10",
     "@backstage/core-plugin-api": "^1.9.3",
-    "@backstage/frontend-plugin-api": "^0.7.0-next.2",
-    "@backstage/plugin-catalog-react": "^1.12.3-next.2",
+    "@backstage/frontend-plugin-api": "^0.7.0",
+    "@backstage/plugin-catalog-react": "^1.12.3",
     "@backstage/types": "^1.1.1",
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
@@ -67,11 +67,11 @@
     "react-use": "^17.2.4"
   },
   "devDependencies": {
-    "@backstage/cli": "^0.27.0-next.3",
-    "@backstage/core-app-api": "^1.14.2-next.0",
-    "@backstage/dev-utils": "^1.0.37-next.2",
-    "@backstage/plugin-catalog": "^1.22.0-next.2",
-    "@backstage/test-utils": "^1.5.10-next.2",
+    "@backstage/cli": "^0.27.0",
+    "@backstage/core-app-api": "^1.14.2",
+    "@backstage/dev-utils": "^1.0.37",
+    "@backstage/plugin-catalog": "^1.22.0",
+    "@backstage/test-utils": "^1.5.10",
     "@testing-library/dom": "^10.0.0",
     "@testing-library/jest-dom": "^6.0.0",
     "@testing-library/react": "^15.0.0",