dashboards: add new default frontend route for loading a dashboard

New default route /d/<uid>/<slug of dashboard title> where dashboard
are loaded by unique identifier.
If old route /dashboard/db/<slug of dashboard tile> are used,
try to lookup dashboard by slug and redirect to new default route.
 #7883

public/app/core/services/backend_srv.ts

@@ -225,6 +225,10 @@ export class BackendSrv {
     return this.get('/api/dashboards/' + type + '/' + slug);
     return this.get('/api/dashboards/' + type + '/' + slug);
   }
   }
 
 
+  getDashboardByUid(uid: string) {
+    return this.get(`/api/dashboards/uid/${uid}`);
+  }
+
   saveDashboard(dash, options) {
   saveDashboard(dash, options) {
     options = options || {};
     options = options || {};
 
 

public/app/features/dashboard/dashboard_loader_srv.ts

@@ -35,18 +35,18 @@ export class DashboardLoaderSrv {
     };
     };
   }
   }
 
 
-  loadDashboard(type, slug) {
+  loadDashboard(type, slug, uid) {
     var promise;
     var promise;
 
 
     if (type === 'script') {
     if (type === 'script') {
       promise = this._loadScriptedDashboard(slug);
       promise = this._loadScriptedDashboard(slug);
     } else if (type === 'snapshot') {
     } else if (type === 'snapshot') {
-      promise = this.backendSrv.get('/api/snapshots/' + this.$routeParams.slug).catch(() => {
+      promise = this.backendSrv.get('/api/snapshots/' + slug).catch(() => {
         return this._dashboardLoadFailed('Snapshot not found', true);
         return this._dashboardLoadFailed('Snapshot not found', true);
       });
       });
     } else {
     } else {
       promise = this.backendSrv
       promise = this.backendSrv
-        .getDashboard(this.$routeParams.type, this.$routeParams.slug)
+        .getDashboardByUid(uid)
         .then(result => {
         .then(result => {
           if (result.meta.isFolder) {
           if (result.meta.isFolder) {
             this.$rootScope.appEvent('alert-error', ['Dashboard not found']);
             this.$rootScope.appEvent('alert-error', ['Dashboard not found']);

public/app/routes/dashboard_loaders.ts

@@ -5,7 +5,7 @@ export class LoadDashboardCtrl {
   constructor($scope, $routeParams, dashboardLoaderSrv, backendSrv, $location) {
   constructor($scope, $routeParams, dashboardLoaderSrv, backendSrv, $location) {
     $scope.appEvent('dashboard-fetch-start');
     $scope.appEvent('dashboard-fetch-start');
 
 
-    if (!$routeParams.slug) {
+    if (!$routeParams.uid && !$routeParams.slug) {
       backendSrv.get('/api/dashboards/home').then(function(homeDash) {
       backendSrv.get('/api/dashboards/home').then(function(homeDash) {
         if (homeDash.redirectUri) {
         if (homeDash.redirectUri) {
           $location.path('dashboard/' + homeDash.redirectUri);
           $location.path('dashboard/' + homeDash.redirectUri);
@@ -18,7 +18,17 @@ export class LoadDashboardCtrl {
       return;
       return;
     }
     }
 
 
-    dashboardLoaderSrv.loadDashboard($routeParams.type, $routeParams.slug).then(function(result) {
+    // if no uid, redirect to new route based on slug
+    if (!$routeParams.uid) {
+      backendSrv.get(`/api/dashboards/db/${$routeParams.slug}`).then(res => {
+        if (res) {
+          $location.path(res.meta.url);
+        }
+      });
+      return;
+    }
+
+    dashboardLoaderSrv.loadDashboard($routeParams.type, $routeParams.slug, $routeParams.uid).then(function(result) {
       if ($routeParams.keepRows) {
       if ($routeParams.keepRows) {
         result.meta.keepRows = true;
         result.meta.keepRows = true;
       }
       }

public/app/routes/routes.ts

@@ -14,6 +14,12 @@ export function setupAngularRoutes($routeProvider, $locationProvider) {
       reloadOnSearch: false,
       reloadOnSearch: false,
       pageClass: 'page-dashboard',
       pageClass: 'page-dashboard',
     })
     })
+    .when('/d/:uid/:slug', {
+      templateUrl: 'public/app/partials/dashboard.html',
+      controller: 'LoadDashboardCtrl',
+      reloadOnSearch: false,
+      pageClass: 'page-dashboard',
+    })
     .when('/dashboard/:type/:slug', {
     .when('/dashboard/:type/:slug', {
       templateUrl: 'public/app/partials/dashboard.html',
       templateUrl: 'public/app/partials/dashboard.html',
       controller: 'LoadDashboardCtrl',
       controller: 'LoadDashboardCtrl',