graphiql: move to new plugin pattern

plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import React, { FC } from 'react';
+import React from 'react';
 import {
   Content,
   Header,
@@ -30,7 +30,7 @@ import { graphQlBrowseApiRef } from '../../lib/api';
 import { GraphiQLBrowser } from '../GraphiQLBrowser';
 import { Typography } from '@material-ui/core';
 
-export const GraphiQLPage: FC<{}> = () => {
+export const GraphiQLPage = () => {
   const graphQlBrowseApi = useApi(graphQlBrowseApiRef);
   const endpoints = useAsync(() => graphQlBrowseApi.getEndpoints());
 

plugins/graphiql/src/index.ts

@@ -15,5 +15,6 @@
  */
 
 export { plugin } from './plugin';
+export { GraphiQLPage as Router } from './components';
 export * from './lib/api';
 export * from './route-refs';

plugins/graphiql/src/plugin.ts

@@ -15,12 +15,7 @@
  */
 
 import { createPlugin } from '@backstage/core';
-import { GraphiQLPage } from './components';
-import { graphiQLRouteRef } from './route-refs';
 
 export const plugin = createPlugin({
   id: 'graphiql',
-  register({ router }) {
-    router.addRoute(graphiQLRouteRef, GraphiQLPage);
-  },
 });