feat: allow defining signal type

this makes using especially the frontend API much usable as the signal
can be typed instead having plain json object to play around with.

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

plugins/signals-react/api-report.md

@@ -9,9 +9,9 @@ import { JsonObject } from '@backstage/types';
 // @public (undocumented)
 export interface SignalApi {
   // (undocumented)
-  subscribe(
+  subscribe<SignalType extends JsonObject = JsonObject>(
     channel: string,
-    onMessage: (message: JsonObject) => void,
+    onMessage: (message: SignalType) => void,
   ): SignalSubscriber;
 }
 
@@ -25,8 +25,10 @@ export interface SignalSubscriber {
 }
 
 // @public (undocumented)
-export const useSignal: (channel: string) => {
-  lastSignal: JsonObject | null;
+export const useSignal: <SignalType extends JsonObject = JsonObject>(
+  channel: string,
+) => {
+  lastSignal: SignalType | null;
   isSignalsAvailable: boolean;
 };
 

plugins/signals-react/src/api/SignalApi.ts

@@ -28,8 +28,8 @@ export interface SignalSubscriber {
 
 /** @public */
 export interface SignalApi {
-  subscribe(
+  subscribe<SignalType extends JsonObject = JsonObject>(
     channel: string,
-    onMessage: (message: JsonObject) => void,
+    onMessage: (message: SignalType) => void,
   ): SignalSubscriber;
 }

plugins/signals-react/src/hooks/useSignal.ts

@@ -19,18 +19,23 @@ import { JsonObject } from '@backstage/types';
 import { useEffect, useMemo, useState } from 'react';
 
 /** @public */
-export const useSignal = (channel: string) => {
+export const useSignal = <SignalType extends JsonObject = JsonObject>(
+  channel: string,
+): { lastSignal: SignalType | null; isSignalsAvailable: boolean } => {
   const apiHolder = useApiHolder();
   // Use apiHolder instead useApi in case signalApi is not available in the
   // backstage instance this is used
   const signals = apiHolder.get(signalApiRef);
-  const [lastSignal, setLastSignal] = useState<JsonObject | null>(null);
+  const [lastSignal, setLastSignal] = useState<SignalType | null>(null);
   useEffect(() => {
     let unsub: null | (() => void) = null;
     if (signals) {
-      const { unsubscribe } = signals.subscribe(channel, (msg: JsonObject) => {
-        setLastSignal(msg);
-      });
+      const { unsubscribe } = signals.subscribe<SignalType>(
+        channel,
+        (msg: SignalType) => {
+          setLastSignal(msg);
+        },
+      );
       unsub = unsubscribe;
     }
     return () => {