Chore: Remove angular dependency from backendSrv (#20999)

* Chore: Remove angular dependency from backendSrv

* Refactor: Naive soultion for logging out unauthorized users

* Refactor: Restructures to different streams

* Refactor: Restructures datasourceRequest

* Refactor: Flipped back if statement

* Refactor: Extracted getFromFetchStream

* Refactor: Extracts toFailureStream operation

* Refactor: Fixes issue when options.params contains arrays

* Refactor: Fixes broken test (but we need a lot more)

* Refactor: Adds explaining comments

* Refactor: Adds latest RxJs version so cancellations work

* Refactor: Cleans up the takeUntil code

* Refactor: Adds tests for request function

* Refactor: Separates into smaller functions

* Refactor: Adds last error tests

* Started to changed so we require getBackendSrv from the @grafana-runtime when applicable.

* Using the getBackendSrv from @grafana/runtime.

* Changed so we use the getBackendSrv from the @grafana-runtime when possible.

* Fixed so Server Admin -> Orgs works again.

* Removed unused dependency.

* Fixed digest issues on the Server Admin -> Users page.

* Fix: Fixes digest problems in Playlists

* Fix: Fixes digest issues in VersionHistory

* Tests: Fixes broken tests

* Fix: Fixes digest issues in Alerting => Notification channels

* Fixed digest issues on the Intive page.

* Fixed so we run digest after password reset email sent.

* Fixed digest issue when trying to sign up account.

* Fixed so the Server Admin -> Edit Org works with backendSrv

* Fixed so Server Admin -> Users works with backend srv.

* Fixed digest issues in Server Admin -> Orgs

* Fix: Fixes digest issues in DashList plugin

* Fixed digest issues on Server Admin -> users.

* Fix: Fixes digest issues with Snapshots

* Fixed digest issue when deleting a user.

* Fix: Fixes digest issues with dashLink

* Chore: Changes RxJs version to 6.5.4 which includes the same cancellation fix

* Fix: Fixes digest issue when toggling folder in manage dashboards

* Fix: Fixes bug in executeInOrder

* Fix: Fixes digest issue with CreateFolderCtrl and FolderDashboardsCtrl

* Fix: Fixes tslint error in test

* Refactor: Changes default behaviour for emitted messages as before migration

* Fix: Fixes various digest issues when saving, starring or deleting dashboards

* Fix: Fixes digest issues with FolderPickerCtrl

* Fixed digest issue.

* Fixed digest issues.

* Fixed issues with angular digest.

* Removed the this.digest pattern.

Co-authored-by: Hugo Häggmark <hugo.haggmark@gmail.com>
Co-authored-by: Marcus Andersson <systemvetaren@gmail.com>

public/app/features/dashboard/components/VersionHistory/HistoryListCtrl.test.ts

@@ -1,6 +1,8 @@
 import _ from 'lodash';
+import { IScope } from 'angular';
+
 import { HistoryListCtrl } from './HistoryListCtrl';
-import { versions, compare, restore } from './__mocks__/history';
+import { compare, restore, versions } from './__mocks__/history';
 import { CoreEvents } from 'app/types';
 
 describe('HistoryListCtrl', () => {
@@ -12,6 +14,7 @@ describe('HistoryListCtrl', () => {
 
   let historySrv: any;
   let $rootScope: any;
+  const $scope: IScope = ({ $evalAsync: jest.fn() } as any) as IScope;
   let historyListCtrl: any;
   beforeEach(() => {
     historySrv = {
@@ -28,7 +31,7 @@ describe('HistoryListCtrl', () => {
     beforeEach(() => {
       historySrv.getHistoryList = jest.fn(() => Promise.resolve({}));
 
-      historyListCtrl = new HistoryListCtrl({}, $rootScope, {} as any, historySrv, {});
+      historyListCtrl = new HistoryListCtrl({}, $rootScope, {} as any, historySrv, $scope);
 
       historyListCtrl.dashboard = {
         id: 2,
@@ -84,7 +87,7 @@ describe('HistoryListCtrl', () => {
       beforeEach(async () => {
         historySrv.getHistoryList = jest.fn(() => Promise.reject(new Error('HistoryListError')));
 
-        historyListCtrl = new HistoryListCtrl({}, $rootScope, {} as any, historySrv, {});
+        historyListCtrl = new HistoryListCtrl({}, $rootScope, {} as any, historySrv, $scope);
 
         await historyListCtrl.getLog();
       });
@@ -127,7 +130,7 @@ describe('HistoryListCtrl', () => {
       historySrv.getHistoryList = jest.fn(() => Promise.resolve(versionsResponse));
       historySrv.calculateDiff = jest.fn(() => Promise.resolve({}));
 
-      historyListCtrl = new HistoryListCtrl({}, $rootScope, {} as any, historySrv, {});
+      historyListCtrl = new HistoryListCtrl({}, $rootScope, {} as any, historySrv, $scope);
 
       historyListCtrl.dashboard = {
         id: 2,
@@ -260,7 +263,7 @@ describe('HistoryListCtrl', () => {
       historySrv.getHistoryList = jest.fn(() => Promise.resolve(versionsResponse));
       historySrv.restoreDashboard = jest.fn(() => Promise.resolve());
 
-      historyListCtrl = new HistoryListCtrl({}, $rootScope, {} as any, historySrv, {});
+      historyListCtrl = new HistoryListCtrl({}, $rootScope, {} as any, historySrv, $scope);
 
       historyListCtrl.dashboard = {
         id: 1,
@@ -279,7 +282,7 @@ describe('HistoryListCtrl', () => {
       beforeEach(async () => {
         historySrv.getHistoryList = jest.fn(() => Promise.resolve(versionsResponse));
         historySrv.restoreDashboard = jest.fn(() => Promise.resolve());
-        historyListCtrl = new HistoryListCtrl({}, $rootScope, {} as any, historySrv, {});
+        historyListCtrl = new HistoryListCtrl({}, $rootScope, {} as any, historySrv, $scope);
         historySrv.restoreDashboard = jest.fn(() => Promise.reject(new Error('RestoreError')));
         historyListCtrl.restoreConfirm(RESTORE_ID);
         await historyListCtrl.getLog();

public/app/features/dashboard/components/VersionHistory/HistoryListCtrl.ts

@@ -1,12 +1,13 @@
 import _ from 'lodash';
-import angular, { ILocationService } from 'angular';
+import angular, { ILocationService, IScope } from 'angular';
 
 import locationUtil from 'app/core/utils/location_util';
 import { DashboardModel } from '../../state/DashboardModel';
-import { HistoryListOpts, RevisionsModel, CalculateDiffOptions, HistorySrv } from './HistorySrv';
-import { dateTime, toUtc, DateTimeInput, AppEvents } from '@grafana/data';
+import { CalculateDiffOptions, HistoryListOpts, HistorySrv, RevisionsModel } from './HistorySrv';
+import { AppEvents, dateTime, DateTimeInput, toUtc } from '@grafana/data';
 import { GrafanaRootScope } from 'app/routes/GrafanaCtrl';
 import { CoreEvents } from 'app/types';
+import { promiseToDigest } from '../../../../core/utils/promiseToDigest';
 
 export class HistoryListCtrl {
   appending: boolean;
@@ -30,7 +31,7 @@ export class HistoryListCtrl {
     private $rootScope: GrafanaRootScope,
     private $location: ILocationService,
     private historySrv: HistorySrv,
-    public $scope: any
+    public $scope: IScope
   ) {
     this.appending = false;
     this.diff = 'basic';
@@ -108,18 +109,20 @@ export class HistoryListCtrl {
       diffType: diff,
     };
 
-    return this.historySrv
-      .calculateDiff(options)
-      .then((response: any) => {
-        // @ts-ignore
-        this.delta[this.diff] = response;
-      })
-      .catch(() => {
-        this.mode = 'list';
-      })
-      .finally(() => {
-        this.loading = false;
-      });
+    return promiseToDigest(this.$scope)(
+      this.historySrv
+        .calculateDiff(options)
+        .then((response: any) => {
+          // @ts-ignore
+          this.delta[this.diff] = response;
+        })
+        .catch(() => {
+          this.mode = 'list';
+        })
+        .finally(() => {
+          this.loading = false;
+        })
+    );
   }
 
   getLog(append = false) {
@@ -130,25 +133,27 @@ export class HistoryListCtrl {
       start: this.start,
     };
 
-    return this.historySrv
-      .getHistoryList(this.dashboard, options)
-      .then((revisions: any) => {
-        // set formatted dates & default values
-        for (const rev of revisions) {
-          rev.createdDateString = this.formatDate(rev.created);
-          rev.ageString = this.formatBasicDate(rev.created);
-          rev.checked = false;
-        }
+    return promiseToDigest(this.$scope)(
+      this.historySrv
+        .getHistoryList(this.dashboard, options)
+        .then((revisions: any) => {
+          // set formatted dates & default values
+          for (const rev of revisions) {
+            rev.createdDateString = this.formatDate(rev.created);
+            rev.ageString = this.formatBasicDate(rev.created);
+            rev.checked = false;
+          }
 
-        this.revisions = append ? this.revisions.concat(revisions) : revisions;
-      })
-      .catch((err: any) => {
-        this.loading = false;
-      })
-      .finally(() => {
-        this.loading = false;
-        this.appending = false;
-      });
+          this.revisions = append ? this.revisions.concat(revisions) : revisions;
+        })
+        .catch((err: any) => {
+          this.loading = false;
+        })
+        .finally(() => {
+          this.loading = false;
+          this.appending = false;
+        })
+    );
   }
 
   isLastPage() {
@@ -183,17 +188,19 @@ export class HistoryListCtrl {
 
   restoreConfirm(version: number) {
     this.loading = true;
-    return this.historySrv
-      .restoreDashboard(this.dashboard, version)
-      .then((response: any) => {
-        this.$location.url(locationUtil.stripBaseFromUrl(response.url)).replace();
-        this.$route.reload();
-        this.$rootScope.appEvent(AppEvents.alertSuccess, ['Dashboard restored', 'Restored from version ' + version]);
-      })
-      .catch(() => {
-        this.mode = 'list';
-        this.loading = false;
-      });
+    return promiseToDigest(this.$scope)(
+      this.historySrv
+        .restoreDashboard(this.dashboard, version)
+        .then((response: any) => {
+          this.$location.url(locationUtil.stripBaseFromUrl(response.url)).replace();
+          this.$route.reload();
+          this.$rootScope.appEvent(AppEvents.alertSuccess, ['Dashboard restored', 'Restored from version ' + version]);
+        })
+        .catch(() => {
+          this.mode = 'list';
+          this.loading = false;
+        })
+    );
   }
 }
 

public/app/features/dashboard/components/VersionHistory/HistorySrv.test.ts

@@ -1,27 +1,41 @@
 import { versions, restore } from './__mocks__/history';
 import { HistorySrv } from './HistorySrv';
 import { DashboardModel } from '../../state/DashboardModel';
+
+const getMock = jest.fn().mockResolvedValue({});
+const postMock = jest.fn().mockResolvedValue({});
+
 jest.mock('app/core/store');
+jest.mock('@grafana/runtime', () => {
+  const original = jest.requireActual('@grafana/runtime');
+
+  return {
+    ...original,
+    getBackendSrv: () => ({
+      post: postMock,
+      get: getMock,
+    }),
+  };
+});
 
 describe('historySrv', () => {
   const versionsResponse = versions();
   const restoreResponse = restore;
 
-  const backendSrv: any = {
-    get: jest.fn(() => Promise.resolve({})),
-    post: jest.fn(() => Promise.resolve({})),
-  };
-
-  let historySrv = new HistorySrv(backendSrv);
+  let historySrv = new HistorySrv();
 
   const dash = new DashboardModel({ id: 1 });
   const emptyDash = new DashboardModel({});
   const historyListOpts = { limit: 10, start: 0 };
 
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
   describe('getHistoryList', () => {
     it('should return a versions array for the given dashboard id', () => {
-      backendSrv.get = jest.fn(() => Promise.resolve(versionsResponse));
-      historySrv = new HistorySrv(backendSrv);
+      getMock.mockImplementation(() => Promise.resolve(versionsResponse));
+      historySrv = new HistorySrv();
 
       return historySrv.getHistoryList(dash, historyListOpts).then((versions: any) => {
         expect(versions).toEqual(versionsResponse);
@@ -44,15 +58,15 @@ describe('historySrv', () => {
   describe('restoreDashboard', () => {
     it('should return a success response given valid parameters', () => {
       const version = 6;
-      backendSrv.post = jest.fn(() => Promise.resolve(restoreResponse(version)));
-      historySrv = new HistorySrv(backendSrv);
+      postMock.mockImplementation(() => Promise.resolve(restoreResponse(version)));
+      historySrv = new HistorySrv();
       return historySrv.restoreDashboard(dash, version).then((response: any) => {
         expect(response).toEqual(restoreResponse(version));
       });
     });
 
     it('should return an empty object when not given an id', async () => {
-      historySrv = new HistorySrv(backendSrv);
+      historySrv = new HistorySrv();
       const rsp = await historySrv.restoreDashboard(emptyDash, 6);
       expect(rsp).toEqual({});
     });

public/app/features/dashboard/components/VersionHistory/HistorySrv.ts

@@ -1,7 +1,7 @@
 import _ from 'lodash';
 import coreModule from 'app/core/core_module';
 import { DashboardModel } from '../../state/DashboardModel';
-import { BackendSrv } from 'app/core/services/backend_srv';
+import { getBackendSrv } from '@grafana/runtime';
 
 export interface HistoryListOpts {
   limit: number;
@@ -32,23 +32,20 @@ export interface DiffTarget {
 }
 
 export class HistorySrv {
-  /** @ngInject */
-  constructor(private backendSrv: BackendSrv) {}
-
   getHistoryList(dashboard: DashboardModel, options: HistoryListOpts) {
     const id = dashboard && dashboard.id ? dashboard.id : void 0;
-    return id ? this.backendSrv.get(`api/dashboards/id/${id}/versions`, options) : Promise.resolve([]);
+    return id ? getBackendSrv().get(`api/dashboards/id/${id}/versions`, options) : Promise.resolve([]);
   }
 
   calculateDiff(options: CalculateDiffOptions) {
-    return this.backendSrv.post('api/dashboards/calculate-diff', options);
+    return getBackendSrv().post('api/dashboards/calculate-diff', options);
   }
 
   restoreDashboard(dashboard: DashboardModel, version: number) {
     const id = dashboard && dashboard.id ? dashboard.id : void 0;
     const url = `api/dashboards/id/${id}/restore`;
 
-    return id && _.isNumber(version) ? this.backendSrv.post(url, { version }) : Promise.resolve({});
+    return id && _.isNumber(version) ? getBackendSrv().post(url, { version }) : Promise.resolve({});
   }
 }