diff --git a/packages/core/src/api/app/AppBuilder.tsx b/packages/core/src/api/app/AppBuilder.tsx index f65482b996..57c4eccf16 100644 --- a/packages/core/src/api/app/AppBuilder.tsx +++ b/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( + , + ); + break; + } case 'redirect-route': { const { path, target, options = {} } = output; const { exact = true } = options; diff --git a/packages/core/src/api/plugin/Plugin.tsx b/packages/core/src/api/plugin/Plugin.tsx index 3d067c66ad..d4f4aed2a6 100644 --- a/packages/core/src/api/plugin/Plugin.tsx +++ b/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, + options?: RouteOptions, + ): void; + registerRoute( path: RoutePath, Component: ComponentType, @@ -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 }); }, diff --git a/packages/core/src/api/plugin/types.ts b/packages/core/src/api/plugin/types.ts index c4ac426e5c..2c471f5aca 100644 --- a/packages/core/src/api/plugin/types.ts +++ b/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;