Wiz logo

Backstage Wiz Plugin

See Wiz issues status in Backstage

Created by Roadie

Available on Roadie

Wiz is the unified cloud security platform with prevention and response capabilities, enabling security and development teams to build faster and more securely.

The Backstage Wiz Plugin integrates Wiz, a cloud security platform, into your Backstage instance, providing information about recently created issues, their status and severity.

Set up Backstage in minutes with Roadie

A preview of Wiz issues.

Installation steps

The plugin requires Wiz backend plugin to be installed first. The backend plugin handles authentication and retrieving data. You can read more about it in Prerequisites and Getting Started section below.

yarn --cwd packages/backend add @roadiehq/plugin-wiz-backend

After installing backend plugin you can proceed with installing frontend part.

yarn --cwd packages/app add @roadiehq/backstage-plugin-wiz

Add plugin components to your Entity Page

// packages/app/src/components/catalog/EntityPage.tsx
  import {
  EntityWizIssues,
  isWizAvailable,
  EntityIssuesWidget,
  EntityIssuesChart,
  EntitySeverityChart,
  } from '@roadiehq/backstage-plugin-wiz';

Add annotation to the yaml config file of a component

metadata:
  annotations:
      wiz.io/project-id: <your-project-id>

Add widgets under overviewContent, based on which card (widget) you wish to display.

// packages/app/src/components/catalog/EntityPage.tsx
<EntitySwitch>
    <EntitySwitch.Case if={isWizAvailable}>
        <Grid item md={6}>
            <EntityIssuesWidget />
        </Grid>
    </EntitySwitch.Case>
</EntitySwitch>

<EntitySwitch>
  <EntitySwitch.Case if={isWizAvailable}>
      <Grid item md={6}>
          <EntityIssuesChart />
      </Grid>
  </EntitySwitch.Case>
</EntitySwitch>

<EntitySwitch>
  <EntitySwitch.Case if={isWizAvailable}>
      <Grid item md={6}>
          <EntitySeverityChart />
      </Grid>
  </EntitySwitch.Case>
</EntitySwitch>

Add a new tab with all the issues for the project id you have specified in annotations, under serviceEntityPage.

// packages/app/src/components/catalog/EntityPage.tsx

<EntityLayout.Route path="/wiz" title="WIZ">
    <EntityWizIssues />
</EntityLayout.Route>

Found a mistake? Update these instructions.

Things to know

Prerequisites

To begin using the Wiz backend plugin, you will need the following parameters:

  • Wiz API URL (API Endpoint URL)
  • Wiz Token URL
  • Client ID and Client Secret

In order to retrieve those, you can read official documentation, which describes how to obtain the values.

The Wiz GraphQL API has a single endpoint:

Where <TENANT_DATA_CENTER> is the Wiz regional data center your tenant resides in (e.g., us1, us2, eu1, or eu2).

Getting Started

After obtaining all of the above, add the Wiz configuration in your app-config.yaml:

wiz:
  clientId: <Client ID>
  clientSecret: <Client Secret>
  tokenUrl: <Wiz token URL>
  wizAPIUrl: <API Endpoint URL>
  dashboardLink: <your-wiz-url>

Create a file in packages/backend/src/plugins/wiz.ts

import { createRouter } from '@roadiehq/plugin-wiz-backend';

export default async function createPlugin({
  logger,
  config,
}: PluginEnvironment) {
  return await createRouter({ logger, config });
})

In packages/backend/src/index.ts add the following:

import wiz from './plugins/wiz';
// ...
async function main() {
  // ...
  const wizEnv = useHotMemoize(module, () => createEnv('wiz'));

  const wizConfig = {
    clientId: config.getOptionalString('wiz.clientId'),
    clientSecret: config.getOptionalString('wiz.clientSecret'),
    tokenUrl: config.getOptionalString('wiz.tokenUrl'),
    apiUrl: config.getOptionalString('wiz.wizAPIUrl'),
  };

  const apiRouter = Router();
  if (
    wizConfig.enabled &&
    wizConfig.clientId &&
    wizConfig.clientSecret &&
    wizConfig.tokenUrl &&
    wizConfig.apiUrl
  ) {
    router.use('/wiz-backend', await wiz(wizEnv));
  }
  await wiz(wizEnv);
  // ...
}

At this point you can generate access token you will need for API calls towards WIZ.

Set up Backstage in minutes with Roadie