packages/core: new addRoute to router hook that adds a nav-target route

packages/core/src/api/app/AppBuilder.tsx

@@ -84,6 +84,19 @@ export default class AppBuilder {
             );
             break;
           }
+          case 'nav-target-component': {
+            const { target, component, options = {} } = output;
+            const { exact = true } = options;
+            routes.push(
+              <Route
+                key={`${plugin.getId()}-${target.path}`}
+                path={target.path}
+                component={component}
+                exact={exact}
+              />,
+            );
+            break;
+          }
           case 'redirect-route': {
             const { path, target, options = {} } = output;
             const { exact = true } = options;

packages/core/src/api/plugin/Plugin.tsx

@@ -22,6 +22,7 @@ import {
   FeatureFlagName,
 } from './types';
 import { validateBrowserCompat, validateFlagName } from '../app/FeatureFlags';
+import { NavTarget } from '../navTargets';
 
 export type PluginConfig = {
   id: string;
@@ -34,6 +35,12 @@ export type PluginHooks = {
 };
 
 export type RouterHooks = {
+  addRoute(
+    target: NavTarget,
+    Component: ComponentType<any>,
+    options?: RouteOptions,
+  ): void;
+
   registerRoute(
     path: RoutePath,
     Component: ComponentType<any>,
@@ -75,6 +82,14 @@ export default class Plugin {
 
     this.config.register({
       router: {
+        addRoute(target, component, options) {
+          outputs.push({
+            type: 'nav-target-component',
+            target,
+            component,
+            options,
+          });
+        },
         registerRoute(path, component, options) {
           outputs.push({ type: 'route', path, component, options });
         },

packages/core/src/api/plugin/types.ts

@@ -15,6 +15,7 @@
  */
 
 import { ComponentType } from 'react';
+import { NavTarget } from '../navTargets';
 
 export type RouteOptions = {
   // Whether the route path must match exactly, defaults to true.
@@ -30,6 +31,13 @@ export type RouteOutput = {
   options?: RouteOptions;
 };
 
+export type RouteTargetOutput = {
+  type: 'nav-target-component';
+  target: NavTarget;
+  component: ComponentType<{}>;
+  options?: RouteOptions;
+};
+
 export type RedirectRouteOutput = {
   type: 'redirect-route';
   path: RoutePath;
@@ -46,5 +54,6 @@ export type FeatureFlagOutput = {
 
 export type PluginOutput =
   | RouteOutput
+  | RouteTargetOutput
   | RedirectRouteOutput
   | FeatureFlagOutput;