diff --git a/packages/dev-utils/src/devApp/apiFactories.ts b/packages/dev-utils/src/devApp/apiFactories.ts index 162375cf1c..967918d87a 100644 --- a/packages/dev-utils/src/devApp/apiFactories.ts +++ b/packages/dev-utils/src/devApp/apiFactories.ts @@ -22,6 +22,8 @@ import { createApiFactory, ErrorAlerter, AlertApiForwarder, + oauthRequestApiRef, + OAuthRequestManager, } from '@backstage/core'; // TODO(rugvip): We should likely figure out how to reuse all of these between apps @@ -41,3 +43,9 @@ export const errorApiFactory = createApiFactory({ factory: ({ alertApi }) => new ErrorAlerter(alertApi, new ErrorApiForwarder()), }); + +export const oauthRequestApiFactory = createApiFactory({ + implements: oauthRequestApiRef, + deps: {}, + factory: () => new OAuthRequestManager(), +}); diff --git a/packages/dev-utils/src/devApp/render.tsx b/packages/dev-utils/src/devApp/render.tsx index 72c9581a84..b174a0447f 100644 --- a/packages/dev-utils/src/devApp/render.tsx +++ b/packages/dev-utils/src/devApp/render.tsx @@ -15,7 +15,7 @@ */ import { hot } from 'react-hot-loader/root'; -import React, { FC, ComponentType } from 'react'; +import React, { FC, ComponentType, ReactNode } from 'react'; import ReactDOM from 'react-dom'; import { BrowserRouter } from 'react-router-dom'; import BookmarkIcon from '@material-ui/icons/Bookmark'; @@ -30,6 +30,7 @@ import { ApiTestRegistry, ApiHolder, AlertDisplay, + OAuthRequestDialog, } from '@backstage/core'; import * as defaultApiFactories from './apiFactories'; @@ -43,6 +44,7 @@ type BackstagePlugin = ReturnType; class DevAppBuilder { private readonly plugins = new Array(); private readonly factories = new Array>(); + private readonly rootChildren = new Array(); /** * Register one or more plugins to render in the dev app @@ -62,6 +64,16 @@ class DevAppBuilder { return this; } + /** + * Adds a React node to place just inside the App Provider. + * + * Useful for adding more global components like the AlertDisplay. + */ + addRootChild(node: ReactNode): DevAppBuilder { + this.rootChildren.push(node); + return this; + } + /** * Build a DevApp component using the resources registered so far */ @@ -79,6 +91,8 @@ class DevAppBuilder { return ( + + {this.rootChildren} {sidebar}