fix

src/panel/graph_panel/graph_ctrl.ts

@@ -9,7 +9,7 @@ import { MetricExpanded } from './models/metric';
 import { DatasourceRequest } from './models/datasource';
 import { AnalyticUnitId, AnalyticUnit, LabelingMode } from './models/analytic_units/analytic_unit';
 import { BOUND_TYPES } from './models/analytic_units/anomaly_analytic_unit';
-import { AnalyticService, HasticDatasourceConnectingStatus } from './services/analytic_service';
+import { AnalyticService, HasticDatasourceConnectionStatus } from './services/analytic_service';
 import { AnalyticController } from './controllers/analytic_controller';
 import { HasticPanelInfo } from './models/hastic_panel_info';
 import { PanelTemplate, TemplateVariables } from './models/panel';
@@ -353,8 +353,8 @@ class GraphCtrl extends MetricsPanelCtrl {
     this.refresh();
   }
 
-  get connectingStatus(): HasticDatasourceConnectingStatus {
-    return this.analyticService.connectingStatus;
+  get connectionStatus(): HasticDatasourceConnectionStatus {
+    return this.analyticService.connectionStatus;
   }
 
   issueQueries(datasource) {

src/panel/graph_panel/partials/reconnect_to_datasource.html

@@ -1,16 +1,16 @@
 <div class="gf-form-button-row" ng-if="ctrl.hasticDatasource !== undefined && ctrl.analyticsController.serverStatus === false">
   <div class="gf-form-group">
-    <div class="alert-{{ctrl.connectingStatus.status}} alert"">
+    <div class="alert-{{ctrl.connectionStatus.status}} alert"">
       <div class="alert-icon">
-        <i class="fa fa-spiner fa-spin" ng-show="ctrl.connectingStatus.status === 'info'"></i>
-        <i class="fa fa-exclamation-triangle" ng-show="ctrl.connectingStatus.status === 'error'"></i>
-        <i class="fa fa-check" ng-show="ctrl.connectingStatus.status !== 'error'"></i>
+        <i class="fa fa-spiner fa-spin" ng-show="ctrl.connectionStatus.status === 'info'"></i>
+        <i class="fa fa-exclamation-triangle" ng-show="ctrl.connectionStatus.status === 'error'"></i>
+        <i class="fa fa-check" ng-show="ctrl.connectionStatus.status !== 'error'"></i>
       </div>
       <div class="alert-body">
-        <div class="alert-title" ng-bind-html="ctrl.connectingStatus.message" />
+        <div class="alert-title" ng-bind-html="ctrl.connectionStatus.message" />
       </div>
     </div>
-    <div ng-hide="ctrl.connectingStatus.status === 'info'">
+    <div ng-hide="ctrl.connectionStatus.status === 'info'">
       <button class="btn btn-secondary" ng-click="ctrl.onHasticDatasourceChange()">
         <i class="fa fa-plug"></i>
         &nbsp; Connect to Hastic Datasource

src/panel/graph_panel/services/analytic_service.ts

@@ -30,13 +30,13 @@ export enum HasticDatasourceStatus {
   CONNECTING = 'info'
 };
 
-export type HasticDatasourceConnectingStatus = {
+export type HasticDatasourceConnectionStatus = {
   status: HasticDatasourceStatus,
   message: string
 }
 
 export class AnalyticService {
-  public connectingStatus: HasticDatasourceConnectingStatus = {
+  public connectionStatus: HasticDatasourceConnectionStatus = {
     status: HasticDatasourceStatus.CONNECTING,
     message: 'Connecting...'
   };
@@ -273,8 +273,8 @@ export class AnalyticService {
   }
 
   async checkDatasourceAvailability(): Promise<boolean> {
-    this.connectingStatus.status = HasticDatasourceStatus.CONNECTING;
-    this.connectingStatus.message = 'Connecting...';
+    this.connectionStatus.status = HasticDatasourceStatus.CONNECTING;
+    this.connectionStatus.message = 'Connecting...';
 
     this._isUp = await this._isDatasourceAvailable();
     return this._isUp;
@@ -398,8 +398,8 @@ export class AnalyticService {
   }
 
   private _displayConnectionAlert(status: HasticDatasourceStatus, message: string[]): void {
-    this.connectingStatus.status = status;
-    this.connectingStatus.message = message.join('<br />');
+    this.connectionStatus.status = status;
+    this.connectionStatus.message = message.join('<br />');
 
     const statusChanged = this._updateHasticUrlStatus(status);