grafana/public/app/features/dashboard/state/actions.ts
Torkel Ödegaard c002a39456
NewPanelEditor: Angular panel options, and angular component state to redux major change (#22448)
* NewPanelEdit: Added angular options to new panel editor and started looking and angular component state

* Moved angular component state to redux

* Close to working 100%

* Think everything is working

* AlertTab: Alert tab now gets angularComponent from redux

* Fixed panel menu access to angular panel component

* Added new tests

* Fixed unit test

* Fixed strict null errors

* Fixed typescript issues

* fixed issues
2020-02-28 11:04:40 +01:00

156 lines
4.7 KiB
TypeScript

// Services & Utils
import { getBackendSrv } from '@grafana/runtime';
import { createSuccessNotification } from 'app/core/copy/appNotification';
// Actions
import { loadPluginDashboards } from '../../plugins/state/actions';
import { loadDashboardPermissions, panelModelAndPluginReady, setPanelAngularComponent } from './reducers';
import { notifyApp } from 'app/core/actions';
import { loadPanelPlugin } from 'app/features/plugins/state/actions';
// Types
import { DashboardAcl, DashboardAclUpdateDTO, NewDashboardAclItem, PermissionLevel, ThunkResult } from 'app/types';
import { PanelModel } from './PanelModel';
export function getDashboardPermissions(id: number): ThunkResult<void> {
return async dispatch => {
const permissions = await getBackendSrv().get(`/api/dashboards/id/${id}/permissions`);
dispatch(loadDashboardPermissions(permissions));
};
}
function toUpdateItem(item: DashboardAcl): DashboardAclUpdateDTO {
return {
userId: item.userId,
teamId: item.teamId,
role: item.role,
permission: item.permission,
};
}
export function updateDashboardPermission(
dashboardId: number,
itemToUpdate: DashboardAcl,
level: PermissionLevel
): ThunkResult<void> {
return async (dispatch, getStore) => {
const { dashboard } = getStore();
const itemsToUpdate = [];
for (const item of dashboard.permissions) {
if (item.inherited) {
continue;
}
const updated = toUpdateItem(item);
// if this is the item we want to update, update it's permission
if (itemToUpdate === item) {
updated.permission = level;
}
itemsToUpdate.push(updated);
}
await getBackendSrv().post(`/api/dashboards/id/${dashboardId}/permissions`, { items: itemsToUpdate });
await dispatch(getDashboardPermissions(dashboardId));
};
}
export function removeDashboardPermission(dashboardId: number, itemToDelete: DashboardAcl): ThunkResult<void> {
return async (dispatch, getStore) => {
const dashboard = getStore().dashboard;
const itemsToUpdate = [];
for (const item of dashboard.permissions) {
if (item.inherited || item === itemToDelete) {
continue;
}
itemsToUpdate.push(toUpdateItem(item));
}
await getBackendSrv().post(`/api/dashboards/id/${dashboardId}/permissions`, { items: itemsToUpdate });
await dispatch(getDashboardPermissions(dashboardId));
};
}
export function addDashboardPermission(dashboardId: number, newItem: NewDashboardAclItem): ThunkResult<void> {
return async (dispatch, getStore) => {
const { dashboard } = getStore();
const itemsToUpdate = [];
for (const item of dashboard.permissions) {
if (item.inherited) {
continue;
}
itemsToUpdate.push(toUpdateItem(item));
}
itemsToUpdate.push({
userId: newItem.userId,
teamId: newItem.teamId,
role: newItem.role,
permission: newItem.permission,
});
await getBackendSrv().post(`/api/dashboards/id/${dashboardId}/permissions`, { items: itemsToUpdate });
await dispatch(getDashboardPermissions(dashboardId));
};
}
export function importDashboard(data: any, dashboardTitle: string): ThunkResult<void> {
return async dispatch => {
await getBackendSrv().post('/api/dashboards/import', data);
dispatch(notifyApp(createSuccessNotification('Dashboard Imported', dashboardTitle)));
dispatch(loadPluginDashboards());
};
}
export function removeDashboard(uri: string): ThunkResult<void> {
return async dispatch => {
await getBackendSrv().delete(`/api/dashboards/${uri}`);
dispatch(loadPluginDashboards());
};
}
export function initDashboardPanel(panel: PanelModel): ThunkResult<void> {
return async (dispatch, getStore) => {
let plugin = getStore().plugins.panels[panel.type];
if (!plugin) {
plugin = await dispatch(loadPanelPlugin(panel.type));
}
if (!panel.plugin) {
panel.pluginLoaded(plugin);
}
dispatch(panelModelAndPluginReady({ panelId: panel.id, plugin }));
};
}
export function changePanelPlugin(panel: PanelModel, pluginId: string): ThunkResult<void> {
return async (dispatch, getStore) => {
// ignore action is no change
if (panel.type === pluginId) {
return;
}
const store = getStore();
let plugin = store.plugins.panels[pluginId];
if (!plugin) {
plugin = await dispatch(loadPanelPlugin(pluginId));
}
// clean up angular component (scope / ctrl state)
const angularComponent = store.dashboard.panels[panel.id].angularComponent;
if (angularComponent) {
angularComponent.destroy();
dispatch(setPanelAngularComponent({ panelId: panel.id, angularComponent: null }));
}
panel.changePlugin(plugin);
dispatch(panelModelAndPluginReady({ panelId: panel.id, plugin }));
};
}