diff --git a/public/app/core/services/keybindingSrv.ts b/public/app/core/services/keybindingSrv.ts index dfacc483b8e..917d1801c0e 100644 --- a/public/app/core/services/keybindingSrv.ts +++ b/public/app/core/services/keybindingSrv.ts @@ -144,7 +144,7 @@ export class KeybindingSrv { this.$location.search(search); } - setupDashboardBindings(scope, dashboard, onRemovePanel) { + setupDashboardBindings(scope, dashboard) { this.bind('mod+o', () => { dashboard.graphTooltip = (dashboard.graphTooltip + 1) % 3; appEvents.emit('graph-hover-clear'); @@ -212,7 +212,7 @@ export class KeybindingSrv { // delete panel this.bind('p r', () => { if (dashboard.meta.focusPanelId && dashboard.meta.canEdit) { - onRemovePanel(dashboard.meta.focusPanelId); + appEvents.emit('remove-panel', dashboard.meta.focusPanelId); dashboard.meta.focusPanelId = 0; } }); diff --git a/public/app/features/dashboard/services/DashboardSrv.ts b/public/app/features/dashboard/services/DashboardSrv.ts index 38fadfecdc1..88eb58ad345 100644 --- a/public/app/features/dashboard/services/DashboardSrv.ts +++ b/public/app/features/dashboard/services/DashboardSrv.ts @@ -2,28 +2,35 @@ import coreModule from 'app/core/core_module'; import { appEvents } from 'app/core/app_events'; import locationUtil from 'app/core/utils/location_util'; import { DashboardModel } from '../state/DashboardModel'; +import { removePanel } from '../utils/panel'; export class DashboardSrv { - dash: any; + dash: DashboardModel; /** @ngInject */ constructor(private backendSrv, private $rootScope, private $location) { appEvents.on('save-dashboard', this.saveDashboard.bind(this), $rootScope); appEvents.on('panel-change-view', this.onPanelChangeView); + appEvents.on('remove-panel', this.onRemovePanel); } create(dashboard, meta) { return new DashboardModel(dashboard, meta); } - setCurrent(dashboard) { + setCurrent(dashboard: DashboardModel) { this.dash = dashboard; } - getCurrent() { + getCurrent(): DashboardModel { return this.dash; } + onRemovePanel = (panelId: number) => { + const dashboard = this.getCurrent(); + removePanel(dashboard, dashboard.getPanelById(panelId), true); + }; + onPanelChangeView = (options) => { const urlParams = this.$location.search(); diff --git a/public/app/features/dashboard/state/initDashboard.ts b/public/app/features/dashboard/state/initDashboard.ts index b8eed6c4e64..c774c4926f4 100644 --- a/public/app/features/dashboard/state/initDashboard.ts +++ b/public/app/features/dashboard/state/initDashboard.ts @@ -13,7 +13,6 @@ import { updateLocation } from 'app/core/actions'; import { notifyApp } from 'app/core/actions'; import locationUtil from 'app/core/utils/location_util'; import { setDashboardLoadingState, ThunkResult, setDashboardModel, setDashboardLoadingSlow } from './actions'; -import { removePanel } from '../utils/panel'; // Types import { DashboardLoadingState, DashboardRouteInfo } from 'app/types'; @@ -185,15 +184,8 @@ export function initDashboard({ // init unsaved changes tracking unsavedChangesSrv.init(dashboard, $scope); + keybindingSrv.setupDashboardBindings($scope, dashboard); - // dashboard keybindings should not live in core, this needs a bigger refactoring - // So declaring this here so it can depend on the removePanel util function - // Long term onRemovePanel should be handled via react prop callback - const onRemovePanel = (panelId: number) => { - removePanel(dashboard, dashboard.getPanelById(panelId), true); - }; - - keybindingSrv.setupDashboardBindings($scope, dashboard, onRemovePanel); } catch (err) { dispatch(notifyApp(createErrorNotification('Dashboard init failed', err))); console.log(err);