make npm plugin public

Signed-off-by: Karthik Jeeyar <[email protected]>

workspaces/npm/plugins/npm/dev/index.tsx

@@ -15,9 +15,8 @@
  */
 import React from 'react';
 import { createDevApp } from '@backstage/dev-utils';
-import { npmPlugin, NpmReleases } from '../src/plugin';
+import { npmPlugin, NpmInfoCard, NpmReleaseTableCard } from '../src/plugin';
 import { EntityProvider } from '@backstage/plugin-catalog-react';
-import { NpmInfoCard } from '../src/components/NpmInfoCard';
 import { Content, Header, Page } from '@backstage/core-components';
 import { Grid } from '@material-ui/core';
 
@@ -46,7 +45,7 @@ createDevApp()
           <EntityProvider entity={mockEntity}>
             <Grid container>
               <Grid item xs={8}>
-                <NpmReleases />
+                <NpmReleaseTableCard />
               </Grid>
               <Grid item xs={4}>
                 <NpmInfoCard />

workspaces/npm/plugins/npm/package.json

@@ -69,7 +69,8 @@
   "homepage": "https://github.com/backstage/community-plugins/tree/main/workspaces/npm/plugins/npm",
   "bugs": "https://github.com/backstage/community-plugins/issues",
   "maintainers": [
-    "jerolimov"
+    "jerolimov",
+    "karthikjeeyar"
   ],
   "author": "Christoph Jerolimov"
 }

workspaces/npm/plugins/npm/src/index.ts

@@ -23,6 +23,8 @@
 export { npmPlugin } from './plugin';
 
 export { isNpmAvailable } from './utils/isNpmAvailable';
-export { NpmInfoCard } from './components/NpmInfoCard';
-export { NpmReleaseOverviewCard } from './components/NpmReleaseOverviewCard';
-export { NpmReleaseTableCard } from './components/NpmReleaseTableCard';
+export {
+  NpmInfoCard,
+  NpmReleaseOverviewCard,
+  NpmReleaseTableCard,
+} from './plugin';

workspaces/npm/plugins/npm/src/plugin.ts

@@ -14,8 +14,8 @@
  * limitations under the License.
  */
 import {
+  createComponentExtension,
   createPlugin,
-  createRoutableExtension,
 } from '@backstage/core-plugin-api';
 
 import { rootRouteRef } from './routes';
@@ -33,13 +33,37 @@ export const npmPlugin = createPlugin({
 });
 
 /** @public */
-export const NpmReleases = npmPlugin.provide(
-  createRoutableExtension({
-    name: 'NpmReleasesTable',
-    component: () =>
-      import('./components/NpmReleaseTableCard').then(
-        m => m.NpmReleaseTableCard,
-      ),
-    mountPoint: rootRouteRef,
+export const NpmReleaseTableCard = npmPlugin.provide(
+  createComponentExtension({
+    name: 'NpmReleaseTableCard',
+    component: {
+      lazy: () =>
+        import('./components/NpmReleaseTableCard').then(
+          m => m.NpmReleaseTableCard,
+        ),
+    },
+  }),
+);
+
+/** @public */
+export const NpmInfoCard = npmPlugin.provide(
+  createComponentExtension({
+    name: 'NpmInfoCard',
+    component: {
+      lazy: () => import('./components/NpmInfoCard').then(m => m.NpmInfoCard),
+    },
+  }),
+);
+
+/** @public */
+export const NpmReleaseOverviewCard = npmPlugin.provide(
+  createComponentExtension({
+    name: 'NpmReleaseOverviewCard',
+    component: {
+      lazy: () =>
+        import('./components/NpmReleaseOverviewCard').then(
+          m => m.NpmReleaseOverviewCard,
+        ),
+    },
   }),
 );