message: dev-utils: add path option to addPage, switch to render element in route, and skip sidebar item title is not set
diff: @@ -34,16 +34,16 @@ import {
  attachComponentData,
  } from '@backstage/core';
  import SentimentDissatisfiedIcon from '@material-ui/icons/SentimentDissatisfied';
  -import { Outlet } from 'react-router';
  const GatheringRoute: (props: {
  path: string;
  - children: JSX.Element;
  -}) => JSX.Element = () => <Outlet />;
  + element: JSX.Element;
  +}) => JSX.Element = ({ element }) => element;
  attachComponentData(GatheringRoute, 'core.gatherMountPoints', true);
  type RegisterPageOptions = {
  + path?: string;
  element: JSX.Element;
  title?: string;
  icon?: IconComponent;
  @@ -93,21 +93,30 @@ class DevAppBuilder {
  return this;
  }
  - addPage({ element, title, icon }: RegisterPageOptions): DevAppBuilder {
  - const path = `/page-${this.routes.length + 1}`;
  + /**
  + * Adds a page component along with accompanying sidebar item.
  + *
  + * If no path is provided one will be generated.
  + * If no title is provider no sidebar item will be created.
  + */
  + addPage(opts: RegisterPageOptions): DevAppBuilder {
  + const path = opts.path ?? `/page-${this.routes.length + 1}`;
  + if (opts.title) {
  this.sidebarItems.push(
  <SidebarItem
  key={path}
  to={path}
  - text={title ?? path}
  - icon={icon ?? BookmarkIcon}
  + text={opts.title}
  + icon={opts.icon ?? BookmarkIcon}
  />,
  );
  + }
  this.routes.push(
  - <GatheringRoute key={path} path={path} children={element} />,
  + <GatheringRoute key={path} path={path} element={opts.element} />,
  );
  return this;
  }
  +
  /**
  * Build a DevApp component using the resources registered so far
  */
  