womp womp womp

Signed-off-by: Ryan Brink <5607577+unredundant@users.noreply.github.com>

packages/app/src/App.tsx

@@ -98,6 +98,7 @@ import { techDocsPage } from './components/techdocs/TechDocsPage';
 import { ApacheAirflowPage } from '@backstage/plugin-apache-airflow';
 import { PermissionedRoute } from '@backstage/plugin-permission-react';
 import { catalogEntityCreatePermission } from '@backstage/plugin-catalog-common';
+import { ApolloExplorerPage } from '@backstage/plugin-apollo-explorer';
 
 const app = createApp({
   apis,
@@ -239,6 +240,10 @@ const routes = (
     </Route>
     <Route path="/azure-pull-requests" element={<AzurePullRequestsPage />} />
     <Route path="/apache-airflow" element={<ApacheAirflowPage />} />
+    <Route
+      path="/apollo-explorer"
+      element={<ApolloExplorerPage graphRef="Github-API-ikji88@current" />}
+    />
   </FlatRoutes>
 );
 

plugins/apollo-explorer/src/components/ApolloExplorer/ExampleComponent.test.tsx

@@ -1,49 +0,0 @@
-/*
- * Copyright 2022 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 React from 'react';
-import { ExampleComponent } from './ExampleComponent';
-import { ThemeProvider } from '@material-ui/core';
-import { lightTheme } from '@backstage/theme';
-import { rest } from 'msw';
-import { setupServer } from 'msw/node';
-import {
-  setupRequestMockHandlers,
-  renderInTestApp,
-} from '@backstage/test-utils';
-
-describe('ExampleComponent', () => {
-  const server = setupServer();
-  // Enable sane handlers for network requests
-  setupRequestMockHandlers(server);
-
-  // setup mock response
-  beforeEach(() => {
-    server.use(
-      rest.get('/*', (_, res, ctx) => res(ctx.status(200), ctx.json({}))),
-    );
-  });
-
-  it('should render', async () => {
-    const rendered = await renderInTestApp(
-      <ThemeProvider theme={lightTheme}>
-        <ExampleComponent />
-      </ThemeProvider>,
-    );
-    expect(
-      rendered.getByText('Welcome to apollo-explorer!'),
-    ).toBeInTheDocument();
-  });
-});

plugins/apollo-explorer/src/components/ApolloExplorer/ExampleComponent.tsx

@@ -1,51 +0,0 @@
-/*
- * Copyright 2022 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 React from 'react';
-import { Content, Header, HeaderLabel, Page } from '@backstage/core-components';
-import { ApolloExplorer } from '@apollo/explorer/react';
-import { makeStyles } from '@material-ui/core';
-
-const useStyles = makeStyles(() => ({
-  explorer: {
-    height: '100%',
-  },
-}));
-
-export const ExampleComponent = () => {
-  const classes = useStyles();
-  return (
-    <Page themeId="tool">
-      <Header title="Welcome to apollo-explorer!" subtitle="Optional subtitle">
-        <HeaderLabel label="Owner" value="Team X" />
-        <HeaderLabel label="Lifecycle" value="Alpha" />
-      </Header>
-      <Content>
-        <ApolloExplorer
-          className={classes.explorer}
-          graphRef="Github-API-ikji88@current"
-          persistExplorerState
-          initialState={{
-            displayOptions: {
-              showHeadersAndEnvVars: true,
-              docsPanelState: 'open',
-              theme: 'dark',
-            },
-          }}
-        />
-      </Content>
-    </Page>
-  );
-};