Live: expose publish on live interfaces (#33596)

packages/grafana-runtime/src/services/live.ts

@@ -62,6 +62,13 @@ export interface GrafanaLiveSrv {
    * Join and leave messages will be sent to the open stream
    */
   getPresence(address: LiveChannelAddress): Promise<LiveChannelPresenceStatus>;
+
+  /**
+   * Publish into a channel
+   *
+   * @alpha -- experimental
+   */
+  publish(address: LiveChannelAddress, data: any): Promise<any>;
 }
 
 let singletonInstance: GrafanaLiveSrv;

public/app/features/live/dashboard/dashboardWatcher.ts

@@ -5,10 +5,10 @@ import {
   AppEvents,
   isLiveChannelMessageEvent,
   isLiveChannelStatusEvent,
+  LiveChannelAddress,
   LiveChannelConnectionState,
   LiveChannelEvent,
   LiveChannelScope,
-  toLiveChannelId,
 } from '@grafana/data';
 import { DashboardChangedModal } from './DashboardChangedModal';
 import { DashboardEvent, DashboardEventAction } from './types';
@@ -16,10 +16,9 @@ import { CoreGrafanaLiveFeature } from '../scopes';
 import { sessionId } from '../live';
 import { ShowModalReactEvent } from '../../../types/events';
 import { Unsubscribable } from 'rxjs';
-import { getBackendSrv } from 'app/core/services/backend_srv';
 
 class DashboardWatcher {
-  channel?: string; // path to the channel
+  channel?: LiveChannelAddress; // path to the channel
   uid?: string;
   ignoreSave?: boolean;
   editing = false;
@@ -36,15 +35,13 @@ class DashboardWatcher {
   }
 
   private sendEditingState() {
-    if (this.channel && this.uid) {
+    const { channel, uid } = this;
-      getBackendSrv().post(`api/live/publish`, {
+    if (channel && uid) {
-        channel: this.channel,
+      getGrafanaLiveSrv().publish(channel, {
-        data: {
+        sessionId,
-          sessionId,
+        uid,
-          uid: this.uid,
+        action: this.editing ? DashboardEventAction.EditingStarted : DashboardEventAction.EditingCanceled,
-          action: this.editing ? DashboardEventAction.EditingStarted : DashboardEventAction.EditingCanceled,
+        timestamp: Date.now(),
-          timestamp: Date.now(),
-        },
       });
     }
   }
@@ -57,17 +54,16 @@ class DashboardWatcher {
 
     // Check for changes
     if (uid !== this.uid) {
-      const addr = {
+      this.channel = {
         scope: LiveChannelScope.Grafana,
         namespace: 'dashboard',
         path: `uid/${uid}`,
       };
       this.leave();
       if (uid) {
-        this.subscription = live.getStream(addr).subscribe(this.observer);
+        this.subscription = live.getStream(this.channel).subscribe(this.observer);
       }
       this.uid = uid;
-      this.channel = toLiveChannelId(addr);
     }
   }
 

public/app/features/live/live.ts

@@ -6,6 +6,7 @@ import {
   config,
   LiveDataStreamOptions,
   toDataQueryError,
+  getBackendSrv,
 } from '@grafana/runtime';
 import { BehaviorSubject, Observable, of } from 'rxjs';
 import {
@@ -24,6 +25,7 @@ import {
   dataFrameToJSON,
   isLiveChannelMessageEvent,
   isLiveChannelStatusEvent,
+  toLiveChannelId,
 } from '@grafana/data';
 import { CentrifugeLiveChannel, getErrorChannel } from './channel';
 import {
@@ -313,6 +315,18 @@ export class CentrifugeSrv implements GrafanaLiveSrv {
   getPresence(address: LiveChannelAddress): Promise<LiveChannelPresenceStatus> {
     return this.getChannel(address).getPresence();
   }
+
+  /**
+   * Publish into a channel
+   *
+   * @alpha -- experimental
+   */
+  publish(address: LiveChannelAddress, data: any): Promise<any> {
+    return getBackendSrv().post(`api/live/publish`, {
+      channel: toLiveChannelId(address),
+      data,
+    });
+  }
 }
 
 // This is used to give a unique key for each stream.  The actual value does not matter

public/app/plugins/panel/live/LivePanel.tsx

@@ -16,11 +16,10 @@ import {
   StreamingDataFrame,
   LiveChannelAddress,
   LiveChannelConfig,
-  toLiveChannelId,
 } from '@grafana/data';
 import { TablePanel } from '../table/TablePanel';
 import { LivePanelOptions, MessageDisplayMode } from './types';
-import { config, getBackendSrv, getGrafanaLiveSrv } from '@grafana/runtime';
+import { config, getGrafanaLiveSrv } from '@grafana/runtime';
 import { css, cx } from '@emotion/css';
 import { isEqual } from 'lodash';
 
@@ -159,10 +158,7 @@ export class LivePanel extends PureComponent<Props, State> {
       return;
     }
 
-    const rsp = await getBackendSrv().post(`api/live/publish`, {
+    const rsp = await getGrafanaLiveSrv().publish(addr, data);
-      channel: toLiveChannelId(addr),
-      data,
-    });
     console.log('onPublishClicked (response from publish)', rsp);
   };
 

yarn.lock

@@ -8571,6 +8571,11 @@ caniuse-api@^3.0.0:
     lodash.memoize "^4.1.2"
     lodash.uniq "^4.5.0"
 
+caniuse-db@1.0.30000772:
+  version "1.0.30000772"
+  resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000772.tgz#51aae891768286eade4a3d8319ea76d6a01b512b"
+  integrity sha1-UarokXaChureSj2DGep21qAbUSs=
+
 caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000981, caniuse-lite@^1.0.30001020, caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001125, caniuse-lite@^1.0.30001181:
   version "1.0.30001205"
   resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001205.tgz"