diff --git a/.changeset/migrate-1713465873342.md b/.changeset/migrate-1713465873342.md new file mode 100644 index 0000000000..eb6d1ae355 --- /dev/null +++ b/.changeset/migrate-1713465873342.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-apollo-explorer': patch +--- + +These packages have been migrated to the [backstage/community-plugins](https://github.com/backstage/community-plugins) repository. diff --git a/plugins/apollo-explorer/README.md b/plugins/apollo-explorer/README.md index bc06612cab..614a12b7c7 100644 --- a/plugins/apollo-explorer/README.md +++ b/plugins/apollo-explorer/README.md @@ -1,104 +1,3 @@ -# apollo-explorer +# Deprecated -Welcome to the Apollo Explorer plugin! - -This plugin allows users to directly embed an [Apollo](https://www.apollographql.com) graph explorer directly into -Backstage! - -## Getting started - -### Getting an Apollo Graph Reference - -First things first, you will need an Apollo account, and a graph imported into your account. This is beyond the scope of -this plugin, so if you are totally new to Apollo, please reference their official -documentation [here](https://www.apollographql.com/docs). - -Once you have a graph set up in Apollo, we need to grab the graph reference. First, go to your Apollo graphs home page and choose the graph you wish to embed. - -![Apollo Graph List](./docs/img/apollo-graph-list.png) - -Once you are in your graph explorer, click the dropdown next to the share icon and select `Share as Embedded` - -![Share as Embedded](./docs/img/share-as-embedded.png) - -This modal contains a number of useful properties, all of which can be passed to the plugin via the component properties, but the only mandatory input we need from here is the `graphRef`. - -![Graph Ref](./docs/img/graph-ref.png) - -Hold on to this snippet for a second while we set up the plugin ✨ - -### Installing the Backstage Plugin - -First, add the plugin to your Backstage app - -```shell -yarn --cwd packages/app add @backstage/plugin-apollo-explorer -``` - -Then, in `packages/app/src/App.tsx` add the plugin as a `Route` - -```typescript -import { ApolloExplorerPage } from '@backstage/plugin-apollo-explorer'; - -const routes = ( - - {/* other routes... */} - - } - /> -``` - -Then, in `packages/app/src/components/Root/Root.tsx` add a sidebar item so users can find your beautiful plugin! - -```typescript - -``` - -That's it! You should now see an `Apollo Explorer` item in your sidebar, and if you click it, you should see your graph(s) load and direct you to authenticate via Apollo! - -![Needs Auth](./docs/img/needs-auth.png) - -Once you authenticate, your graph is ready to use 🚀 - -![Logged In](./docs/img/logged-in.png) - -### Authentication Tokens for Apollo Studio - -If you need to utilize an ApiRef to supply a token to Apollo, you may do so using an ApiHolder. - -In `packages/app/src/App.tsx` perform the following modifications from above. The import `ssoAuthApiRef` is used as an example and **does not exist**. - -```typescript -import { ApolloExplorerPage, EndpointProps } from '@backstage/plugin-apollo-explorer'; -import { ssoAuthApiRef } from '@companyxyz/devkit'; -import { ApiHolder } from '@backstage/core-plugin-api'; - -async function authCallback(options: { apiHolder: ApiHolder }): Promise<{token: string}> { - const sso = options.apiHolder.get(ssoAuthApiRef) - return await sso.getToken() -} - -const routes = ( - - {/* other routes... */} - - } - /> -``` +This package has been moved to the [backstage-community/plugins](https://github.com/backstage/community-plugins) repository. Migrate to using `@backstage-community/plugin-apollo-explorer` instead. diff --git a/plugins/apollo-explorer/package.json b/plugins/apollo-explorer/package.json index bc4c4635b5..03cf8117ed 100644 --- a/plugins/apollo-explorer/package.json +++ b/plugins/apollo-explorer/package.json @@ -2,7 +2,8 @@ "name": "@backstage/plugin-apollo-explorer", "version": "0.2.0", "backstage": { - "role": "frontend-plugin" + "role": "frontend-plugin", + "moved": "@backstage-community/plugin-apollo-explorer" }, "publishConfig": { "access": "public", @@ -52,5 +53,6 @@ "react": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" - } + }, + "deprecated": "This package has been moved to the backstage/community-plugins repository. You should migrate to using @backstage-community/plugin-apollo-explorer instead." }