feat: generate random notifications in local development

Signed-off-by: Heikki Hellgren <heikki.hellgren@op.fi>

.changeset/tall-ads-shave.md

@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-notifications-backend': patch
+---
+
+Add possibility to generate random notifications on the fly in local development

plugins/notifications-backend/dev/index.ts

@@ -20,6 +20,55 @@ import {
   createBackendPlugin,
 } from '@backstage/backend-plugin-api';
 import { notificationService } from '@backstage/plugin-notifications-node';
+import { errorHandler } from '@backstage/backend-common';
+import {
+  notificationSeverities,
+  NotificationSeverity,
+} from '@backstage/plugin-notifications-common';
+import express, { Response } from 'express';
+import Router from 'express-promise-router';
+
+const randomSeverity = (): NotificationSeverity => {
+  return notificationSeverities[
+    Math.floor(Math.random() * notificationSeverities.length)
+  ];
+};
+
+const notificationTitles = [
+  'You have a new notification',
+  'Scaffolder task ended',
+  'Your entity has some issues',
+];
+const randomTitle = (): string => {
+  return notificationTitles[
+    Math.floor(Math.random() * notificationTitles.length)
+  ];
+};
+
+const notificationDescriptions = [
+  'There is a problem in the backstage',
+  'See the sound engineer, please',
+  undefined,
+];
+const randomDescription = (): string | undefined => {
+  return notificationDescriptions[
+    Math.floor(Math.random() * notificationDescriptions.length)
+  ];
+};
+
+const notificationTopics = ['Scaffolder', 'Backstage', 'Entity', undefined];
+const randomTopic = (): string | undefined => {
+  return notificationTopics[
+    Math.floor(Math.random() * notificationTopics.length)
+  ];
+};
+
+const notificationLinks = ['/catalog', '/create/tasks/123456', undefined];
+const randomLink = (): string | undefined => {
+  return notificationLinks[
+    Math.floor(Math.random() * notificationLinks.length)
+  ];
+};
 
 const notificationsDebug = createBackendPlugin({
   pluginId: 'notifications-debug',
@@ -27,25 +76,32 @@ const notificationsDebug = createBackendPlugin({
     env.registerInit({
       deps: {
         notifications: notificationService,
-        lifecycle: coreServices.lifecycle,
+        httpRouter: coreServices.httpRouter,
       },
-      async init({ notifications, lifecycle }) {
-        let interval: NodeJS.Timeout | undefined;
-        lifecycle.addStartupHook(async () => {
-          interval = setInterval(async () => {
-            await notifications.send({
-              recipients: {
-                type: 'broadcast',
-              },
-              payload: { title: 'Test notification' },
-            });
-          }, 5000);
+      async init({ notifications, httpRouter }) {
+        const router = Router();
+        router.use(express.json());
+        router.post('/', async (_, res: Response<unknown>) => {
+          await notifications.send({
+            recipients: {
+              type: 'broadcast',
+            },
+            payload: {
+              title: randomTitle(),
+              description: randomDescription(),
+              topic: randomTopic(),
+              link: randomLink(),
+              severity: randomSeverity(),
+            },
+          });
+          res.status(200).send({ status: 'ok' });
         });
+        router.use(errorHandler());
 
-        lifecycle.addShutdownHook(async () => {
-          if (interval) {
-            clearInterval(interval);
-          }
+        httpRouter.use(router);
+        httpRouter.addAuthPolicy({
+          path: '/',
+          allow: 'unauthenticated',
         });
       },
     });

plugins/notifications/dev/index.tsx

@@ -21,6 +21,8 @@ import {
   NotificationsSidebarItem,
 } from '../src';
 import { signalsPlugin } from '@backstage/plugin-signals';
+import { SidebarItem } from '@backstage/core-components';
+import AddAlert from '@material-ui/icons/AddAlert';
 
 createDevApp()
   .registerPlugin(notificationsPlugin)
@@ -35,4 +37,15 @@ createDevApp()
     path: '/notifications',
   })
   .addSidebarItem(<NotificationsSidebarItem webNotificationsEnabled />)
+  .addSidebarItem(
+    <SidebarItem
+      icon={AddAlert}
+      text="Random notification"
+      onClick={() => {
+        fetch('http://localhost:7007/api/notifications-debug/', {
+          method: 'POST',
+        });
+      }}
+    />,
+  )
   .render();