frontend-app-api: initial routing system implementation

Co-authored-by: Fredrik Adelöw <freben@gmail.com>
Co-authored-by: Philipp Hugenroth <philipph@spotify.com>
Co-authored-by: Johan Haals <johan.haals@gmail.com>
Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>

packages/app-next/src/examples/graphiqlPlugin.tsx

@@ -23,7 +23,6 @@ import React from 'react';
 export const GraphiqlPage = createPageExtension({
   id: 'graphiql.page',
   defaultPath: '/graphiql',
-  disabled: true,
   component: () =>
     import('@backstage/plugin-graphiql').then(({ Router }) => <Router />),
 });

packages/app-next/src/examples/pagesPlugin.tsx

@@ -21,7 +21,7 @@ import {
   createPlugin,
   useRouteRef,
 } from '@backstage/frontend-plugin-api';
-import { createRouteRef, createSubRouteRef } from '@backstage/core-plugin-api';
+import { createRouteRef } from '@backstage/core-plugin-api';
 import { Route, Routes } from 'react-router-dom';
 
 const indexRouteRef = createRouteRef({ id: 'index' });
@@ -35,7 +35,7 @@ const page1RouteRef = createRouteRef({ id: 'page1' });
 const IndexPage = createPageExtension({
   id: 'index',
   defaultPath: '/',
-  // indexRouteRef
+  routeRef: indexRouteRef,
   component: async () => {
     const Component = () => {
       const page1Link = useRouteRef(page1RouteRef);