Add install instructions for older nevironments
Signed-off-by: Marek Libra <marek.libra@gmail.com>
This commit is contained in:
Marek Libra
@@ -6,7 +6,7 @@ description: How to get started with the notifications and signals
|
||||
|
||||
The Backstage Notifications System provides a way for plugins and external services to send notifications to Backstage users.
|
||||
These notifications are displayed in the dedicated page of the Backstage frontend UI or by frontend plugins per specific scenarios.
|
||||
Additionally, plugins can implement processors to send notifications through external channels like email, Slack, or MS Teams.
|
||||
Additionally, notifications can be sent to external channels (like email) via "processors" implemented within plugins.
|
||||
|
||||
Notifications can be optionally integrated with the signals (a push mechanism) to ensure users receive them immediately.
|
||||
|
||||
@@ -31,6 +31,104 @@ Example of use-cases:
|
||||
- Notifications for individuals: e.g., updates you have subscribed to, new required training courses
|
||||
- Notifications pertaining to a particular entity in the catalog: A notification might apply to an entity and the owning team.
|
||||
|
||||
## Installation in Older Environments
|
||||
|
||||
Newer versions of instances created by the create-app have both the notifications and signals plugins included by default, this section can be skipped right to the Configuration.
|
||||
|
||||
Following installation instructions are valid for enabling the plugins in older environments.
|
||||
|
||||
### Add Notifications Backend
|
||||
|
||||
```bash
|
||||
yarn workspace backend add @backstage/plugin-notifications-backend
|
||||
```
|
||||
|
||||
Add the notifications to your `backend/src/index.ts`:
|
||||
|
||||
```ts
|
||||
const backend = createBackend();
|
||||
// ...
|
||||
backend.add(import('@backstage/plugin-notifications-backend'));
|
||||
```
|
||||
|
||||
### Add Notifications Frontend
|
||||
|
||||
```bash
|
||||
yarn workspace app add @backstage/notifications
|
||||
```
|
||||
|
||||
To add the notifications main menu, add following to your `packages/app/src/components/Root/Root.tsx`:
|
||||
|
||||
```tsx
|
||||
import { NotificationsSidebarItem } from '@backstage/plugin-notifications';
|
||||
|
||||
<SidebarPage>
|
||||
<Sidebar>
|
||||
<SidebarGroup>
|
||||
// ...
|
||||
<NotificationsSidebarItem />
|
||||
</SidebarGroup>
|
||||
</Sidebar>
|
||||
</SidebarPage>;
|
||||
```
|
||||
|
||||
Also add the route to notifications to `packages/app/src/App.tsx`:
|
||||
|
||||
```tsx
|
||||
import { NotificationsPage } from '@backstage/plugin-notifications';
|
||||
|
||||
<FlatRoutes>
|
||||
// ...
|
||||
<Route path="/notifications" element={<NotificationsPage />} />
|
||||
</FlatRoutes>;
|
||||
```
|
||||
|
||||
### Optional: Add Signals Backend
|
||||
|
||||
Optionally add Signals to your backend by
|
||||
|
||||
```bash
|
||||
yarn workspace backend add @backstage/plugin-signals-backend
|
||||
```
|
||||
|
||||
Add the signals to your `backend/src/index.ts`:
|
||||
|
||||
```ts
|
||||
const backend = createBackend();
|
||||
// ...
|
||||
backend.add(import('@backstage/plugin-signals-backend'));
|
||||
```
|
||||
|
||||
### Optional: Signals Frontend
|
||||
|
||||
The use of signals is optional but improves user experience.
|
||||
|
||||
Start with:
|
||||
|
||||
```bash
|
||||
yarn workspace app add @backstage/plugin-signals
|
||||
```
|
||||
|
||||
To install the plugin, you have to add the following to your `packages/app/src/plugins.ts`:
|
||||
|
||||
```ts
|
||||
export { signalsPlugin } from '@backstage/plugin-signals';
|
||||
```
|
||||
|
||||
And make sure that your `packages/app/src/App.tsx` contains:
|
||||
|
||||
```ts
|
||||
import * as plugins from './plugins';
|
||||
|
||||
const app = createApp({
|
||||
// ...
|
||||
plugins: Object.values(plugins),
|
||||
// ...
|
||||
});
|
||||
```
|
||||
|
||||
If the signals plugin is properly configured, it will be automatically discovered by the notifications plugin and used.
|
||||
|
||||
## Configuration
|
||||
|
||||
### Notifications Backend
|
||||
@@ -209,7 +307,9 @@ curl -X POST https://[BACKSTAGE_BACKEND]/api/notifications -H "Content-Type: app
|
||||
|
||||
## Additional info
|
||||
|
||||
Additional details can be found in the plugins' implementation:
|
||||
An example of a backend plugin sending notifications can be found in https://github.com/backstage/backstage/tree/master/plugins/scaffolder-backend-module-notifications.
|
||||
|
||||
Sources of the notifications and signal plugins:
|
||||
|
||||
- https://github.com/backstage/backstage/blob/master/plugins/notifications
|
||||
|
||||
|
||||
@@ -4,17 +4,7 @@ Welcome to the notifications backend plugin!
|
||||
|
||||
## Getting started
|
||||
|
||||
```bash
|
||||
yarn workspace backend add @backstage/notifications-backend
|
||||
```
|
||||
|
||||
Add the notifications to your backend:
|
||||
|
||||
```ts
|
||||
const backend = createBackend();
|
||||
// ...
|
||||
backend.add(import('@backstage/plugin-notifications-backend'));
|
||||
```
|
||||
To install, please refer the [Getting Started](https://backstage.io/docs/notifications) Backstage Notifications and Signals documentation section.
|
||||
|
||||
For users to be able to see notifications in real-time, you have to install also
|
||||
the signals plugin (`@backstage/plugin-signals-node`, `@backstage/plugin-signals-backend`, and
|
||||
|
||||
@@ -4,40 +4,9 @@ Welcome to the notifications plugin!
|
||||
|
||||
## Getting started
|
||||
|
||||
First, install the `@backstage/plugin-notifications-backend` and `@backstage/plugin-notifications-node` packages.
|
||||
See the documentation for installation instructions.
|
||||
To install, please refer the [Getting Started](https://backstage.io/docs/notifications) Backstage Notifications and Signals documentation section.
|
||||
|
||||
Then add this frontend package:
|
||||
|
||||
```bash
|
||||
yarn workspace app add @backstage/notifications
|
||||
```
|
||||
|
||||
To add the notifications main menu, add the following to your `packages/app/src/components/Root/Root.tsx`:
|
||||
|
||||
```tsx
|
||||
import { NotificationsSidebarItem } from '@backstage/plugin-notifications';
|
||||
|
||||
<SidebarPage>
|
||||
<Sidebar>
|
||||
<SidebarGroup>
|
||||
// ...
|
||||
<NotificationsSidebarItem />
|
||||
</SidebarGroup>
|
||||
</Sidebar>
|
||||
</SidebarPage>;
|
||||
```
|
||||
|
||||
Also add the route to notifications to `packages/app/src/App.tsx`:
|
||||
|
||||
```tsx
|
||||
import { NotificationsPage } from '@backstage/plugin-notifications';
|
||||
|
||||
<FlatRoutes>
|
||||
// ...
|
||||
<Route path="/notifications" element={<NotificationsPage />} />
|
||||
</FlatRoutes>;
|
||||
```
|
||||
Please mind installing the `@backstage/plugin-notifications-backend` and `@backstage/plugin-notifications-node` packages before this frontend plugin.
|
||||
|
||||
## Real-time notifications
|
||||
|
||||
|
||||
@@ -6,41 +6,4 @@ Signals plugin allows backend plugins to publish messages to frontend plugins.
|
||||
|
||||
## Getting started
|
||||
|
||||
First install the `@backstage/plugin-signals-node` plugin to get the `SignalsService` set up.
|
||||
|
||||
Next, add Signals router to your backend in `packages/backend/src/plugins/signals.ts`:
|
||||
|
||||
```ts
|
||||
import { Router } from 'express';
|
||||
import { createRouter } from '@backstage/plugin-signals-backend';
|
||||
import { PluginEnvironment } from '../types';
|
||||
|
||||
export default async function createPlugin(
|
||||
env: PluginEnvironment,
|
||||
): Promise<Router> {
|
||||
return await createRouter({
|
||||
logger: env.logger,
|
||||
eventBroker: env.eventBroker,
|
||||
identity: env.identity,
|
||||
discovery: env.discovery,
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
Now add the signals to `packages/backend/src/index.ts`:
|
||||
|
||||
```ts
|
||||
// ...
|
||||
import signals from './plugins/signals';
|
||||
|
||||
async function main() {
|
||||
// ...
|
||||
const signalsEnv = useHotMemoize(module, () => createEnv('signals'));
|
||||
|
||||
const apiRouter = Router();
|
||||
// ...
|
||||
apiRouter.use('/signals', await signals(signalsEnv));
|
||||
apiRouter.use(notFoundHandler());
|
||||
// ...
|
||||
}
|
||||
```
|
||||
To install this signals backend plugin, please refer the [Getting Started](https://backstage.io/docs/notifications) Backstage Notifications and Signals documentation section.
|
||||
|
||||
@@ -9,23 +9,7 @@ Signals plugin allows backend plugins to publish messages to frontend plugins.
|
||||
This plugin contains client that can receive messages from the backend. To get started,
|
||||
see installation instructions from `@backstage/plugin-signals-node`, `@backstage/plugin-signals-backend`.
|
||||
|
||||
To install the plugin, you have to add the following to your `packages/app/src/plugins.ts`:
|
||||
|
||||
```ts
|
||||
export { signalsPlugin } from '@backstage/plugin-signals';
|
||||
```
|
||||
|
||||
And make sure that your `packages/app/src/App.tsx` contains:
|
||||
|
||||
```ts
|
||||
import * as plugins from './plugins';
|
||||
|
||||
const app = createApp({
|
||||
// ...
|
||||
plugins: Object.values(plugins),
|
||||
// ...
|
||||
});
|
||||
```
|
||||
To install this signals frontend plugin, please refer the [Getting Started](https://backstage.io/docs/notifications) Backstage Notifications and Signals documentation section.
|
||||
|
||||
Now you can utilize the API from other plugins using the `@backstage/plugin-signals-react` package or simply by:
|
||||
|
||||
|
||||
Reference in New Issue
Block a user