Change pluginID from app to catalog-unprocessed-entities and disable tab by default

Signed-off-by: secustor <sebastian@poxhofer.at>

packages/app-next/app-config.yaml

@@ -111,6 +111,11 @@ app:
     # - entity-content:azure-devops/pull-requests
     # - entity-content:azure-devops/git-tags
 
+    # Enable the catalog-unprocessed-entities tab in devtools
+    - devtools-content:catalog-unprocessed-entities: true
+    # Disable the catalog-unprocessed-entities element outside devtools
+    - page:catalog-unprocessed-entities: false
+
   # scmAuthExtension: >-
   #   createScmAuthExtension({
   #     id: 'apis.scmAuth.addons.ghe',

packages/app-next/src/App.tsx

@@ -45,6 +45,8 @@ import { convertLegacyPageExtension } from '@backstage/core-compat-api';
 import { convertLegacyEntityContentExtension } from '@backstage/plugin-catalog-react/alpha';
 import { pluginInfoResolver } from './pluginInfoResolver';
 import { appModuleNav } from './modules/appModuleNav';
+import devtoolsPlugin from '@backstage/plugin-devtools/alpha';
+import { unprocessedEntitiesDevToolsContent } from '@backstage/plugin-catalog-unprocessed-entities/alpha';
 
 /*
 
@@ -116,6 +118,11 @@ const notFoundErrorPageModule = createFrontendModule({
   extensions: [notFoundErrorPage],
 });
 
+const devtoolsPluginUnprocessed = createFrontendModule({
+  pluginId: 'catalog-unprocessed-entities',
+  extensions: [unprocessedEntitiesDevToolsContent],
+});
+
 const collectedLegacyPlugins = convertLegacyAppRoot(
   <FlatRoutes>
     <Route path="/catalog-import" element={<CatalogImportPage />} />
@@ -133,6 +140,8 @@ const app = createApp({
     notFoundErrorPageModule,
     appModuleNav,
     customHomePageModule,
+    devtoolsPlugin,
+    devtoolsPluginUnprocessed,
     ...collectedLegacyPlugins,
   ],
   advanced: {

plugins/catalog-unprocessed-entities/README.md

@@ -55,21 +55,33 @@ import catalogUnprocessedEntitiesPlugin from '@backstage/plugin-catalog-unproces
 import { unprocessedEntitiesDevToolsContent } from '@backstage/plugin-catalog-unprocessed-entities/alpha';
 
 // Optionally add unprocessed entities route to devtools
-const appFeature = createFrontendModule({
-  pluginId: 'app',
+const devtoolsPluginUnprocessed = createFrontendModule({
+  pluginId: 'catalog-unprocessed-entities',
   extensions: [unprocessedEntitiesDevToolsContent],
 });
 
 export const app = createApp({
   features: [
-    appFeature,
     // ...
     catalogUnprocessedEntitiesPlugin,
+
+    // Optionally add unprocessed entities route to devtools
+    devtoolsPluginUnprocessed,
+    devtoolsPlugin, // devtools plugin needs to be added too, if autodiscover is disabled
     // ...
   ],
 });
 ```
 
+```yaml
+app:
+  extensions:
+    # Enable the catalog-unprocessed-entities tab in devtools
+    - devtools-content:catalog-unprocessed-entities: true
+    # Disable the catalog-unprocessed-entities element outside devtools including the sidebar
+    - page:catalog-unprocessed-entities: false
+```
+
 ## Customization
 
 If you want to use the provided endpoints in a different way, you can use the ApiRef doing the following:

plugins/catalog-unprocessed-entities/src/alpha/devToolsContent.tsx

@@ -23,6 +23,7 @@ import { DevToolsContentBlueprint } from '@backstage/plugin-devtools-react';
  */
 export const unprocessedEntitiesDevToolsContent = DevToolsContentBlueprint.make(
   {
+    disabled: true,
     params: {
       path: 'unprocessed-entities',
       title: 'Unprocessed Entities',

plugins/catalog-unprocessed-entities/src/alpha/index.ts

@@ -15,4 +15,4 @@
  */
 
 export { default } from './plugin';
-export { unprocessedEntitiesDevToolsContent } from './devToolsRoute';
+export { unprocessedEntitiesDevToolsContent } from './devToolsContent';

plugins/devtools-react/src/index.ts

@@ -22,4 +22,4 @@
 export {
   type DevToolsContentBlueprintParams,
   DevToolsContentBlueprint,
-} from './devToolsContentBlueprint.tsx';
+} from './devToolsContentBlueprint';

plugins/devtools/README.md

@@ -179,20 +179,20 @@ import { DevToolsContentBlueprint } from '@backstage/plugin-devtools-react';
 
 export const unprocessedEntitiesDevToolsContent = DevToolsContentBlueprint.make(
   {
+    disabled: true,
     params: {
       path: 'unprocessed-entities',
       title: 'Unprocessed Entities',
       loader: () =>
-        import('../components/UnprocessedEntities').then(
-          ({ UnprocessedEntitiesContent }) =>
-            createElement(UnprocessedEntitiesContent),
-        ),
+        import('../components/UnprocessedEntities').then(m => (
+          <m.UnprocessedEntitiesContent />
+        )),
     },
   },
 );
 
 const appFeature = createFrontendModule({
-  pluginId: 'app',
+  pluginId: 'catalog-unprocessed-entities',
   extensions: [unprocessedEntitiesDevToolsContent],
 });
 ```