app-next: switch to using real graphiql plugin

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>

packages/app-next/src/App.tsx

@@ -18,7 +18,7 @@ import { graphiqlPlugin as legacyGraphiqlPlugin } from '@backstage/plugin-graphi
 import { createApp as createLegacyApp } from '@backstage/app-defaults';
 import { createApp } from '@backstage/frontend-app-api';
 import { pagesPlugin } from './examples/pagesPlugin';
-import { graphiqlPlugin } from './examples/graphiqlPlugin';
+import { graphiqlPlugin } from '@backstage/plugin-graphiql/alpha';
 
 /*
 

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

@@ -1,33 +0,0 @@
-/*
- * Copyright 2023 The Backstage Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import {
-  createPageExtension,
-  createPlugin,
-} from '@backstage/frontend-plugin-api';
-import React from 'react';
-
-export const GraphiqlPage = createPageExtension({
-  id: 'graphiql.page',
-  defaultPath: '/graphiql',
-  component: () =>
-    import('@backstage/plugin-graphiql').then(({ Router }) => <Router />),
-});
-
-export const graphiqlPlugin = createPlugin({
-  id: 'graphiql',
-  extensions: [GraphiqlPage],
-});