Backstage Entity Feedback Plugin

yarn --cwd packages/app add @backstage-community/plugin-entity-feedback

import { InfoCard } from '@backstage/core-components';
import {
  EntityFeedbackResponseContent,
  EntityLikeDislikeRatingsCard,
  LikeDislikeButtons,
// Optional star variant
// EntityStarredRatingsCard,
// StarredRatingButtons,
} from '@backstage-community/plugin-entity-feedback';

// inside an overview grid on an entity page
<Grid container spacing={3} alignItems="stretch">
  {/* other cards */}
  <Grid item md={2}>
    <InfoCard title="Rate this entity">
      <LikeDislikeButtons />
      {/*
        To use stars instead of like or dislike
        <StarredRatingButtons />
      */}
    </InfoCard>
  </Grid>
  {/* other cards */}
</Grid>

// inside your EntityLayout for a service or similar kind
<EntityLayout.Route path="/feedback" title="Feedback">
  <EntityFeedbackResponseContent />
</EntityLayout.Route>

// user entity page
<EntityLayout.Route path="/" title="Overview">
  <Grid container spacing={3}>
    {/* other content */}
    <Grid item xs={12}>
      <EntityLikeDislikeRatingsCard />
      {/*
        To show star based table instead
        <EntityStarredRatingsCard />
      */}
    </Grid>
  </Grid>
</EntityLayout.Route>

// group entity page
<EntityLayout.Route path="/" title="Overview">
  <Grid container spacing={3}>
    {/* other content */}
    <Grid item xs={12}>
      <EntityLikeDislikeRatingsCard />
    </Grid>
  </Grid>
</EntityLayout.Route>

app:
  packages: 'all'

app:
  packages:
    include:
      - '@backstage-community/plugin-entity-feedback'

import { createApp } from '@backstage/frontend-defaults';
import entityFeedbackPlugin from '@backstage-community/plugin-entity-feedback/alpha';

const app = createApp({
  features: [
    entityFeedbackPlugin,
  ],
});

export default app;

app:
  extensions:
    # Disable the buttons card
    - 'entity-card:entity-feedback/ratings-buttons': false

    # Customize the buttons card
    - 'entity-card:entity-feedback/ratings-buttons':
        config:
          variant: 'starred'     # defaults to like-dislike
          title: 'Rating Buttons' # defaults to Rate this entity
          requestResponse: false  # defaults to true
          dialogTitle: 'What could be better'
          dialogResponses:
            - id: 'inaccurate'
              label: 'Inaccurate'
            - id: 'other'
              label: 'Other'

    # Disable the ratings table card
    - 'entity-card:entity-feedback/ratings-table': false

    # Customize the ratings table card
    - 'entity-card:entity-feedback/ratings-table':
        config:
          variant: 'starred'     # defaults to like-dislike
          title: 'Rating Table'  # defaults to Entity Ratings
          allEntities: true      # defaults to false

    # Disable the feedback entity content tab
    - 'entity-content:entity-feedback': false

    # Customize the feedback entity content tab
    - 'entity-content:entity-feedback':
        config:
          path: '/feedbacks'
          title: 'Feedbacks'

yarn --cwd packages/backend add @backstage-community/plugin-entity-feedback-backend

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

const backend = createBackend();

// Registers the entity feedback backend plugin
backend.add(import('@backstage-community/plugin-entity-feedback-backend'));

backend.start();

import { createRouter } from '@backstage-community/plugin-entity-feedback-backend';
import { Logger } from 'winston';
import { PluginEnvironment } from '../types';
import { Router } from 'express';

export default async function createPlugin(
  env: PluginEnvironment,
): Promise<Router> {
  // The router expects standard services from the plugin environment
  // logger identity discovery database
  return await createRouter({
    logger: env.logger as Logger,
    discovery: env.discovery,
    identity: env.identity,
    database: env.database,
  });
}

import entityFeedback from './plugins/entityFeedback';

// createEnv is your existing helper that builds a PluginEnvironment
const entityFeedbackEnv = useHotMemoize(module, () => createEnv('entity-feedback'));

async function main() {
  const apiRouter = Router();

  // other plugin mounts

  apiRouter.use(
    '/entity-feedback',
    await entityFeedback(entityFeedbackEnv),
  );

  // start the server as you do for other plugins
}