jenkins: migrate to new composability API

.changeset/popular-cars-eat.md

@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-jenkins': patch
+---
+
+Migrate to new composability API, exporting the plugin instance as `jenkinsPlugin`, the entity content as `EntityJenkinsContent`, the entity conditional as `isJenkinsAvailable`, and the entity card as `EntityLatestJenkinsRunCard`.

plugins/jenkins/dev/index.tsx

@@ -15,6 +15,6 @@
  */
 
 import { createDevApp } from '@backstage/dev-utils';
-import { plugin } from '../src/plugin';
+import { jenkinsPlugin } from '../src/plugin';
 
-createDevApp().registerPlugin(plugin).render();
+createDevApp().registerPlugin(jenkinsPlugin).render();

plugins/jenkins/src/components/Router.tsx

@@ -15,6 +15,7 @@
  */
 import React from 'react';
 import { Route, Routes } from 'react-router';
+import { useEntity } from '@backstage/plugin-catalog-react';
 import { buildRouteRef, rootRouteRef } from '../plugin';
 import { DetailedViewPage } from './BuildWithStepsPage/';
 import { JENKINS_ANNOTATION } from '../constants';
@@ -25,10 +26,19 @@ import { CITable } from './BuildsPage/lib/CITable';
 export const isPluginApplicableToEntity = (entity: Entity) =>
   Boolean(entity.metadata.annotations?.[JENKINS_ANNOTATION]);
 
-export const Router = ({ entity }: { entity: Entity }) => {
-  return !isPluginApplicableToEntity(entity) ? (
-    <MissingAnnotationEmptyState annotation={JENKINS_ANNOTATION} />
-  ) : (
+type Props = {
+  /** @deprecated The entity is now grabbed from context instead */
+  entity?: Entity;
+};
+
+export const Router = (_props: Props) => {
+  const { entity } = useEntity();
+
+  if (!isPluginApplicableToEntity(entity)) {
+    return <MissingAnnotationEmptyState annotation={JENKINS_ANNOTATION} />;
+  }
+
+  return (
     <Routes>
       <Route path={`/${rootRouteRef.path}`} element={<CITable />} />
       <Route path={`/${buildRouteRef.path}`} element={<DetailedViewPage />} />

plugins/jenkins/src/index.ts

@@ -14,8 +14,17 @@
  * limitations under the License.
  */
 
-export { plugin } from './plugin';
+export {
+  jenkinsPlugin,
+  jenkinsPlugin as plugin,
+  EntityJenkinsContent,
+  EntityLatestJenkinsRunCard,
+} from './plugin';
 export { LatestRunCard } from './components/Cards';
-export { Router, isPluginApplicableToEntity } from './components/Router';
+export {
+  Router,
+  isPluginApplicableToEntity,
+  isPluginApplicableToEntity as isJenkinsAvailable,
+} from './components/Router';
 export { JENKINS_ANNOTATION } from './constants';
 export * from './api';

plugins/jenkins/src/plugin.test.ts

@@ -14,10 +14,10 @@
  * limitations under the License.
  */
 
-import { plugin } from './plugin';
+import { jenkinsPlugin } from './plugin';
 
 describe('jenkins', () => {
   it('should export plugin', () => {
-    expect(plugin).toBeDefined();
+    expect(jenkinsPlugin).toBeDefined();
   });
 });

plugins/jenkins/src/plugin.ts

@@ -19,6 +19,8 @@ import {
   createRouteRef,
   createApiFactory,
   discoveryApiRef,
+  createRoutableExtension,
+  createComponentExtension,
 } from '@backstage/core';
 import { jenkinsApiRef, JenkinsApi } from './api';
 
@@ -32,7 +34,7 @@ export const buildRouteRef = createRouteRef({
   title: 'Jenkins run',
 });
 
-export const plugin = createPlugin({
+export const jenkinsPlugin = createPlugin({
   id: 'jenkins',
   apis: [
     createApiFactory({
@@ -41,4 +43,21 @@ export const plugin = createPlugin({
       factory: ({ discoveryApi }) => new JenkinsApi({ discoveryApi }),
     }),
   ],
+  routes: {
+    entityContent: rootRouteRef,
+  },
 });
+
+export const EntityJenkinsContent = jenkinsPlugin.provide(
+  createRoutableExtension({
+    component: () => import('./components/Router').then(m => m.Router),
+    mountPoint: rootRouteRef,
+  }),
+);
+export const EntityLatestJenkinsRunCard = jenkinsPlugin.provide(
+  createComponentExtension({
+    component: {
+      lazy: () => import('./components/Cards').then(m => m.LatestRunCard),
+    },
+  }),
+);