OpenFeedback Plugin for Backstage

July 6, 2026 · View on GitHub

Hello! :wave:

OpenFeedback is a simple plugin for Backstage that lets your users submit feedback from within your portal — and gives administrators a central place to view, archive, and manage it.

Warning

Breaking change — v1.0.0 and above requires the New Frontend System. The OpenFeedbackPage component and openFeedbackPlugin named exports have been removed. The plugin now ships as a New Frontend System plugin only and must be used with @backstage/frontend-defaults (or any NFS-compatible Backstage app). If you are still on the old frontend system, stay on v0.x.

Key Features

  • Feedback modal — a sidebar button that opens a dialog for users to submit feedback as themselves or anonymously
  • Feedback page — an admin view showing all submitted feedback as cards, with archive and delete actions
  • Archive & restore — move feedback out of the active view without permanently deleting it; restore it any time
  • Permissions — fine-grained control over who can read, submit, archive, and delete feedback

Screenshots

Feedback Modal

OpenFeedbackModal

Feedback Page

OpenFeedbackPage

Installation

From the root of your Backstage repository:

yarn --cwd packages/app add @parsifal-m/backstage-plugin-open-feedback
yarn --cwd packages/backend add @parsifal-m/backstage-plugin-open-feedback-backend

Backend Setup

Add the backend plugin to packages/backend/src/index.ts:

import { createBackend } from '@backstage/backend-defaults';

const backend = createBackend();

backend.add(import('@parsifal-m/backstage-plugin-open-feedback-backend'));

backend.start();

Frontend Setup

Add the plugin to your app's feature list in packages/app/src/App.tsx:

import { createApp } from '@backstage/frontend-defaults';
import openFeedbackPlugin from '@parsifal-m/backstage-plugin-open-feedback';

const app = createApp({
  features: [
    // ... other plugins
    openFeedbackPlugin,
  ],
});

export default app.createRoot();

The feedback page is mounted at /open-feedback by default (with sub-routes /open-feedback/active and /open-feedback/archived). You can override the path and title via app-config.yaml:

app:
  extensions:
    - page:open-feedback:
        config:
          path: /my-feedback # optional, defaults to /open-feedback
          title: Team Feedback # optional, defaults to "Open Feedback"

Adding the Feedback Modal

Add OpenFeedbackModal to your sidebar in packages/app/src/components/Root/Root.tsx:

import { OpenFeedbackModal } from '@parsifal-m/backstage-plugin-open-feedback';

<Sidebar>
  {/* ... */}
  <OpenFeedbackModal />
</Sidebar>

The component accepts optional props to customise its appearance and behaviour — see the source for the full list.

Permissions

OpenFeedback ships with four permissions: read, submit, archive, and delete. The UI buttons are already gated — no extra wiring needed for basic use.

See docs/permissions.md for the full reference, backend policy wiring, and how to conditionally hide the nav item.

Contributing

Contributions are welcome! Feel free to pick up any open issues or suggest new features by opening one.

See CONTRIBUTING.md for details. You can also reach me on Mastodon at @parcifal.