Opsgenie plugin for Backstage

Welcome to the Opsgenie plugin!

Alerts page:

Incidents page:

Alerts card:

Plugin Setup

1. If you have standalone app (you didn't clone this repository), then do:

yarn add @k-phoen/backstage-plugin-opsgenie

2. Configure the plugin:

proxy:
  '/opsgenie/api':
    target: https://api.eu.opsgenie.com
    headers:
      Authorization: GenieKey [[ API KEY here ]]

opsgenie:
  domain: https://my-app.app.eu.opsgenie.com/

Note: this plugin requires an API key issued from an integration. They can be retrieved from the "Settings" tab and then "Integrations" tab.

3. Expose the plugin to your Backstage instance:

// packages/app/src/App.tsx
import { OpsgeniePage } from '@k-phoen/backstage-plugin-opsgenie';

// ...

const AppRoutes = () => (
  <FlatRoutes>
    /// ...
    <Route path="/opsgenie" element={<OpsgeniePage />} />
    // ...
  </FlatRoutes>
);

4. Add it to the EntityPage.ts:

import {
  EntityOpsgenieAlertsCard,
  isOpsgenieAvailable
} from '@k-phoen/backstage-plugin-opsgenie';

// add wherever you want to display the alerts card:
<EntitySwitch>
  <EntitySwitch.Case if={isOpsgenieAvailable}>
    <EntityOpsgenieAlertsCard />
  </EntitySwitch.Case>
</EntitySwitch>

5. Run backstage app with yarn start and navigate to services tabs.

Components annotations

In order for this plugin to know what alerts belong to which component, a selector must be defined:

annotations:
  opsgenie.com/component-selector: 'tag:"service:my-awesome-service"'

This annotation accepts any valid Opsgenie search query for alerts.