grafana/public/app/features/manage-dashboards/state/actions.ts

345 lines
10 KiB
TypeScript
Raw Normal View History

import { DataSourceInstanceSettings, locationUtil } from '@grafana/data';
import { getDataSourceSrv, locationService, getBackendSrv, isFetchError } from '@grafana/runtime';
import { notifyApp } from 'app/core/actions';
import { createErrorNotification } from 'app/core/copy/appNotification';
2022-07-14 17:36:17 -05:00
import { SaveDashboardCommand } from 'app/features/dashboard/components/SaveDashboard/types';
import { dashboardWatcher } from 'app/features/live/dashboard/dashboardWatcher';
import { DashboardDTO, FolderInfo, PermissionLevelString, SearchQueryType, ThunkResult } from 'app/types';
import { LibraryElementExport } from '../../dashboard/components/DashExportModal/DashboardExporter';
import { getLibraryPanel } from '../../library-panels/state/api';
import { LibraryElementDTO, LibraryElementKind } from '../../library-panels/types';
import { DashboardSearchHit } from '../../search/types';
import { DeleteDashboardResponse } from '../types';
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
import {
clearDashboard,
fetchDashboard,
fetchFailed,
ImportDashboardDTO,
InputType,
LibraryPanelInput,
LibraryPanelInputState,
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
setGcomDashboard,
setInputs,
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
setJsonDashboard,
setLibraryPanelInputs,
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
} from './reducers';
export function fetchGcomDashboard(id: string): ThunkResult<void> {
return async (dispatch) => {
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
try {
dispatch(fetchDashboard());
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
const dashboard = await getBackendSrv().get(`/api/gnet/dashboards/${id}`);
dispatch(setGcomDashboard(dashboard));
dispatch(processInputs(dashboard.json));
dispatch(processElements(dashboard.json));
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
} catch (error) {
dispatch(fetchFailed());
if (isFetchError(error)) {
dispatch(notifyApp(createErrorNotification(error.data.message || error)));
}
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
}
};
}
export function importDashboardJson(dashboard: any): ThunkResult<void> {
return async (dispatch) => {
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
dispatch(setJsonDashboard(dashboard));
dispatch(processInputs(dashboard));
dispatch(processElements(dashboard));
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
};
}
function processInputs(dashboardJson: any): ThunkResult<void> {
return (dispatch) => {
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
if (dashboardJson && dashboardJson.__inputs) {
const inputs: any[] = [];
dashboardJson.__inputs.forEach((input: any) => {
const inputModel: any = {
name: input.name,
label: input.label,
info: input.description,
value: input.value,
type: input.type,
pluginId: input.pluginId,
options: [],
};
if (input.type === InputType.DataSource) {
getDataSourceOptions(input, inputModel);
} else if (!inputModel.info) {
inputModel.info = 'Specify a string constant';
}
inputs.push(inputModel);
});
dispatch(setInputs(inputs));
}
};
}
function processElements(dashboardJson?: { __elements?: Record<string, LibraryElementExport> }): ThunkResult<void> {
return async function (dispatch) {
if (!dashboardJson || !dashboardJson.__elements) {
return;
}
const libraryPanelInputs: LibraryPanelInput[] = [];
for (const element of Object.values(dashboardJson.__elements)) {
if (element.kind !== LibraryElementKind.Panel) {
continue;
}
const model = element.model;
const { type, description } = model;
const { uid, name } = element;
const input: LibraryPanelInput = {
model: {
model,
uid,
name,
version: 0,
type,
kind: LibraryElementKind.Panel,
description,
} as LibraryElementDTO,
state: LibraryPanelInputState.New,
};
try {
const panelInDb = await getLibraryPanel(uid, true);
input.state = LibraryPanelInputState.Exists;
input.model = panelInDb;
} catch (e: any) {
if (e.status !== 404) {
throw e;
}
}
libraryPanelInputs.push(input);
}
dispatch(setLibraryPanelInputs(libraryPanelInputs));
};
}
export function clearLoadedDashboard(): ThunkResult<void> {
return (dispatch) => {
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
dispatch(clearDashboard());
};
}
export function importDashboard(importDashboardForm: ImportDashboardDTO): ThunkResult<void> {
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
return async (dispatch, getState) => {
const dashboard = getState().importDashboard.dashboard;
const inputs = getState().importDashboard.inputs;
let inputsToPersist = [] as any[];
importDashboardForm.dataSources?.forEach((dataSource: DataSourceInstanceSettings, index: number) => {
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
const input = inputs.dataSources[index];
inputsToPersist.push({
name: input.name,
type: input.type,
pluginId: input.pluginId,
value: dataSource.uid,
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
});
});
importDashboardForm.constants?.forEach((constant: any, index: number) => {
const input = inputs.constants[index];
inputsToPersist.push({
value: constant,
name: input.name,
type: input.type,
});
});
const result = await getBackendSrv().post('api/dashboards/import', {
// uid: if user changed it, take the new uid from importDashboardForm,
// else read it from original dashboard
// by default the uid input is disabled, onSubmit ignores values from disabled inputs
dashboard: { ...dashboard, title: importDashboardForm.title, uid: importDashboardForm.uid || dashboard.uid },
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
overwrite: true,
inputs: inputsToPersist,
folderUid: importDashboardForm.folder.uid,
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
});
Routing NG: Replace Angular routing with react-router (#31463) * Add router packages * Get react app root work instead of Angular one * Logger util * Patch Angular routing ($routeProvider, $routeParamsProvider) * Use react-router-dom history instead of separate dependency * Add test routes * Sidemenu - use Link instead of anchors * Patch Angular $location service (stub) * WIP: geting rid of $location provider from TimeSrv * Intercept anchor clicks to use history under the hood * Sync Redux location slice with history state * Make login/logout work * Debug routes for testing * Make force login work * Make sure query param change does not recreate page components * Hide side menu in specified locations * Make the dashboar route query parameters work, make panel edit menu work * Enable more routes * Fix side menu * Handle view modes * Disable playlist routes * Make SafeDynamicImport work again * Bring back router-debug * Separate redux location sync from route rendering * Refactor updateLocation to thunk and move force refresh(login) to it * Fixing init dashboard issue * Support switching between dashboards without an unmount of DashboardPage * More fixes for init dashboard and panel edit * More type fixes * Moving angular location wrapper out of main LocationService, and fixing typescript issues * Fixed last typescript errors * LocationService: Move to runtime and remove getLocationService and export singleston const instead (#31523) * Moving location service implementation to runtime and removing get function and making it a package const singleton * Added test that used locationService directly * removed unused import * AngularApp: Moving angular dependencies and the app boot out of the main app into it's own file (#31525) * Fixes angular panels by calling the monkey patch * Moving angular stuff to to it's own files * udpated * Fixing clicking on divs and spans inside anchor * Moving app notifications out of angular app and removing angular directive wrapper * Moving search from angular to react and removing angular search wrapper * Clean up, tried to remove the redux location wrapper but requires a big update for DashboardPage, so adding it back * Moving AppWrapper to root to limit circular dependencies (app/core -> app/routing and back) * Open and close search now works * Hide sidemenu when in kiosk mode * Restoring some keybindings like ESC key * Removed kiosk events and simplified it, just handled through updating URL * Fixing typescript errors * Simplified GrafanaRouteComponentProps and renamed to ContainerProps * renamed back * Changed AlertRuleList to use GrafanaRouteComponentProps and location.search passed to it * Removing the reloadOnSearch property, this is not needed now for react as react by default does not unmount components when only url match or query parmas change * SafeDynamicImport causing unmount un every search update, not sure how to fix yet * Fix signature for SafeDynamicImport so we do not create new route components on every route render * Removing the redux location wrapper as it was causing errors, and making dashboard page work with RouteProps (location, match) etc * Updating DashboardPage and SoloPanelPage to use match params and history location * Fixed DashboardPage tests * Fixing solo route tests * LocationService: Rename getCurrentLocation to just getLocation * do not intercept link clicks with target blank or self * Experimental useUrlParams hook * Update DataSourceSettingsPage to use router match params * fix links with urls that have no starting / to work like before * Fix forceLogin * Add queryParams to GrafanaRouteComponentProps * PanelEditor get rid of updateLocation and location state * Improve grafana route query params typing * Add getSearchObject to LocationService * Use DashboardPAge queryParams instead of location.search parsing * Fix DashboardPage typing * Fix some tests weirdness * Bring back KeyboardSrv * Fixes typescript issues * Team pages now use router match params * Get rid of from GrafanaRouteComponent props * Removed unnessary calls to getSearchObject when calling locationService.partial * Updated DashboardPage tests after queryParams was added * Fixing dashboard settings back * GrafanaRoute: Adding tests and remove use of global locationService * Fixing tests and typescript errors * Bring back kiosk modes and add tests * Fix TimeSrv tests * Fix typecheck errors * Fixing tests * Updated SideMenu test to react-testing and wrapped component in Router, and fixed issue importing createMemoryHistory * Get rid of routeChange event from TimeSrv from * Fixed TopSectionItem test * Trying to make basename work but failing * Update TopSectionItem snapshot * Fix TopSectionItem snapshot test * Fix API keys creation * Remove Angular dependencies from KeybindingSrv (#31617) * Remove Angular dependency from KeybindingsSrv * Fix tests and typecheck issues * basename is starting to work * Make dashboard save work * KeybindingSrv: Remove as angular service and no usage angular scope * So long bridge_srv, we won't miss you * Update snapshots * Dashboard: Refactoring ChangeTracker to use History api and no angular (#31653) * Dashboard: Refactoring ChangeTracker to use History api and no angular * Updated * Removed logging * fixed unit tests * updated snapshots * Mechanism for force reloading routes (#31683) * e2e: Fixes various things in e2e scenarios after router migration (#31685) * Explore: Update reading query params from router props and updating location via locationService (ReactRouter) (#31688) * RoutingNG: Initial explore redux location to router location migration * Updated explore Wrapper tests * Fixing more tests * remove loggin * rename back to make naming consistent * Fixing return to dashboard button * fixing navigation to explore from dashboard * updated routeProps * Updated tests * Make DashboardListPage work * Fixing navigation after add new data source, and fixes explore e2e * Fixing solo panel page * PluginsPage now works * RoutingNG: When parsing and rendering url search/query params preseve old logic of handling booleans and arrays (#31725) * RoutingNG: When parsing and rendering url search/query params preserve old logic of handling booleans and arrays * Fixed test * Make snapshots list work * fixed alert notification channel edit page * Simplify LocationService, did not need special handling for login or forceLogin as target _self on link already handles that * fixed UserAdminPage * fixed edit orgs page * Fixing LdapPage * fixing dashboard import * Fixed new folder page * Fixed data source dashboards page * fixing Folder permissions and folder settings page * fixing snapshot list page nav model * remove unused file * Added placeholder page for playlist * Moved browser compatability to index-template * Restored 404/default page * Fixed reset password page * Fixed SignUpInvited page * Fixing CreateTeam, Create user page, add panel widget * Restore browwser file to make tests happy * Fixed unit tests * Removed unused import * Replacing usage of updateLocation * Fixed test * Updating search filters to use history / location service for filters * remove unused file * AppRootPage fixed * Fixing test and search issue * Changes to support enterprise extensions * remove console.log * Removing more use of redux location * Fixed signup page * removed unused old angular controllers * Fixing bugs * one final bugfix * Removed location from redux state * Fixing ts issues and tests * Fixing test issue * fixing tests * Fixing tests * removed unused stuff * Fixed search test * Adding some doc comments * Routing NG: Angular location provider patch (#31773) * Patch Angulars $location provider * Update public/app/angular/bridgeReactAngularRouting.ts * Remove only test * Update tests, disable loggers in test env * Routing NG: remove $location provider usage (#31816) * Remove dashboard_loaders * Remove $location from Analytics service, track page views form GrafanaRoute * Remove NotificationsEditCtrl * Remove Angular dependencies from uploadDashboardDirective * Update public/app/features/dashboard/containers/DashboardPage.tsx Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com> * Update public/app/features/dashboard/containers/DashboardPage.tsx Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com> * Remove unused test helpers (#31831) * Playlist react (#31829) * playlist list in react * Playlist start * Things started to work * Updated * Handle empty list * Fix ts * Fixes and kiosk mode stuff * Removed unused events * fixing ts issue * Another ts issue * Fixing tests Co-authored-by: Dominik Prokop <dominik.prokop@grafana.com> * fixed test * Update public/app/AppWrapper.tsx Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com> * Update public/app/AppWrapper.tsx Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com> * Remove Angular dependency from DashboardLoaderSrv (#31863) Co-authored-by: Torkel Ödegaard <torkel@grafana.com> Co-authored-by: Torkel Ödegaard <torkel@grafana.org> Co-authored-by: Hugo Häggmark <hugo.haggmark@grafana.com> Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>
2021-03-10 11:03:36 -06:00
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
const dashboardUrl = locationUtil.stripBaseFromUrl(result.importedUrl);
Routing NG: Replace Angular routing with react-router (#31463) * Add router packages * Get react app root work instead of Angular one * Logger util * Patch Angular routing ($routeProvider, $routeParamsProvider) * Use react-router-dom history instead of separate dependency * Add test routes * Sidemenu - use Link instead of anchors * Patch Angular $location service (stub) * WIP: geting rid of $location provider from TimeSrv * Intercept anchor clicks to use history under the hood * Sync Redux location slice with history state * Make login/logout work * Debug routes for testing * Make force login work * Make sure query param change does not recreate page components * Hide side menu in specified locations * Make the dashboar route query parameters work, make panel edit menu work * Enable more routes * Fix side menu * Handle view modes * Disable playlist routes * Make SafeDynamicImport work again * Bring back router-debug * Separate redux location sync from route rendering * Refactor updateLocation to thunk and move force refresh(login) to it * Fixing init dashboard issue * Support switching between dashboards without an unmount of DashboardPage * More fixes for init dashboard and panel edit * More type fixes * Moving angular location wrapper out of main LocationService, and fixing typescript issues * Fixed last typescript errors * LocationService: Move to runtime and remove getLocationService and export singleston const instead (#31523) * Moving location service implementation to runtime and removing get function and making it a package const singleton * Added test that used locationService directly * removed unused import * AngularApp: Moving angular dependencies and the app boot out of the main app into it's own file (#31525) * Fixes angular panels by calling the monkey patch * Moving angular stuff to to it's own files * udpated * Fixing clicking on divs and spans inside anchor * Moving app notifications out of angular app and removing angular directive wrapper * Moving search from angular to react and removing angular search wrapper * Clean up, tried to remove the redux location wrapper but requires a big update for DashboardPage, so adding it back * Moving AppWrapper to root to limit circular dependencies (app/core -> app/routing and back) * Open and close search now works * Hide sidemenu when in kiosk mode * Restoring some keybindings like ESC key * Removed kiosk events and simplified it, just handled through updating URL * Fixing typescript errors * Simplified GrafanaRouteComponentProps and renamed to ContainerProps * renamed back * Changed AlertRuleList to use GrafanaRouteComponentProps and location.search passed to it * Removing the reloadOnSearch property, this is not needed now for react as react by default does not unmount components when only url match or query parmas change * SafeDynamicImport causing unmount un every search update, not sure how to fix yet * Fix signature for SafeDynamicImport so we do not create new route components on every route render * Removing the redux location wrapper as it was causing errors, and making dashboard page work with RouteProps (location, match) etc * Updating DashboardPage and SoloPanelPage to use match params and history location * Fixed DashboardPage tests * Fixing solo route tests * LocationService: Rename getCurrentLocation to just getLocation * do not intercept link clicks with target blank or self * Experimental useUrlParams hook * Update DataSourceSettingsPage to use router match params * fix links with urls that have no starting / to work like before * Fix forceLogin * Add queryParams to GrafanaRouteComponentProps * PanelEditor get rid of updateLocation and location state * Improve grafana route query params typing * Add getSearchObject to LocationService * Use DashboardPAge queryParams instead of location.search parsing * Fix DashboardPage typing * Fix some tests weirdness * Bring back KeyboardSrv * Fixes typescript issues * Team pages now use router match params * Get rid of from GrafanaRouteComponent props * Removed unnessary calls to getSearchObject when calling locationService.partial * Updated DashboardPage tests after queryParams was added * Fixing dashboard settings back * GrafanaRoute: Adding tests and remove use of global locationService * Fixing tests and typescript errors * Bring back kiosk modes and add tests * Fix TimeSrv tests * Fix typecheck errors * Fixing tests * Updated SideMenu test to react-testing and wrapped component in Router, and fixed issue importing createMemoryHistory * Get rid of routeChange event from TimeSrv from * Fixed TopSectionItem test * Trying to make basename work but failing * Update TopSectionItem snapshot * Fix TopSectionItem snapshot test * Fix API keys creation * Remove Angular dependencies from KeybindingSrv (#31617) * Remove Angular dependency from KeybindingsSrv * Fix tests and typecheck issues * basename is starting to work * Make dashboard save work * KeybindingSrv: Remove as angular service and no usage angular scope * So long bridge_srv, we won't miss you * Update snapshots * Dashboard: Refactoring ChangeTracker to use History api and no angular (#31653) * Dashboard: Refactoring ChangeTracker to use History api and no angular * Updated * Removed logging * fixed unit tests * updated snapshots * Mechanism for force reloading routes (#31683) * e2e: Fixes various things in e2e scenarios after router migration (#31685) * Explore: Update reading query params from router props and updating location via locationService (ReactRouter) (#31688) * RoutingNG: Initial explore redux location to router location migration * Updated explore Wrapper tests * Fixing more tests * remove loggin * rename back to make naming consistent * Fixing return to dashboard button * fixing navigation to explore from dashboard * updated routeProps * Updated tests * Make DashboardListPage work * Fixing navigation after add new data source, and fixes explore e2e * Fixing solo panel page * PluginsPage now works * RoutingNG: When parsing and rendering url search/query params preseve old logic of handling booleans and arrays (#31725) * RoutingNG: When parsing and rendering url search/query params preserve old logic of handling booleans and arrays * Fixed test * Make snapshots list work * fixed alert notification channel edit page * Simplify LocationService, did not need special handling for login or forceLogin as target _self on link already handles that * fixed UserAdminPage * fixed edit orgs page * Fixing LdapPage * fixing dashboard import * Fixed new folder page * Fixed data source dashboards page * fixing Folder permissions and folder settings page * fixing snapshot list page nav model * remove unused file * Added placeholder page for playlist * Moved browser compatability to index-template * Restored 404/default page * Fixed reset password page * Fixed SignUpInvited page * Fixing CreateTeam, Create user page, add panel widget * Restore browwser file to make tests happy * Fixed unit tests * Removed unused import * Replacing usage of updateLocation * Fixed test * Updating search filters to use history / location service for filters * remove unused file * AppRootPage fixed * Fixing test and search issue * Changes to support enterprise extensions * remove console.log * Removing more use of redux location * Fixed signup page * removed unused old angular controllers * Fixing bugs * one final bugfix * Removed location from redux state * Fixing ts issues and tests * Fixing test issue * fixing tests * Fixing tests * removed unused stuff * Fixed search test * Adding some doc comments * Routing NG: Angular location provider patch (#31773) * Patch Angulars $location provider * Update public/app/angular/bridgeReactAngularRouting.ts * Remove only test * Update tests, disable loggers in test env * Routing NG: remove $location provider usage (#31816) * Remove dashboard_loaders * Remove $location from Analytics service, track page views form GrafanaRoute * Remove NotificationsEditCtrl * Remove Angular dependencies from uploadDashboardDirective * Update public/app/features/dashboard/containers/DashboardPage.tsx Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com> * Update public/app/features/dashboard/containers/DashboardPage.tsx Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com> * Remove unused test helpers (#31831) * Playlist react (#31829) * playlist list in react * Playlist start * Things started to work * Updated * Handle empty list * Fix ts * Fixes and kiosk mode stuff * Removed unused events * fixing ts issue * Another ts issue * Fixing tests Co-authored-by: Dominik Prokop <dominik.prokop@grafana.com> * fixed test * Update public/app/AppWrapper.tsx Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com> * Update public/app/AppWrapper.tsx Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com> * Remove Angular dependency from DashboardLoaderSrv (#31863) Co-authored-by: Torkel Ödegaard <torkel@grafana.com> Co-authored-by: Torkel Ödegaard <torkel@grafana.org> Co-authored-by: Hugo Häggmark <hugo.haggmark@grafana.com> Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>
2021-03-10 11:03:36 -06:00
locationService.push(dashboardUrl);
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
};
}
const getDataSourceOptions = (input: { pluginId: string; pluginName: string }, inputModel: any) => {
const sources = getDataSourceSrv().getList({ pluginId: input.pluginId });
Migration: Migrate Dashboard Import to React (#22338) * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * first things * introduce headers and moving buttons * adding reducer and action for gcom dashboard * action working * continue building on import form * change dashboard title * add prop to not render a label * import form layout * break out form to component * add actions and reader for file upload * fix upload issue * modified data types to handle both gcom and file upload * import dashboard json * save dashboard * start change uid * change dashboard uid * fix spacing and date format * fix import from json * handle uid and title change * revert change in panelinspect * redo fileupload component * after review * redo forms to use Forms functionality * first attempt on async validation * use ternary on uid input * removed unused actions, fixed async validation on form * post form if invalid, break out form to component * sync file with master * fix after merge * nits * export formapi type * redo page to use forms validation * fix inputs and validation * readd post * add guards on data source and constants * type checks and strict nulls * strict nulls * validate onchange and fix import button when valid * shorten validate call * reexport OnSubmit type * add comment for overwrite useEffect * move validation functions to util * fix button imports * remove angular import * move title and uid validation
2020-03-31 09:29:44 -05:00
if (sources.length === 0) {
inputModel.info = 'No data sources of type ' + input.pluginName + ' found';
} else if (!inputModel.info) {
inputModel.info = 'Select a ' + input.pluginName + ' data source';
}
};
export async function moveFolders(folderUIDs: string[], toFolder: FolderInfo) {
const result = {
totalCount: folderUIDs.length,
successCount: 0,
};
for (const folderUID of folderUIDs) {
try {
const newFolderDTO = await moveFolder(folderUID, toFolder);
if (newFolderDTO !== null) {
result.successCount += 1;
}
} catch (err) {
console.error('Failed to move a folder', err);
}
}
return result;
}
export function moveDashboards(dashboardUids: string[], toFolder: FolderInfo) {
const tasks = [];
for (const uid of dashboardUids) {
tasks.push(createTask(moveDashboard, true, uid, toFolder));
}
return executeInOrder(tasks).then((result: any) => {
return {
totalCount: result.length,
successCount: result.filter((res: any) => res.succeeded).length,
alreadyInFolderCount: result.filter((res: any) => res.alreadyInFolder).length,
};
});
}
async function moveDashboard(uid: string, toFolder: FolderInfo) {
const fullDash: DashboardDTO = await getBackendSrv().get(`/api/dashboards/uid/${uid}`);
if (
((fullDash.meta.folderUid === undefined || fullDash.meta.folderUid === null) && toFolder.uid === '') ||
fullDash.meta.folderUid === toFolder.uid
) {
return { alreadyInFolder: true };
}
const options = {
dashboard: fullDash.dashboard,
folderUid: toFolder.uid,
overwrite: false,
};
try {
await saveDashboard(options);
return { succeeded: true };
} catch (err) {
if (isFetchError(err)) {
if (err.data?.status !== 'plugin-dashboard') {
return { succeeded: false };
}
err.isHandled = true;
}
options.overwrite = true;
try {
await saveDashboard(options);
return { succeeded: true };
} catch (e) {
return { succeeded: false };
}
}
}
function createTask(fn: (...args: any[]) => Promise<any>, ignoreRejections: boolean, ...args: any[]) {
return async (result: any) => {
try {
const res = await fn(...args);
return Array.prototype.concat(result, [res]);
} catch (err) {
if (ignoreRejections) {
return result;
}
throw err;
}
};
}
export function deleteFoldersAndDashboards(folderUids: string[], dashboardUids: string[]) {
const tasks = [];
for (const folderUid of folderUids) {
tasks.push(createTask(deleteFolder, true, folderUid, true));
}
for (const dashboardUid of dashboardUids) {
tasks.push(createTask(deleteDashboard, true, dashboardUid, true));
}
return executeInOrder(tasks);
}
2022-07-14 17:36:17 -05:00
export function saveDashboard(options: SaveDashboardCommand) {
dashboardWatcher.ignoreNextSave();
return getBackendSrv().post('/api/dashboards/db/', {
dashboard: options.dashboard,
message: options.message ?? '',
overwrite: options.overwrite ?? false,
folderUid: options.folderUid,
});
}
function deleteFolder(uid: string, showSuccessAlert: boolean) {
return getBackendSrv().delete(`/api/folders/${uid}?forceDeleteRules=false`, undefined, { showSuccessAlert });
}
export function createFolder(payload: any) {
return getBackendSrv().post('/api/folders', payload);
}
export function moveFolder(uid: string, toFolder: FolderInfo) {
const payload = {
parentUid: toFolder.uid,
};
return getBackendSrv().post(`/api/folders/${uid}/move`, payload, { showErrorAlert: false });
}
export const SLICE_FOLDER_RESULTS_TO = 1000;
export function searchFolders(
query: any,
permission?: PermissionLevelString,
type: SearchQueryType = SearchQueryType.Folder
): Promise<DashboardSearchHit[]> {
return getBackendSrv().get('/api/search', {
query,
type: type,
permission,
limit: SLICE_FOLDER_RESULTS_TO,
});
}
export function getFolderByUid(uid: string): Promise<{ uid: string; title: string }> {
return getBackendSrv().get(`/api/folders/${uid}`);
}
export function getFolderById(id: number): Promise<{ id: number; title: string }> {
return getBackendSrv().get(`/api/folders/id/${id}`);
}
export function deleteDashboard(uid: string, showSuccessAlert: boolean) {
return getBackendSrv().delete<DeleteDashboardResponse>(`/api/dashboards/uid/${uid}`, { showSuccessAlert });
}
function executeInOrder(tasks: any[]): Promise<unknown> {
return tasks.reduce((acc, task) => {
return Promise.resolve(acc).then(task);
}, []);
}