Parseable Dataset Plugin logo

Backstage Parseable Dataset Plugin Plugin

Created by Parseable

Parseable Dataset Plugin brings Parseable datasets into your Backstage. You can open a service page and view the telemetry that matters in one place. It is listed in the Backstage plugin directory, described for viewing and exploring Parseable datasets inside Backstage.

The plugin shows datasets that your account can access. You can browse entries from Parseable without leaving the catalog. It supports live tail with pause and resume. It offers search over a time window with free text. You can copy a log entry when you need to share a clue with your team. These features help you stay focused in Backstage while you investigate.

Typical use cases include incident triage, release checks, and day to day operational review. During an incident you can keep Backstage open, jump to the service, and watch logs stream as alerts fire. After a deploy you can tail the dataset to confirm healthy behavior and spot early errors. For ongoing work you can narrow results to a timeframe and scan recent events to understand trends.

Installation Instructions

These instructions apply to self-hosted Backstage only.

Install the package

Copy
# from your Backstage root
yarn --cwd packages/app add @parseable/backstage-plugin-logstream

Configure app config

Add the Parseable config to your app config. The value reads from an environment variable.

Copy
# app-config.yaml
parseable:
  basicAuthCredential: ${PARSEABLE_B64_CRED}

Set the environment variable

Create a base64 value from username password in the form username:password. Then export it.

Copy
# macOS or Linux
export PARSEABLE_B64_CRED=$(printf "%s" "username:password" | base64)

For a one time run you can prefix your app start command.

Copy
PARSEABLE_B64_CRED=$(printf "%s" "username:password" | base64) yarn dev

Wire the plugin into the app

Add the plugin to your app instance.

Copy
// packages/app/src/App.tsx
import { createApp } from '@backstage/app-defaults';
import { parseableLogstreamPlugin } from '@parseable/backstage-plugin-logstream';
import { FlatRoutes } from '@backstage/core-app-api';
import { Route } from 'react-router';

const app = createApp({
  apis: {},
  plugins: [
    parseableLogstreamPlugin,
  ],
});

const App = () => (
  <AppProvider>
    <AppRouter>
      <FlatRoutes>
        <Route path="/*" element={<Root />} />
      </FlatRoutes>
    </AppRouter>
  </AppProvider>
);

export default app.createRoot(App);

Add a tab on the entity page

Import the plugin components and route them onto the service page. This shows a Logs tab only when the entity has the correct annotation.

Copy
// packages/app/src/components/catalog/EntityPage.tsx
import React from 'react';
import { EntityLayout } from '@backstage/plugin-catalog';
import {
  EntityParseableLogstreamContent,
  isParseableLogstreamAvailable,
} from '@parseable/backstage-plugin-logstream';

const serviceEntityPage = (
  <EntityLayout>
    {/* other tabs */}
    <EntityLayout.Route
      path="/parseable"
      title="Logs"
      if={isParseableLogstreamAvailable}
    >
      <EntityParseableLogstreamContent />
    </EntityLayout.Route>
  </EntityLayout>
);

export default serviceEntityPage;

Place or merge the route into your existing entity page layout so users can click the Logs tab.

Annotate your entities

Add the base URL for your Parseable instance on each entity that should show logs.

Copy
apiVersion: backstage.io/v1alpha1
kind: Component
metadata:
  name: example-service
  annotations:
    parseable.io/base-url: https://demo.parseable.com
spec:
  type: service

Backend setup

No backend package is required for this plugin. There is nothing to install on the backend.

This works with the new backend system and the old backend system with no changes.

Example entity yaml

Copy
apiVersion: backstage.io/v1alpha1
kind: Component
metadata:
  name: example-service
  description: An example service with Parseable logs
  annotations:
    parseable.io/base-url: https://demo.parseable.com
spec:
  type: service
  lifecycle: production
  owner: team-a
  system: system-a

Changelog

This changelog is produced from commits made to the Parseable Dataset Plugin plugin since 4 months ago, and based on the code located here. It may not contain information about all commits. Releases and version bumps are intentionally omitted. This changelog is generated by AI.

Bug Fixes

  • Fix Material Table rendering issues #5 merged 3 months ago
  • Fix plugin errors #3 merged 3 months ago

UI

  • Update UI terminology for clarity #5 merged 3 months ago

Documentation

  • Add release instructions #4 merged 3 months ago

Reverts

  • Revert query time range support, colored log levels, schema validation changes, error handling updates, and loading state updates from #1 #2 merged 4 months ago

Set up Backstage in minutes with Roadie