mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
noImplicitAny: Reduce errors to 3800-ish (#17781)
* Reduce noImplicitAny errors to 3900-ish * Fix lots of errors * Add interface
This commit is contained in:
Tobias Skarhed
Torkel Ödegaard
parent
013a1abb6f
commit
3045daedbd
@ -196,6 +196,7 @@
|
||||
"@types/redux-logger": "3.0.7",
|
||||
"@types/reselect": "2.2.0",
|
||||
"@types/slate": "0.44.11",
|
||||
"@types/tinycolor2": "1.4.2",
|
||||
"angular": "1.6.6",
|
||||
"angular-bindonce": "0.3.1",
|
||||
"angular-native-dragdrop": "1.2.2",
|
||||
|
||||
@ -11,3 +11,7 @@ export interface GraphSeriesXY {
|
||||
isVisible: boolean;
|
||||
yAxis: number;
|
||||
}
|
||||
|
||||
export interface CreatePlotOverlay {
|
||||
(element: JQuery, event: any, plot: { getOptions: () => { events: { manager: any } } }): any;
|
||||
}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
// Libaries
|
||||
import angular from 'angular';
|
||||
import angular, { IQService } from 'angular';
|
||||
import _ from 'lodash';
|
||||
|
||||
// Components
|
||||
@ -11,6 +11,9 @@ import { makeRegions, dedupAnnotations } from './events_processing';
|
||||
|
||||
// Types
|
||||
import { DashboardModel } from '../dashboard/state/DashboardModel';
|
||||
import DatasourceSrv from '../plugins/datasource_srv';
|
||||
import { BackendSrv } from 'app/core/services/backend_srv';
|
||||
import { TimeSrv } from '../dashboard/services/TimeSrv';
|
||||
|
||||
export class AnnotationsSrv {
|
||||
globalAnnotationsPromise: any;
|
||||
@ -18,7 +21,13 @@ export class AnnotationsSrv {
|
||||
datasourcePromises: any;
|
||||
|
||||
/** @ngInject */
|
||||
constructor(private $rootScope, private $q, private datasourceSrv, private backendSrv, private timeSrv) {}
|
||||
constructor(
|
||||
private $rootScope: any,
|
||||
private $q: IQService,
|
||||
private datasourceSrv: DatasourceSrv,
|
||||
private backendSrv: BackendSrv,
|
||||
private timeSrv: TimeSrv
|
||||
) {}
|
||||
|
||||
init(dashboard: DashboardModel) {
|
||||
// always clearPromiseCaches when loading new dashboard
|
||||
@ -33,7 +42,7 @@ export class AnnotationsSrv {
|
||||
this.datasourcePromises = null;
|
||||
}
|
||||
|
||||
getAnnotations(options) {
|
||||
getAnnotations(options: any) {
|
||||
return this.$q
|
||||
.all([this.getGlobalAnnotations(options), this.getAlertStates(options)])
|
||||
.then(results => {
|
||||
@ -70,7 +79,7 @@ export class AnnotationsSrv {
|
||||
});
|
||||
}
|
||||
|
||||
getAlertStates(options) {
|
||||
getAlertStates(options: any) {
|
||||
if (!options.dashboard.id) {
|
||||
return this.$q.when([]);
|
||||
}
|
||||
@ -94,7 +103,7 @@ export class AnnotationsSrv {
|
||||
return this.alertStatesPromise;
|
||||
}
|
||||
|
||||
getGlobalAnnotations(options) {
|
||||
getGlobalAnnotations(options: any) {
|
||||
const dashboard = options.dashboard;
|
||||
|
||||
if (this.globalAnnotationsPromise) {
|
||||
@ -117,7 +126,7 @@ export class AnnotationsSrv {
|
||||
dsPromises.push(datasourcePromise);
|
||||
promises.push(
|
||||
datasourcePromise
|
||||
.then(datasource => {
|
||||
.then((datasource: any) => {
|
||||
// issue query against data source
|
||||
return datasource.annotationQuery({
|
||||
range: range,
|
||||
@ -141,17 +150,17 @@ export class AnnotationsSrv {
|
||||
return this.globalAnnotationsPromise;
|
||||
}
|
||||
|
||||
saveAnnotationEvent(annotation) {
|
||||
saveAnnotationEvent(annotation: any) {
|
||||
this.globalAnnotationsPromise = null;
|
||||
return this.backendSrv.post('/api/annotations', annotation);
|
||||
}
|
||||
|
||||
updateAnnotationEvent(annotation) {
|
||||
updateAnnotationEvent(annotation: { id: any }) {
|
||||
this.globalAnnotationsPromise = null;
|
||||
return this.backendSrv.put(`/api/annotations/${annotation.id}`, annotation);
|
||||
}
|
||||
|
||||
deleteAnnotationEvent(annotation) {
|
||||
deleteAnnotationEvent(annotation: { id: any; isRegion: any; regionId: any }) {
|
||||
this.globalAnnotationsPromise = null;
|
||||
let deleteUrl = `/api/annotations/${annotation.id}`;
|
||||
if (annotation.isRegion) {
|
||||
@ -161,7 +170,7 @@ export class AnnotationsSrv {
|
||||
return this.backendSrv.delete(deleteUrl);
|
||||
}
|
||||
|
||||
translateQueryResult(annotation, results) {
|
||||
translateQueryResult(annotation: any, results: any) {
|
||||
// if annotation has snapshotData
|
||||
// make clone and remove it
|
||||
if (annotation.snapshotData) {
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import React, { PureComponent } from 'react';
|
||||
import _ from 'lodash';
|
||||
// @ts-ignore
|
||||
import Highlighter from 'react-highlight-words';
|
||||
import classnames from 'classnames';
|
||||
|
||||
@ -58,7 +59,7 @@ interface State {
|
||||
* Renders a highlighted field.
|
||||
* When hovering, a stats icon is shown.
|
||||
*/
|
||||
const FieldHighlight = onClick => props => {
|
||||
const FieldHighlight = (onClick: any) => (props: any) => {
|
||||
return (
|
||||
<span className={props.className} style={props.style}>
|
||||
{props.children}
|
||||
@ -86,7 +87,7 @@ const getLogRowWithContextStyles = (theme: GrafanaTheme, state: State) => {
|
||||
row: css`
|
||||
z-index: 1;
|
||||
outline: 9999px solid
|
||||
${tinycolor(outlineColor)
|
||||
${tinycolor(outlineColor as tinycolor.ColorInput)
|
||||
.setAlpha(0.7)
|
||||
.toRgbString()};
|
||||
`,
|
||||
@ -103,7 +104,7 @@ const getLogRowWithContextStyles = (theme: GrafanaTheme, state: State) => {
|
||||
export class LogRow extends PureComponent<Props, State> {
|
||||
mouseMessageTimer: NodeJS.Timer;
|
||||
|
||||
state = {
|
||||
state: any = {
|
||||
fieldCount: 0,
|
||||
fieldLabel: null,
|
||||
fieldStats: null,
|
||||
|
||||
@ -5,7 +5,7 @@ import _ from 'lodash';
|
||||
* @param yAxes data [{min: min_y1, min: max_y1}, {min: min_y2, max: max_y2}]
|
||||
* @param level Y level
|
||||
*/
|
||||
export function alignYLevel(yAxes, level) {
|
||||
export function alignYLevel(yAxes: any, level: any) {
|
||||
if (isNaN(level) || !checkCorrectAxis(yAxes)) {
|
||||
return;
|
||||
}
|
||||
@ -65,7 +65,7 @@ export function alignYLevel(yAxes, level) {
|
||||
restoreLevelFromZero(yLeft, yRight, level);
|
||||
}
|
||||
|
||||
function expandStuckValues(yLeft, yRight) {
|
||||
function expandStuckValues(yLeft: { max: number; min: number }, yRight: { max: number; min: number }) {
|
||||
// wide Y min and max using increased wideFactor
|
||||
const wideFactor = 0.25;
|
||||
if (yLeft.max === yLeft.min) {
|
||||
@ -78,7 +78,7 @@ function expandStuckValues(yLeft, yRight) {
|
||||
}
|
||||
}
|
||||
|
||||
function moveLevelToZero(yLeft, yRight, level) {
|
||||
function moveLevelToZero(yLeft: { min: number; max: number }, yRight: { min: number; max: number }, level: number) {
|
||||
if (level !== 0) {
|
||||
yLeft.min -= level;
|
||||
yLeft.max -= level;
|
||||
@ -87,7 +87,11 @@ function moveLevelToZero(yLeft, yRight, level) {
|
||||
}
|
||||
}
|
||||
|
||||
function restoreLevelFromZero(yLeft, yRight, level) {
|
||||
function restoreLevelFromZero(
|
||||
yLeft: { min: number; max: number },
|
||||
yRight: { min: number; max: number },
|
||||
level: number
|
||||
) {
|
||||
if (level !== 0) {
|
||||
yLeft.min += level;
|
||||
yLeft.max += level;
|
||||
@ -96,30 +100,35 @@ function restoreLevelFromZero(yLeft, yRight, level) {
|
||||
}
|
||||
}
|
||||
|
||||
function checkCorrectAxis(axis) {
|
||||
interface AxisSide {
|
||||
max: number;
|
||||
min: number;
|
||||
}
|
||||
|
||||
function checkCorrectAxis(axis: any[]) {
|
||||
return axis.length === 2 && checkCorrectAxes(axis[0]) && checkCorrectAxes(axis[1]);
|
||||
}
|
||||
|
||||
function checkCorrectAxes(axes) {
|
||||
function checkCorrectAxes(axes: any) {
|
||||
return 'min' in axes && 'max' in axes;
|
||||
}
|
||||
|
||||
function checkOneSide(yLeft, yRight) {
|
||||
function checkOneSide(yLeft: AxisSide, yRight: AxisSide) {
|
||||
// on the one hand with respect to zero
|
||||
return (yLeft.min >= 0 && yRight.min >= 0) || (yLeft.max <= 0 && yRight.max <= 0);
|
||||
}
|
||||
|
||||
function checkTwoCross(yLeft, yRight) {
|
||||
function checkTwoCross(yLeft: AxisSide, yRight: AxisSide) {
|
||||
// both across zero
|
||||
return yLeft.min <= 0 && yLeft.max >= 0 && yRight.min <= 0 && yRight.max >= 0;
|
||||
}
|
||||
|
||||
function checkOppositeSides(yLeft, yRight) {
|
||||
function checkOppositeSides(yLeft: AxisSide, yRight: AxisSide) {
|
||||
// on the opposite sides with respect to zero
|
||||
return (yLeft.min >= 0 && yRight.max <= 0) || (yLeft.max <= 0 && yRight.min >= 0);
|
||||
}
|
||||
|
||||
function getRate(yLeft, yRight) {
|
||||
function getRate(yLeft: AxisSide, yRight: AxisSide) {
|
||||
let rateLeft, rateRight, rate;
|
||||
if (checkTwoCross(yLeft, yRight)) {
|
||||
rateLeft = yRight.min ? yLeft.min / yRight.min : 0;
|
||||
|
||||
@ -9,7 +9,7 @@ type Options = {
|
||||
};
|
||||
|
||||
export class DataProcessor {
|
||||
constructor(private panel) {}
|
||||
constructor(private panel: any) {}
|
||||
|
||||
getSeriesList(options: Options): TimeSeries[] {
|
||||
const list: TimeSeries[] = [];
|
||||
@ -140,7 +140,7 @@ export class DataProcessor {
|
||||
}
|
||||
}
|
||||
|
||||
getXAxisValueOptions(options) {
|
||||
getXAxisValueOptions(options: any) {
|
||||
switch (this.panel.xaxis.mode) {
|
||||
case 'series': {
|
||||
return [
|
||||
|
||||
@ -16,7 +16,7 @@ import GraphTooltip from './graph_tooltip';
|
||||
import { ThresholdManager } from './threshold_manager';
|
||||
import { TimeRegionManager } from './time_region_manager';
|
||||
import { EventManager } from 'app/features/annotations/all';
|
||||
import { LinkService } from 'app/features/panel/panellinks/link_srv';
|
||||
import { LinkService, LinkSrv } from 'app/features/panel/panellinks/link_srv';
|
||||
import { convertToHistogramData } from './histogram';
|
||||
import { alignYLevel } from './align_yaxes';
|
||||
import config from 'app/core/config';
|
||||
@ -29,6 +29,8 @@ import { getValueFormat, ContextMenuItem, ContextMenuGroup, DataLink } from '@gr
|
||||
import { provideTheme } from 'app/core/utils/ConfigProvider';
|
||||
import { toUtc } from '@grafana/ui/src/utils/moment_wrapper';
|
||||
import { GraphContextMenuCtrl, FlotDataPoint } from './GraphContextMenuCtrl';
|
||||
import { TimeSrv } from 'app/features/dashboard/services/TimeSrv';
|
||||
import { ContextSrv } from 'app/core/services/context_srv';
|
||||
|
||||
const LegendWithThemeProvider = provideTheme(Legend);
|
||||
|
||||
@ -48,8 +50,7 @@ class GraphElement {
|
||||
timeRegionManager: TimeRegionManager;
|
||||
legendElem: HTMLElement;
|
||||
|
||||
// @ts-ignore
|
||||
constructor(private scope, private elem, private timeSrv, private linkSrv: LinkService) {
|
||||
constructor(private scope: any, private elem: JQuery, private timeSrv: TimeSrv, private linkSrv: LinkService) {
|
||||
this.ctrl = scope.ctrl;
|
||||
this.contextMenu = scope.ctrl.contextMenuCtrl;
|
||||
this.dashboard = this.ctrl.dashboard;
|
||||
@ -60,6 +61,7 @@ class GraphElement {
|
||||
this.eventManager = new EventManager(this.ctrl);
|
||||
this.thresholdManager = new ThresholdManager(this.ctrl);
|
||||
this.timeRegionManager = new TimeRegionManager(this.ctrl, config.theme.type);
|
||||
// @ts-ignore
|
||||
this.tooltip = new GraphTooltip(this.elem, this.ctrl.dashboard, this.scope, () => {
|
||||
return this.sortedSeries;
|
||||
});
|
||||
@ -80,7 +82,7 @@ class GraphElement {
|
||||
}
|
||||
}
|
||||
|
||||
onRender(renderData) {
|
||||
onRender(renderData: any[]) {
|
||||
this.data = renderData || this.data;
|
||||
if (!this.data) {
|
||||
return;
|
||||
@ -217,7 +219,7 @@ class GraphElement {
|
||||
onPlotClick(event: JQueryEventObject, pos: any, item: any) {
|
||||
const scrollContextElement = this.elem.closest('.view') ? this.elem.closest('.view').get()[0] : null;
|
||||
const contextMenuSourceItem = item;
|
||||
let contextMenuItems;
|
||||
let contextMenuItems: ContextMenuItem[];
|
||||
|
||||
if (this.panel.xaxis.mode !== 'time') {
|
||||
// Skip if panel in histogram or series mode
|
||||
@ -235,7 +237,7 @@ class GraphElement {
|
||||
return;
|
||||
} else {
|
||||
this.tooltip.clear(this.plot);
|
||||
contextMenuItems = this.getContextMenuItems(pos, item);
|
||||
contextMenuItems = this.getContextMenuItems(pos, item) as ContextMenuItem[];
|
||||
this.scope.$apply(() => {
|
||||
// Setting nearest CustomScrollbar element as a scroll context for graph context menu
|
||||
this.contextMenu.setScrollContextElement(scrollContextElement);
|
||||
@ -258,7 +260,7 @@ class GraphElement {
|
||||
return false;
|
||||
}
|
||||
|
||||
drawHook(plot) {
|
||||
drawHook(plot: any) {
|
||||
// add left axis labels
|
||||
if (this.panel.yaxes[0].label && this.panel.yaxes[0].show) {
|
||||
$("<div class='axisLabel left-yaxis-label flot-temp-elem'></div>")
|
||||
@ -281,7 +283,7 @@ class GraphElement {
|
||||
this.timeRegionManager.draw(plot);
|
||||
}
|
||||
|
||||
processOffsetHook(plot, gridMargin) {
|
||||
processOffsetHook(plot: any, gridMargin: { left: number; right: number }) {
|
||||
const left = this.panel.yaxes[0];
|
||||
const right = this.panel.yaxes[1];
|
||||
if (left.show && left.label) {
|
||||
@ -294,14 +296,14 @@ class GraphElement {
|
||||
// apply y-axis min/max options
|
||||
const yaxis = plot.getYAxes();
|
||||
for (let i = 0; i < yaxis.length; i++) {
|
||||
const axis = yaxis[i];
|
||||
const axis: any = yaxis[i];
|
||||
const panelOptions = this.panel.yaxes[i];
|
||||
axis.options.max = axis.options.max !== null ? axis.options.max : panelOptions.max;
|
||||
axis.options.min = axis.options.min !== null ? axis.options.min : panelOptions.min;
|
||||
}
|
||||
}
|
||||
|
||||
processRangeHook(plot) {
|
||||
processRangeHook(plot: any) {
|
||||
const yAxes = plot.getYAxes();
|
||||
const align = this.panel.yaxis.align || false;
|
||||
|
||||
@ -314,7 +316,7 @@ class GraphElement {
|
||||
// Series could have different timeSteps,
|
||||
// let's find the smallest one so that bars are correctly rendered.
|
||||
// In addition, only take series which are rendered as bars for this.
|
||||
getMinTimeStepOfSeries(data) {
|
||||
getMinTimeStepOfSeries(data: any[]) {
|
||||
let min = Number.MAX_VALUE;
|
||||
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
@ -364,7 +366,7 @@ class GraphElement {
|
||||
this.callPlot(options, true);
|
||||
}
|
||||
|
||||
buildFlotPairs(data) {
|
||||
buildFlotPairs(data: any) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
const series = data[i];
|
||||
series.data = series.getFlotPairs(series.nullPointMode || this.panel.nullPointMode);
|
||||
@ -377,7 +379,7 @@ class GraphElement {
|
||||
}
|
||||
}
|
||||
|
||||
prepareXAxis(options, panel) {
|
||||
prepareXAxis(options: any, panel: any) {
|
||||
switch (panel.xaxis.mode) {
|
||||
case 'series': {
|
||||
options.series.bars.barWidth = 0.7;
|
||||
@ -430,7 +432,7 @@ class GraphElement {
|
||||
}
|
||||
}
|
||||
|
||||
callPlot(options, incrementRenderCounter) {
|
||||
callPlot(options: any, incrementRenderCounter: boolean) {
|
||||
try {
|
||||
this.plot = $.plot(this.elem, this.sortedSeries, options);
|
||||
if (this.ctrl.renderError) {
|
||||
@ -449,13 +451,13 @@ class GraphElement {
|
||||
}
|
||||
}
|
||||
|
||||
buildFlotOptions(panel) {
|
||||
buildFlotOptions(panel: any) {
|
||||
let gridColor = '#c8c8c8';
|
||||
if (config.bootData.user.lightTheme === true) {
|
||||
gridColor = '#a1a1a1';
|
||||
}
|
||||
const stack = panel.stack ? true : null;
|
||||
const options = {
|
||||
const options: any = {
|
||||
hooks: {
|
||||
draw: [this.drawHook.bind(this)],
|
||||
processOffset: [this.processOffsetHook.bind(this)],
|
||||
@ -518,7 +520,7 @@ class GraphElement {
|
||||
return options;
|
||||
}
|
||||
|
||||
sortSeries(series, panel) {
|
||||
sortSeries(series: any, panel: any) {
|
||||
const sortBy = panel.legend.sort;
|
||||
const sortOrder = panel.legend.sortDesc;
|
||||
const haveSortBy = sortBy !== null && sortBy !== undefined && panel.legend[sortBy];
|
||||
@ -551,7 +553,7 @@ class GraphElement {
|
||||
}
|
||||
}
|
||||
|
||||
addTimeAxis(options) {
|
||||
addTimeAxis(options: any) {
|
||||
const ticks = this.panelWidth / 100;
|
||||
const min = _.isUndefined(this.ctrl.range.from) ? null : this.ctrl.range.from.valueOf();
|
||||
const max = _.isUndefined(this.ctrl.range.to) ? null : this.ctrl.range.to.valueOf();
|
||||
@ -568,7 +570,7 @@ class GraphElement {
|
||||
};
|
||||
}
|
||||
|
||||
addXSeriesAxis(options) {
|
||||
addXSeriesAxis(options: any) {
|
||||
const ticks = _.map(this.data, (series, index) => {
|
||||
return [index + 1, series.alias];
|
||||
});
|
||||
@ -584,7 +586,7 @@ class GraphElement {
|
||||
};
|
||||
}
|
||||
|
||||
addXHistogramAxis(options, bucketSize) {
|
||||
addXHistogramAxis(options: any, bucketSize: number) {
|
||||
let ticks, min, max;
|
||||
const defaultTicks = this.panelWidth / 50;
|
||||
|
||||
@ -637,7 +639,7 @@ class GraphElement {
|
||||
this.configureAxisMode(options.xaxis, 'short');
|
||||
}
|
||||
|
||||
addXTableAxis(options) {
|
||||
addXTableAxis(options: any) {
|
||||
let ticks = _.map(this.data, (series, seriesIndex) => {
|
||||
return _.map(series.datapoints, (point, pointIndex) => {
|
||||
const tickIndex = seriesIndex * series.datapoints.length + pointIndex;
|
||||
@ -658,7 +660,7 @@ class GraphElement {
|
||||
};
|
||||
}
|
||||
|
||||
configureYAxisOptions(data, options) {
|
||||
configureYAxisOptions(data: any, options: any) {
|
||||
const defaults = {
|
||||
position: 'left',
|
||||
show: this.panel.yaxes[0].show,
|
||||
@ -703,7 +705,7 @@ class GraphElement {
|
||||
return _.toNumber(value);
|
||||
}
|
||||
|
||||
applyLogScale(axis, data) {
|
||||
applyLogScale(axis: any, data: any) {
|
||||
if (axis.logBase === 1) {
|
||||
return;
|
||||
}
|
||||
@ -733,10 +735,10 @@ class GraphElement {
|
||||
}
|
||||
}
|
||||
|
||||
axis.transform = v => {
|
||||
axis.transform = (v: number) => {
|
||||
return v < Number.MIN_VALUE ? null : Math.log(v) / Math.log(axis.logBase);
|
||||
};
|
||||
axis.inverseTransform = v => {
|
||||
axis.inverseTransform = (v: any) => {
|
||||
return Math.pow(axis.logBase, v);
|
||||
};
|
||||
|
||||
@ -784,7 +786,7 @@ class GraphElement {
|
||||
}
|
||||
}
|
||||
|
||||
generateTicksForLogScaleYAxis(min, max, logBase) {
|
||||
generateTicksForLogScaleYAxis(min: any, max: number, logBase: number) {
|
||||
let ticks = [];
|
||||
|
||||
let nextTick;
|
||||
@ -806,7 +808,7 @@ class GraphElement {
|
||||
return ticks;
|
||||
}
|
||||
|
||||
configureAxisMode(axis, format) {
|
||||
configureAxisMode(axis: { tickFormatter: (val: any, axis: any) => string }, format: string) {
|
||||
axis.tickFormatter = (val, axis) => {
|
||||
const formatter = getValueFormat(format);
|
||||
|
||||
@ -817,7 +819,7 @@ class GraphElement {
|
||||
};
|
||||
}
|
||||
|
||||
time_format(ticks, min, max) {
|
||||
time_format(ticks: number, min: number, max: number) {
|
||||
if (min && max && ticks) {
|
||||
const range = max - min;
|
||||
const secPerTick = range / ticks / 1000;
|
||||
@ -846,11 +848,11 @@ class GraphElement {
|
||||
}
|
||||
|
||||
/** @ngInject */
|
||||
function graphDirective(timeSrv, popoverSrv, contextSrv, linkSrv) {
|
||||
function graphDirective(timeSrv: TimeSrv, popoverSrv: any, contextSrv: ContextSrv, linkSrv: LinkSrv) {
|
||||
return {
|
||||
restrict: 'A',
|
||||
template: '',
|
||||
link: (scope, elem) => {
|
||||
link: (scope: any, elem: JQuery) => {
|
||||
return new GraphElement(scope, elem, timeSrv, linkSrv);
|
||||
},
|
||||
};
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import $ from 'jquery';
|
||||
import { appEvents } from 'app/core/core';
|
||||
|
||||
export default function GraphTooltip(this: any, elem, dashboard, scope, getSeriesFn) {
|
||||
export default function GraphTooltip(this: any, elem: any, dashboard: any, scope: any, getSeriesFn: any) {
|
||||
const self = this;
|
||||
const ctrl = scope.ctrl;
|
||||
const panel = ctrl.panel;
|
||||
@ -12,7 +12,7 @@ export default function GraphTooltip(this: any, elem, dashboard, scope, getSerie
|
||||
$tooltip.remove();
|
||||
};
|
||||
|
||||
this.findHoverIndexFromDataPoints = (posX, series, last) => {
|
||||
this.findHoverIndexFromDataPoints = (posX: number, series: any, last: number) => {
|
||||
const ps = series.datapoints.pointsize;
|
||||
const initial = last * ps;
|
||||
const len = series.datapoints.points.length;
|
||||
@ -30,7 +30,7 @@ export default function GraphTooltip(this: any, elem, dashboard, scope, getSerie
|
||||
return j / ps - 1;
|
||||
};
|
||||
|
||||
this.findHoverIndexFromData = (posX, series) => {
|
||||
this.findHoverIndexFromData = (posX: any, series: any) => {
|
||||
let lower = 0;
|
||||
let upper = series.data.length - 1;
|
||||
let middle;
|
||||
@ -49,14 +49,14 @@ export default function GraphTooltip(this: any, elem, dashboard, scope, getSerie
|
||||
}
|
||||
};
|
||||
|
||||
this.renderAndShow = (absoluteTime, innerHtml, pos, xMode) => {
|
||||
this.renderAndShow = (absoluteTime: string, innerHtml: string, pos: { pageX: number; pageY: any }, xMode: string) => {
|
||||
if (xMode === 'time') {
|
||||
innerHtml = '<div class="graph-tooltip-time">' + absoluteTime + '</div>' + innerHtml;
|
||||
}
|
||||
$tooltip.html(innerHtml).place_tt(pos.pageX + 20, pos.pageY);
|
||||
};
|
||||
|
||||
this.getMultiSeriesPlotHoverInfo = function(seriesList, pos) {
|
||||
this.getMultiSeriesPlotHoverInfo = function(seriesList: any[], pos: { x: number }) {
|
||||
let value, i, series, hoverIndex, hoverDistance, pointTime, yaxis;
|
||||
// 3 sub-arrays, 1st for hidden series, 2nd for left yaxis, 3rd for right yaxis.
|
||||
let results: any = [[], [], []];
|
||||
@ -158,7 +158,7 @@ export default function GraphTooltip(this: any, elem, dashboard, scope, getSerie
|
||||
appEvents.emit('graph-hover-clear');
|
||||
});
|
||||
|
||||
elem.bind('plothover', (event, pos, item) => {
|
||||
elem.bind('plothover', (event: any, pos: { panelRelY: number; pageY: number }, item: any) => {
|
||||
self.show(pos, item);
|
||||
|
||||
// broadcast to other graph panels that we are hovering!
|
||||
@ -166,17 +166,17 @@ export default function GraphTooltip(this: any, elem, dashboard, scope, getSerie
|
||||
appEvents.emit('graph-hover', { pos: pos, panel: panel });
|
||||
});
|
||||
|
||||
elem.bind('plotclick', (event, pos, item) => {
|
||||
elem.bind('plotclick', (event: any, pos: any, item: any) => {
|
||||
appEvents.emit('graph-click', { pos: pos, panel: panel, item: item });
|
||||
});
|
||||
|
||||
this.clear = plot => {
|
||||
this.clear = (plot: { clearCrosshair: () => void; unhighlight: () => void }) => {
|
||||
$tooltip.detach();
|
||||
plot.clearCrosshair();
|
||||
plot.unhighlight();
|
||||
};
|
||||
|
||||
this.show = (pos, item) => {
|
||||
this.show = (pos: any, item: any) => {
|
||||
const plot = elem.data().plot;
|
||||
const plotData = plot.getData();
|
||||
const xAxes = plot.getXAxes();
|
||||
@ -232,11 +232,11 @@ export default function GraphTooltip(this: any, elem, dashboard, scope, getSerie
|
||||
// Dynamically reorder the hovercard for the current time point if the
|
||||
// option is enabled.
|
||||
if (panel.tooltip.sort === 2) {
|
||||
seriesHoverInfo.sort((a, b) => {
|
||||
seriesHoverInfo.sort((a: { value: number }, b: { value: number }) => {
|
||||
return b.value - a.value;
|
||||
});
|
||||
} else if (panel.tooltip.sort === 1) {
|
||||
seriesHoverInfo.sort((a, b) => {
|
||||
seriesHoverInfo.sort((a: { value: number }, b: { value: number }) => {
|
||||
return a.value - b.value;
|
||||
});
|
||||
}
|
||||
|
||||
@ -30,7 +30,7 @@ export function getSeriesValues(dataList: TimeSeries[]): number[] {
|
||||
* @param bucketSize
|
||||
*/
|
||||
export function convertValuesToHistogram(values: number[], bucketSize: number, min: number, max: number): any[] {
|
||||
const histogram = {};
|
||||
const histogram: any = {};
|
||||
|
||||
const minBound = getBucketBound(min, bucketSize);
|
||||
const maxBound = getBucketBound(max, bucketSize);
|
||||
@ -71,7 +71,7 @@ export function convertToHistogramData(
|
||||
min: number,
|
||||
max: number
|
||||
): any[] {
|
||||
return data.map(series => {
|
||||
return data.map((series: any) => {
|
||||
const values = getSeriesValues([series]);
|
||||
series.histogram = true;
|
||||
if (!hiddenSeries[series.alias]) {
|
||||
|
||||
@ -1,10 +1,12 @@
|
||||
import angular from 'angular';
|
||||
import $ from 'jquery';
|
||||
import _ from 'lodash';
|
||||
//@ts-ignore
|
||||
import Drop from 'tether-drop';
|
||||
import { CreatePlotOverlay } from '@grafana/ui';
|
||||
|
||||
/** @ngInject */
|
||||
export function createAnnotationToolip(element, event, plot) {
|
||||
const createAnnotationToolip: CreatePlotOverlay = (element, event, plot) => {
|
||||
const injector = angular.element(document).injector();
|
||||
const content = document.createElement('div');
|
||||
content.innerHTML = '<annotation-tooltip event="event" on-edit="onEdit()"></annotation-tooltip>';
|
||||
@ -45,12 +47,12 @@ export function createAnnotationToolip(element, event, plot) {
|
||||
});
|
||||
},
|
||||
]);
|
||||
}
|
||||
};
|
||||
|
||||
let markerElementToAttachTo = null;
|
||||
let markerElementToAttachTo: any = null;
|
||||
|
||||
/** @ngInject */
|
||||
export function createEditPopover(element, event, plot) {
|
||||
const createEditPopover: CreatePlotOverlay = (element, event, plot) => {
|
||||
const eventManager = plot.getOptions().events.manager;
|
||||
if (eventManager.editorOpen) {
|
||||
// update marker element to attach to (needed in case of legend on the right
|
||||
@ -75,7 +77,7 @@ export function createEditPopover(element, event, plot) {
|
||||
'$rootScope',
|
||||
($compile, $rootScope) => {
|
||||
const scope = $rootScope.$new(true);
|
||||
let drop;
|
||||
let drop: any;
|
||||
|
||||
scope.event = event;
|
||||
scope.panelCtrl = eventManager.panelCtrl;
|
||||
@ -111,7 +113,9 @@ export function createEditPopover(element, event, plot) {
|
||||
},
|
||||
]);
|
||||
}, 100);
|
||||
}
|
||||
};
|
||||
|
||||
export { createEditPopover, createAnnotationToolip };
|
||||
|
||||
/*
|
||||
* jquery.flot.events
|
||||
@ -141,12 +145,21 @@ export class DrawableEvent {
|
||||
_height: any;
|
||||
|
||||
/** @ngInject */
|
||||
constructor(object, drawFunc, clearFunc, moveFunc, left, top, width, height) {
|
||||
constructor(
|
||||
object: JQuery,
|
||||
drawFunc: any,
|
||||
clearFunc: any,
|
||||
moveFunc: any,
|
||||
left: number,
|
||||
top: number,
|
||||
width: number,
|
||||
height: number
|
||||
) {
|
||||
this._object = object;
|
||||
this._drawFunc = drawFunc;
|
||||
this._clearFunc = clearFunc;
|
||||
this._moveFunc = moveFunc;
|
||||
this._position = { left: left, top: top };
|
||||
this._position = { left, top };
|
||||
this._width = width;
|
||||
this._height = height;
|
||||
}
|
||||
@ -169,7 +182,7 @@ export class DrawableEvent {
|
||||
getObject() {
|
||||
return this._object;
|
||||
}
|
||||
moveTo(position) {
|
||||
moveTo(position: { left: number; top: number }) {
|
||||
this._position = position;
|
||||
this._moveFunc(this._object, this._position);
|
||||
}
|
||||
@ -185,7 +198,7 @@ export class VisualEvent {
|
||||
_hidden: any;
|
||||
|
||||
/** @ngInject */
|
||||
constructor(options, drawableEvent) {
|
||||
constructor(options: any, drawableEvent: DrawableEvent) {
|
||||
this._options = options;
|
||||
this._drawableEvent = drawableEvent;
|
||||
this._hidden = false;
|
||||
@ -221,7 +234,7 @@ export class EventMarkers {
|
||||
eventsEnabled: any;
|
||||
|
||||
/** @ngInject */
|
||||
constructor(plot) {
|
||||
constructor(plot: any) {
|
||||
this._events = [];
|
||||
this._types = [];
|
||||
this._plot = plot;
|
||||
@ -232,14 +245,14 @@ export class EventMarkers {
|
||||
return this._events;
|
||||
}
|
||||
|
||||
setTypes(types) {
|
||||
setTypes(types: any) {
|
||||
return (this._types = types);
|
||||
}
|
||||
|
||||
/**
|
||||
* create internal objects for the given events
|
||||
*/
|
||||
setupEvents(events) {
|
||||
setupEvents(events: any[]) {
|
||||
const parts = _.partition(events, 'isRegion');
|
||||
const regions = parts[0];
|
||||
events = parts[1];
|
||||
@ -254,7 +267,7 @@ export class EventMarkers {
|
||||
this._events.push(vre);
|
||||
});
|
||||
|
||||
this._events.sort((a, b) => {
|
||||
this._events.sort((a: any, b: any) => {
|
||||
const ao = a.getOptions(),
|
||||
bo = b.getOptions();
|
||||
if (ao.min > bo.min) {
|
||||
@ -315,7 +328,7 @@ export class EventMarkers {
|
||||
/**
|
||||
* create a DOM element for the given event
|
||||
*/
|
||||
_buildDiv(event) {
|
||||
_buildDiv(event: { eventType: any; min: any; editModel: any }) {
|
||||
const that = this;
|
||||
|
||||
const container = this._plot.getPlaceholder();
|
||||
@ -440,13 +453,13 @@ export class EventMarkers {
|
||||
|
||||
const drawableEvent = new DrawableEvent(
|
||||
line,
|
||||
function drawFunc(obj) {
|
||||
function drawFunc(obj: { show: () => void }) {
|
||||
obj.show();
|
||||
},
|
||||
obj => {
|
||||
(obj: { remove: () => void }) => {
|
||||
obj.remove();
|
||||
},
|
||||
(obj, position) => {
|
||||
(obj: any, position: { top: any; left: any }) => {
|
||||
obj.css({
|
||||
top: position.top,
|
||||
left: position.left,
|
||||
@ -464,13 +477,19 @@ export class EventMarkers {
|
||||
/**
|
||||
* create a DOM element for the given region
|
||||
*/
|
||||
_buildRegDiv(event) {
|
||||
_buildRegDiv(event: { eventType: any; min: number; timeEnd: number; editModel: any }) {
|
||||
const that = this;
|
||||
|
||||
const container = this._plot.getPlaceholder();
|
||||
const o = this._plot.getPlotOffset();
|
||||
const xaxis = this._plot.getXAxes()[this._plot.getOptions().events.xaxis - 1];
|
||||
let top, left, lineWidth, regionWidth, lineStyle, color, markerTooltip;
|
||||
let top,
|
||||
left,
|
||||
lineWidth: number,
|
||||
regionWidth,
|
||||
lineStyle: string | number | cssPropertySetter,
|
||||
color: string,
|
||||
markerTooltip;
|
||||
|
||||
// map the eventType to a types object
|
||||
const eventTypeId = event.eventType;
|
||||
@ -560,13 +579,13 @@ export class EventMarkers {
|
||||
|
||||
const drawableEvent = new DrawableEvent(
|
||||
region,
|
||||
function drawFunc(obj) {
|
||||
function drawFunc(obj: { show: () => void }) {
|
||||
obj.show();
|
||||
},
|
||||
obj => {
|
||||
(obj: { remove: () => void }) => {
|
||||
obj.remove();
|
||||
},
|
||||
(obj, position) => {
|
||||
(obj: { css: (arg0: { top: any; left: any }) => void }, position: { top: any; left: any }) => {
|
||||
obj.css({
|
||||
top: position.top,
|
||||
left: position.left,
|
||||
@ -584,7 +603,7 @@ export class EventMarkers {
|
||||
/**
|
||||
* check if the event is inside visible range
|
||||
*/
|
||||
_insidePlot(x) {
|
||||
_insidePlot(x: any) {
|
||||
const xaxis = this._plot.getXAxes()[this._plot.getOptions().events.xaxis - 1];
|
||||
const xc = xaxis.p2c(x);
|
||||
return xc > 0 && xc < xaxis.p2c(xaxis.max);
|
||||
@ -596,7 +615,7 @@ export class EventMarkers {
|
||||
*/
|
||||
|
||||
/** @ngInject */
|
||||
export function init(this: any, plot) {
|
||||
export function init(this: any, plot: any) {
|
||||
/*jshint validthis:true */
|
||||
const that = this;
|
||||
const eventMarkers = new EventMarkers(plot);
|
||||
@ -624,20 +643,20 @@ export function init(this: any, plot) {
|
||||
};
|
||||
|
||||
// change events on an existing plot
|
||||
plot.setEvents = events => {
|
||||
plot.setEvents = (events: any[]) => {
|
||||
if (eventMarkers.eventsEnabled) {
|
||||
eventMarkers.setupEvents(events);
|
||||
}
|
||||
};
|
||||
|
||||
plot.hooks.processOptions.push((plot, options) => {
|
||||
plot.hooks.processOptions.push((plot: any, options: any) => {
|
||||
// enable the plugin
|
||||
if (options.events.data != null) {
|
||||
eventMarkers.eventsEnabled = true;
|
||||
}
|
||||
});
|
||||
|
||||
plot.hooks.draw.push(plot => {
|
||||
plot.hooks.draw.push((plot: any) => {
|
||||
const options = plot.getOptions();
|
||||
|
||||
if (eventMarkers.eventsEnabled) {
|
||||
@ -654,7 +673,7 @@ export function init(this: any, plot) {
|
||||
});
|
||||
}
|
||||
|
||||
const defaultOptions = {
|
||||
const defaultOptions: any = {
|
||||
events: {
|
||||
data: null,
|
||||
types: null,
|
||||
|
||||
@ -17,6 +17,9 @@ import { PanelQueryRunnerFormat } from 'app/features/dashboard/state/PanelQueryR
|
||||
import { GraphContextMenuCtrl } from './GraphContextMenuCtrl';
|
||||
import { getDataLinksVariableSuggestions } from 'app/features/panel/panellinks/link_srv';
|
||||
|
||||
import { auto } from 'angular';
|
||||
import { AnnotationsSrv } from 'app/features/annotations/all';
|
||||
|
||||
class GraphCtrl extends MetricsPanelCtrl {
|
||||
static template = template;
|
||||
|
||||
@ -35,7 +38,7 @@ class GraphCtrl extends MetricsPanelCtrl {
|
||||
contextMenuCtrl: GraphContextMenuCtrl;
|
||||
linkVariableSuggestions: VariableSuggestion[] = getDataLinksVariableSuggestions();
|
||||
|
||||
panelDefaults = {
|
||||
panelDefaults: any = {
|
||||
// datasource name, null = default datasource
|
||||
datasource: null,
|
||||
// sets client side (flot) or native graphite png renderer (png)
|
||||
@ -130,7 +133,7 @@ class GraphCtrl extends MetricsPanelCtrl {
|
||||
};
|
||||
|
||||
/** @ngInject */
|
||||
constructor($scope, $injector, private annotationsSrv) {
|
||||
constructor($scope: any, $injector: auto.IInjectorService, private annotationsSrv: AnnotationsSrv) {
|
||||
super($scope, $injector);
|
||||
|
||||
_.defaults(this.panel, this.panelDefaults);
|
||||
@ -162,12 +165,12 @@ class GraphCtrl extends MetricsPanelCtrl {
|
||||
this.subTabIndex = 0;
|
||||
}
|
||||
|
||||
onInitPanelActions(actions) {
|
||||
onInitPanelActions(actions: any[]) {
|
||||
actions.push({ text: 'Export CSV', click: 'ctrl.exportCsv()' });
|
||||
actions.push({ text: 'Toggle legend', click: 'ctrl.toggleLegend()', shortcut: 'p l' });
|
||||
}
|
||||
|
||||
issueQueries(datasource) {
|
||||
issueQueries(datasource: any) {
|
||||
this.annotationsPromise = this.annotationsSrv.getAnnotations({
|
||||
dashboard: this.dashboard,
|
||||
panel: this.panel,
|
||||
@ -180,16 +183,16 @@ class GraphCtrl extends MetricsPanelCtrl {
|
||||
* (but not wait for completion). This resolves
|
||||
* issue 11806.
|
||||
*/
|
||||
return this.annotationsSrv.datasourcePromises.then(r => {
|
||||
return this.annotationsSrv.datasourcePromises.then((r: any) => {
|
||||
return super.issueQueries(datasource);
|
||||
});
|
||||
}
|
||||
|
||||
zoomOut(evt) {
|
||||
zoomOut(evt: any) {
|
||||
this.publishAppEvent('zoom-out', 2);
|
||||
}
|
||||
|
||||
onDataSnapshotLoad(snapshotData) {
|
||||
onDataSnapshotLoad(snapshotData: any) {
|
||||
this.annotationsPromise = this.annotationsSrv.getAnnotations({
|
||||
dashboard: this.dashboard,
|
||||
panel: this.panel,
|
||||
@ -198,7 +201,7 @@ class GraphCtrl extends MetricsPanelCtrl {
|
||||
this.onDataReceived(snapshotData);
|
||||
}
|
||||
|
||||
onDataError(err) {
|
||||
onDataError(err: any) {
|
||||
this.seriesList = [];
|
||||
this.annotations = [];
|
||||
this.render([]);
|
||||
@ -242,7 +245,7 @@ class GraphCtrl extends MetricsPanelCtrl {
|
||||
}
|
||||
|
||||
this.annotationsPromise.then(
|
||||
result => {
|
||||
(result: { alertState: any; annotations: any }) => {
|
||||
this.loading = false;
|
||||
this.alertState = result.alertState;
|
||||
this.annotations = result.annotations;
|
||||
@ -269,24 +272,24 @@ class GraphCtrl extends MetricsPanelCtrl {
|
||||
}
|
||||
}
|
||||
|
||||
onColorChange = (series, color) => {
|
||||
onColorChange = (series: any, color: string) => {
|
||||
series.setColor(getColorFromHexRgbOrName(color, config.theme.type));
|
||||
this.panel.aliasColors[series.alias] = color;
|
||||
this.render();
|
||||
};
|
||||
|
||||
onToggleSeries = hiddenSeries => {
|
||||
onToggleSeries = (hiddenSeries: any) => {
|
||||
this.hiddenSeries = hiddenSeries;
|
||||
this.render();
|
||||
};
|
||||
|
||||
onToggleSort = (sortBy, sortDesc) => {
|
||||
onToggleSort = (sortBy: any, sortDesc: any) => {
|
||||
this.panel.legend.sort = sortBy;
|
||||
this.panel.legend.sortDesc = sortDesc;
|
||||
this.render();
|
||||
};
|
||||
|
||||
onToggleAxis = info => {
|
||||
onToggleAxis = (info: { alias: any; yaxis: any }) => {
|
||||
let override: any = _.find(this.panel.seriesOverrides, { alias: info.alias });
|
||||
if (!override) {
|
||||
override = { alias: info.alias };
|
||||
@ -303,11 +306,11 @@ class GraphCtrl extends MetricsPanelCtrl {
|
||||
});
|
||||
}
|
||||
|
||||
addSeriesOverride(override) {
|
||||
addSeriesOverride(override: any) {
|
||||
this.panel.seriesOverrides.push(override || {});
|
||||
}
|
||||
|
||||
removeSeriesOverride(override) {
|
||||
removeSeriesOverride(override: any) {
|
||||
this.panel.seriesOverrides = _.without(this.panel.seriesOverrides, override);
|
||||
this.render();
|
||||
}
|
||||
|
||||
@ -2,17 +2,17 @@ import _ from 'lodash';
|
||||
import coreModule from 'app/core/core_module';
|
||||
|
||||
/** @ngInject */
|
||||
export function SeriesOverridesCtrl($scope, $element, popoverSrv) {
|
||||
export function SeriesOverridesCtrl($scope: any, $element: JQuery, popoverSrv: any) {
|
||||
$scope.overrideMenu = [];
|
||||
$scope.currentOverrides = [];
|
||||
$scope.override = $scope.override || {};
|
||||
|
||||
$scope.addOverrideOption = (name, propertyName, values) => {
|
||||
$scope.addOverrideOption = (name: string, propertyName: string, values: any) => {
|
||||
const option = {
|
||||
text: name,
|
||||
propertyName: propertyName,
|
||||
index: $scope.overrideMenu.length,
|
||||
values: values,
|
||||
values,
|
||||
submenu: _.map(values, value => {
|
||||
return { text: String(value), value: value };
|
||||
}),
|
||||
@ -21,7 +21,7 @@ export function SeriesOverridesCtrl($scope, $element, popoverSrv) {
|
||||
$scope.overrideMenu.push(option);
|
||||
};
|
||||
|
||||
$scope.setOverride = (item, subItem) => {
|
||||
$scope.setOverride = (item: { propertyName: string }, subItem: { value: any }) => {
|
||||
// handle color overrides
|
||||
if (item.propertyName === 'color') {
|
||||
$scope.openColorSelector($scope.override['color']);
|
||||
@ -41,14 +41,14 @@ export function SeriesOverridesCtrl($scope, $element, popoverSrv) {
|
||||
$scope.ctrl.render();
|
||||
};
|
||||
|
||||
$scope.colorSelected = color => {
|
||||
$scope.colorSelected = (color: any) => {
|
||||
$scope.override['color'] = color;
|
||||
$scope.updateCurrentOverrides();
|
||||
$scope.ctrl.render();
|
||||
};
|
||||
|
||||
$scope.openColorSelector = color => {
|
||||
const fakeSeries = { color: color };
|
||||
$scope.openColorSelector = (color: any) => {
|
||||
const fakeSeries = { color };
|
||||
popoverSrv.show({
|
||||
element: $element.find('.dropdown')[0],
|
||||
position: 'top center',
|
||||
@ -67,7 +67,7 @@ export function SeriesOverridesCtrl($scope, $element, popoverSrv) {
|
||||
});
|
||||
};
|
||||
|
||||
$scope.removeOverride = option => {
|
||||
$scope.removeOverride = (option: { propertyName: string | number }) => {
|
||||
delete $scope.override[option.propertyName];
|
||||
$scope.updateCurrentOverrides();
|
||||
$scope.ctrl.refresh();
|
||||
|
||||
@ -29,7 +29,7 @@ import { graphDirective } from '../graph';
|
||||
import { dateTime } from '@grafana/ui/src/utils/moment_wrapper';
|
||||
|
||||
const ctx = {} as any;
|
||||
let ctrl;
|
||||
let ctrl: any;
|
||||
const scope = {
|
||||
ctrl: {},
|
||||
range: {
|
||||
@ -41,7 +41,7 @@ const scope = {
|
||||
let link;
|
||||
|
||||
describe('grafanaGraph', () => {
|
||||
const setupCtx = (beforeRender?) => {
|
||||
const setupCtx = (beforeRender?: any) => {
|
||||
config.bootData = {
|
||||
user: {
|
||||
lightTheme: false,
|
||||
@ -110,15 +110,19 @@ describe('grafanaGraph', () => {
|
||||
},
|
||||
{
|
||||
get: () => {},
|
||||
},
|
||||
{}
|
||||
} as any,
|
||||
{} as any
|
||||
);
|
||||
|
||||
// @ts-ignore
|
||||
$.plot = ctrl.plot = jest.fn();
|
||||
scope.ctrl = ctrl;
|
||||
|
||||
link = graphDirective({}, {}, {}, {}).link(scope, { width: () => 500, mouseleave: () => {}, bind: () => {} });
|
||||
link = graphDirective({} as any, {}, {} as any, {} as any).link(scope, {
|
||||
width: () => 500,
|
||||
mouseleave: () => {},
|
||||
bind: () => {},
|
||||
} as any);
|
||||
if (typeof beforeRender === 'function') {
|
||||
beforeRender();
|
||||
}
|
||||
@ -555,9 +559,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('should not contain values lower than min', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(200);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(300);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(200);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(300);
|
||||
});
|
||||
});
|
||||
|
||||
@ -576,9 +580,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('should not contain values lower than zero', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(300);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(300);
|
||||
});
|
||||
});
|
||||
|
||||
@ -597,9 +601,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('xaxis min should not affect the histogram', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(-100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(300);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(-100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(300);
|
||||
});
|
||||
});
|
||||
|
||||
@ -618,9 +622,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('xaxis min should not affect the histogram', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(-100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(300);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(-100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(300);
|
||||
});
|
||||
});
|
||||
|
||||
@ -639,9 +643,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('should not contain values greater than max', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(200);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(200);
|
||||
});
|
||||
});
|
||||
|
||||
@ -660,9 +664,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('should not contain values greater than zero', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(-100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(-100);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(-100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(-100);
|
||||
});
|
||||
});
|
||||
|
||||
@ -681,9 +685,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('xaxis max should not affect the histogram', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(-100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(300);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(-100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(300);
|
||||
});
|
||||
});
|
||||
|
||||
@ -702,9 +706,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('xaxis max should not should node affect the histogram', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(-100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(300);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(-100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(300);
|
||||
});
|
||||
});
|
||||
|
||||
@ -724,9 +728,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('should not contain values lower than min and greater than max', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(200);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(200);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(200);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(200);
|
||||
});
|
||||
});
|
||||
|
||||
@ -746,9 +750,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('xaxis max should be ignored otherwise the bucketSize is zero', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(300);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(300);
|
||||
});
|
||||
});
|
||||
|
||||
@ -768,9 +772,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('xaxis min and max should not affect the histogram', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(300);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(300);
|
||||
});
|
||||
});
|
||||
|
||||
@ -790,9 +794,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('xaxis min and max should not affect the histogram', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(300);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(300);
|
||||
});
|
||||
});
|
||||
|
||||
@ -812,9 +816,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('xaxis max should be ignored otherwise the bucketSize is negative', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(200);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(300);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(200);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(300);
|
||||
});
|
||||
});
|
||||
|
||||
@ -834,9 +838,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('xaxis min should be ignored otherwise the bucketSize is negative', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(300);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(300);
|
||||
});
|
||||
});
|
||||
|
||||
@ -855,9 +859,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('xaxis min should be ignored otherwise the bucketSize is zero', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(300);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(300);
|
||||
});
|
||||
});
|
||||
|
||||
@ -876,9 +880,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('xaxis min should not affect the histogram', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(300);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(300);
|
||||
});
|
||||
});
|
||||
|
||||
@ -897,9 +901,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('should calculate correct histogram', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(100);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(100);
|
||||
});
|
||||
});
|
||||
|
||||
@ -918,7 +922,7 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('should calculate empty histogram', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(nonZero.length).toBe(0);
|
||||
});
|
||||
});
|
||||
@ -938,9 +942,9 @@ describe('grafanaGraph', () => {
|
||||
});
|
||||
|
||||
it('should calculate correct histogram', () => {
|
||||
const nonZero = ctx.plotData[0].data.filter(t => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map(t => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map(t => t[0]))).toBe(300);
|
||||
const nonZero = ctx.plotData[0].data.filter((t: number[]) => t[1] > 0);
|
||||
expect(Math.min.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(100);
|
||||
expect(Math.max.apply(Math, nonZero.map((t: number[]) => t[0]))).toBe(300);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@ -33,7 +33,7 @@ describe('GraphCtrl', () => {
|
||||
const ctx = {} as any;
|
||||
|
||||
beforeEach(() => {
|
||||
ctx.ctrl = new GraphCtrl(scope, injector, {});
|
||||
ctx.ctrl = new GraphCtrl(scope, injector as any, {} as any);
|
||||
ctx.ctrl.events = {
|
||||
emit: () => {},
|
||||
};
|
||||
@ -86,7 +86,7 @@ describe('GraphCtrl', () => {
|
||||
|
||||
describe('datapointsCount given 2 series', () => {
|
||||
beforeEach(() => {
|
||||
const data = [{ target: 'test.cpu1', datapoints: [] }, { target: 'test.cpu2', datapoints: [] }];
|
||||
const data: any = [{ target: 'test.cpu1', datapoints: [] }, { target: 'test.cpu2', datapoints: [] }];
|
||||
ctx.ctrl.onDataReceived(data);
|
||||
});
|
||||
|
||||
|
||||
@ -13,7 +13,7 @@ const elem = $('<div></div>');
|
||||
const dashboard = {};
|
||||
const getSeriesFn = () => {};
|
||||
|
||||
function describeSharedTooltip(desc, fn) {
|
||||
function describeSharedTooltip(desc: string, fn: any) {
|
||||
const ctx: any = {};
|
||||
ctx.ctrl = scope.ctrl;
|
||||
ctx.ctrl.panel = {
|
||||
@ -24,13 +24,14 @@ function describeSharedTooltip(desc, fn) {
|
||||
stack: false,
|
||||
};
|
||||
|
||||
ctx.setup = setupFn => {
|
||||
ctx.setup = (setupFn: any) => {
|
||||
ctx.setupFn = setupFn;
|
||||
};
|
||||
|
||||
describe(desc, () => {
|
||||
beforeEach(() => {
|
||||
ctx.setupFn();
|
||||
// @ts-ignore
|
||||
const tooltip = new GraphTooltip(elem, dashboard, scope, getSeriesFn);
|
||||
ctx.results = tooltip.getMultiSeriesPlotHoverInfo(ctx.data, ctx.pos);
|
||||
});
|
||||
@ -40,6 +41,7 @@ function describeSharedTooltip(desc, fn) {
|
||||
}
|
||||
|
||||
describe('findHoverIndexFromData', () => {
|
||||
// @ts-ignore
|
||||
const tooltip = new GraphTooltip(elem, dashboard, scope, getSeriesFn);
|
||||
const series = {
|
||||
data: [[100, 0], [101, 0], [102, 0], [103, 0], [104, 0], [105, 0], [106, 0], [107, 0]],
|
||||
@ -66,7 +68,7 @@ describe('findHoverIndexFromData', () => {
|
||||
});
|
||||
});
|
||||
|
||||
describeSharedTooltip('steppedLine false, stack false', ctx => {
|
||||
describeSharedTooltip('steppedLine false, stack false', (ctx: any) => {
|
||||
ctx.setup(() => {
|
||||
ctx.data = [
|
||||
{ data: [[10, 15], [12, 20]], lines: {}, hideTooltip: false },
|
||||
@ -90,14 +92,14 @@ describeSharedTooltip('steppedLine false, stack false', ctx => {
|
||||
});
|
||||
});
|
||||
|
||||
describeSharedTooltip('one series is hidden', ctx => {
|
||||
describeSharedTooltip('one series is hidden', (ctx: any) => {
|
||||
ctx.setup(() => {
|
||||
ctx.data = [{ data: [[10, 15], [12, 20]] }, { data: [] }];
|
||||
ctx.pos = { x: 11 };
|
||||
});
|
||||
});
|
||||
|
||||
describeSharedTooltip('steppedLine false, stack true, individual false', ctx => {
|
||||
describeSharedTooltip('steppedLine false, stack true, individual false', (ctx: any) => {
|
||||
ctx.setup(() => {
|
||||
ctx.data = [
|
||||
{
|
||||
@ -130,7 +132,7 @@ describeSharedTooltip('steppedLine false, stack true, individual false', ctx =>
|
||||
});
|
||||
});
|
||||
|
||||
describeSharedTooltip('steppedLine false, stack true, individual false, series stack false', ctx => {
|
||||
describeSharedTooltip('steppedLine false, stack true, individual false, series stack false', (ctx: any) => {
|
||||
ctx.setup(() => {
|
||||
ctx.data = [
|
||||
{
|
||||
@ -163,7 +165,7 @@ describeSharedTooltip('steppedLine false, stack true, individual false, series s
|
||||
});
|
||||
});
|
||||
|
||||
describeSharedTooltip('steppedLine false, stack true, individual true', ctx => {
|
||||
describeSharedTooltip('steppedLine false, stack true, individual true', (ctx: any) => {
|
||||
ctx.setup(() => {
|
||||
ctx.data = [
|
||||
{
|
||||
|
||||
@ -2,7 +2,7 @@ import { convertValuesToHistogram, getSeriesValues } from '../histogram';
|
||||
|
||||
describe('Graph Histogam Converter', () => {
|
||||
describe('Values to histogram converter', () => {
|
||||
let values;
|
||||
let values: any;
|
||||
let bucketSize = 10;
|
||||
|
||||
beforeEach(() => {
|
||||
@ -27,7 +27,7 @@ describe('Graph Histogam Converter', () => {
|
||||
});
|
||||
|
||||
describe('Series to values converter', () => {
|
||||
let data;
|
||||
let data: any;
|
||||
|
||||
beforeEach(() => {
|
||||
data = [
|
||||
|
||||
@ -3,7 +3,7 @@ import { SeriesOverridesCtrl } from '../series_overrides_ctrl';
|
||||
|
||||
describe('SeriesOverridesCtrl', () => {
|
||||
const popoverSrv = {};
|
||||
let $scope;
|
||||
let $scope: any;
|
||||
|
||||
beforeEach(() => {
|
||||
$scope = {
|
||||
@ -14,7 +14,7 @@ describe('SeriesOverridesCtrl', () => {
|
||||
},
|
||||
render: jest.fn(() => {}),
|
||||
};
|
||||
SeriesOverridesCtrl($scope, {}, popoverSrv);
|
||||
SeriesOverridesCtrl($scope, {} as JQuery, popoverSrv);
|
||||
});
|
||||
|
||||
describe('When setting an override', () => {
|
||||
|
||||
@ -3,7 +3,7 @@ import TimeSeries from 'app/core/time_series2';
|
||||
import { ThresholdManager } from '../threshold_manager';
|
||||
|
||||
describe('ThresholdManager', () => {
|
||||
function plotOptionsScenario(desc, func) {
|
||||
function plotOptionsScenario(desc: string, func: any) {
|
||||
describe(desc, () => {
|
||||
const ctx: any = {
|
||||
panel: {
|
||||
@ -15,7 +15,7 @@ describe('ThresholdManager', () => {
|
||||
panelCtrl: {},
|
||||
};
|
||||
|
||||
ctx.setup = (thresholds, data) => {
|
||||
ctx.setup = (thresholds: any, data: any) => {
|
||||
ctx.panel.thresholds = thresholds;
|
||||
const manager = new ThresholdManager(ctx.panelCtrl);
|
||||
if (data !== undefined) {
|
||||
@ -30,7 +30,7 @@ describe('ThresholdManager', () => {
|
||||
}
|
||||
|
||||
describe('When creating plot markings', () => {
|
||||
plotOptionsScenario('for simple gt threshold', ctx => {
|
||||
plotOptionsScenario('for simple gt threshold', (ctx: any) => {
|
||||
ctx.setup([{ op: 'gt', value: 300, fill: true, line: true, colorMode: 'critical' }]);
|
||||
|
||||
it('should add fill for threshold with fill: true', () => {
|
||||
@ -49,7 +49,7 @@ describe('ThresholdManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for two gt thresholds', ctx => {
|
||||
plotOptionsScenario('for two gt thresholds', (ctx: any) => {
|
||||
ctx.setup([
|
||||
{ op: 'gt', value: 200, fill: true, colorMode: 'warning' },
|
||||
{ op: 'gt', value: 300, fill: true, colorMode: 'critical' },
|
||||
@ -68,7 +68,7 @@ describe('ThresholdManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for lt then gt threshold (inside)', ctx => {
|
||||
plotOptionsScenario('for lt then gt threshold (inside)', (ctx: any) => {
|
||||
ctx.setup([
|
||||
{ op: 'lt', value: 300, fill: true, colorMode: 'critical' },
|
||||
{ op: 'gt', value: 200, fill: true, colorMode: 'critical' },
|
||||
@ -87,7 +87,7 @@ describe('ThresholdManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for gt then lt threshold (outside)', ctx => {
|
||||
plotOptionsScenario('for gt then lt threshold (outside)', (ctx: any) => {
|
||||
ctx.setup([
|
||||
{ op: 'gt', value: 300, fill: true, colorMode: 'critical' },
|
||||
{ op: 'lt', value: 200, fill: true, colorMode: 'critical' },
|
||||
@ -106,7 +106,7 @@ describe('ThresholdManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for threshold on two Y axes', ctx => {
|
||||
plotOptionsScenario('for threshold on two Y axes', (ctx: any) => {
|
||||
const data = new Array(2);
|
||||
data[0] = new TimeSeries({
|
||||
datapoints: [[0, 1], [300, 2]],
|
||||
|
||||
@ -2,7 +2,7 @@ import { TimeRegionManager, colorModes } from '../time_region_manager';
|
||||
import { dateTime } from '@grafana/ui/src/utils/moment_wrapper';
|
||||
|
||||
describe('TimeRegionManager', () => {
|
||||
function plotOptionsScenario(desc, func) {
|
||||
function plotOptionsScenario(desc: string, func: any) {
|
||||
describe(desc, () => {
|
||||
const ctx: any = {
|
||||
panel: {
|
||||
@ -19,7 +19,7 @@ describe('TimeRegionManager', () => {
|
||||
},
|
||||
};
|
||||
|
||||
ctx.setup = (regions, from, to) => {
|
||||
ctx.setup = (regions: any, from: any, to: any) => {
|
||||
ctx.panel.timeRegions = regions;
|
||||
ctx.panelCtrl.range.from = from;
|
||||
ctx.panelCtrl.range.to = to;
|
||||
@ -46,7 +46,7 @@ describe('TimeRegionManager', () => {
|
||||
}
|
||||
|
||||
describe('When colors missing in config', () => {
|
||||
plotOptionsScenario('should not throw an error when fillColor is undefined', ctx => {
|
||||
plotOptionsScenario('should not throw an error when fillColor is undefined', (ctx: any) => {
|
||||
const regions = [
|
||||
{ fromDayOfWeek: 1, toDayOfWeek: 1, fill: true, line: true, lineColor: '#ffffff', colorMode: 'custom' },
|
||||
];
|
||||
@ -54,7 +54,7 @@ describe('TimeRegionManager', () => {
|
||||
const to = dateTime('2018-01-01T23:59:00+01:00');
|
||||
expect(() => ctx.setup(regions, from, to)).not.toThrow();
|
||||
});
|
||||
plotOptionsScenario('should not throw an error when lineColor is undefined', ctx => {
|
||||
plotOptionsScenario('should not throw an error when lineColor is undefined', (ctx: any) => {
|
||||
const regions = [
|
||||
{ fromDayOfWeek: 1, toDayOfWeek: 1, fill: true, fillColor: '#ffffff', line: true, colorMode: 'custom' },
|
||||
];
|
||||
@ -65,7 +65,7 @@ describe('TimeRegionManager', () => {
|
||||
});
|
||||
|
||||
describe('When creating plot markings using local time', () => {
|
||||
plotOptionsScenario('for day of week region', ctx => {
|
||||
plotOptionsScenario('for day of week region', (ctx: any) => {
|
||||
const regions = [{ fromDayOfWeek: 1, toDayOfWeek: 1, fill: true, line: true, colorMode: 'red' }];
|
||||
const from = dateTime('2018-01-01T00:00:00+01:00');
|
||||
const to = dateTime('2018-01-01T23:59:00+01:00');
|
||||
@ -97,7 +97,7 @@ describe('TimeRegionManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for time from region', ctx => {
|
||||
plotOptionsScenario('for time from region', (ctx: any) => {
|
||||
const regions = [{ from: '05:00', fill: true, colorMode: 'red' }];
|
||||
const from = dateTime('2018-01-01T00:00+01:00');
|
||||
const to = dateTime('2018-01-03T23:59+01:00');
|
||||
@ -124,7 +124,7 @@ describe('TimeRegionManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for time to region', ctx => {
|
||||
plotOptionsScenario('for time to region', (ctx: any) => {
|
||||
const regions = [{ to: '05:00', fill: true, colorMode: 'red' }];
|
||||
const from = dateTime('2018-02-01T00:00+01:00');
|
||||
const to = dateTime('2018-02-03T23:59+01:00');
|
||||
@ -151,7 +151,7 @@ describe('TimeRegionManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for time from/to region', ctx => {
|
||||
plotOptionsScenario('for time from/to region', (ctx: any) => {
|
||||
const regions = [{ from: '00:00', to: '05:00', fill: true, colorMode: 'red' }];
|
||||
const from = dateTime('2018-12-01T00:00+01:00');
|
||||
const to = dateTime('2018-12-03T23:59+01:00');
|
||||
@ -178,7 +178,7 @@ describe('TimeRegionManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for time from/to region crossing midnight', ctx => {
|
||||
plotOptionsScenario('for time from/to region crossing midnight', (ctx: any) => {
|
||||
const regions = [{ from: '22:00', to: '00:30', fill: true, colorMode: 'red' }];
|
||||
const from = dateTime('2018-12-01T12:00+01:00');
|
||||
const to = dateTime('2018-12-04T08:00+01:00');
|
||||
@ -205,7 +205,7 @@ describe('TimeRegionManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for day of week from/to region', ctx => {
|
||||
plotOptionsScenario('for day of week from/to region', (ctx: any) => {
|
||||
const regions = [{ fromDayOfWeek: 7, toDayOfWeek: 7, fill: true, colorMode: 'red' }];
|
||||
const from = dateTime('2018-01-01T18:45:05+01:00');
|
||||
const to = dateTime('2018-01-22T08:27:00+01:00');
|
||||
@ -232,7 +232,7 @@ describe('TimeRegionManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for day of week from region', ctx => {
|
||||
plotOptionsScenario('for day of week from region', (ctx: any) => {
|
||||
const regions = [{ fromDayOfWeek: 7, fill: true, colorMode: 'red' }];
|
||||
const from = dateTime('2018-01-01T18:45:05+01:00');
|
||||
const to = dateTime('2018-01-22T08:27:00+01:00');
|
||||
@ -259,7 +259,7 @@ describe('TimeRegionManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for day of week to region', ctx => {
|
||||
plotOptionsScenario('for day of week to region', (ctx: any) => {
|
||||
const regions = [{ toDayOfWeek: 7, fill: true, colorMode: 'red' }];
|
||||
const from = dateTime('2018-01-01T18:45:05+01:00');
|
||||
const to = dateTime('2018-01-22T08:27:00+01:00');
|
||||
@ -286,7 +286,7 @@ describe('TimeRegionManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for day of week from/to time region', ctx => {
|
||||
plotOptionsScenario('for day of week from/to time region', (ctx: any) => {
|
||||
const regions = [{ fromDayOfWeek: 7, from: '23:00', toDayOfWeek: 1, to: '01:40', fill: true, colorMode: 'red' }];
|
||||
const from = dateTime('2018-12-07T12:51:19+01:00');
|
||||
const to = dateTime('2018-12-10T13:51:29+01:00');
|
||||
@ -304,7 +304,7 @@ describe('TimeRegionManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for day of week from/to time region', ctx => {
|
||||
plotOptionsScenario('for day of week from/to time region', (ctx: any) => {
|
||||
const regions = [{ fromDayOfWeek: 6, from: '03:00', toDayOfWeek: 7, to: '02:00', fill: true, colorMode: 'red' }];
|
||||
const from = dateTime('2018-12-07T12:51:19+01:00');
|
||||
const to = dateTime('2018-12-10T13:51:29+01:00');
|
||||
@ -322,7 +322,7 @@ describe('TimeRegionManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for day of week from/to time region with daylight saving time', ctx => {
|
||||
plotOptionsScenario('for day of week from/to time region with daylight saving time', (ctx: any) => {
|
||||
const regions = [{ fromDayOfWeek: 7, from: '20:00', toDayOfWeek: 7, to: '23:00', fill: true, colorMode: 'red' }];
|
||||
const from = dateTime('2018-03-17T06:00:00+01:00');
|
||||
const to = dateTime('2018-04-03T06:00:00+02:00');
|
||||
@ -346,7 +346,7 @@ describe('TimeRegionManager', () => {
|
||||
});
|
||||
});
|
||||
|
||||
plotOptionsScenario('for each day of week with winter time', ctx => {
|
||||
plotOptionsScenario('for each day of week with winter time', (ctx: any) => {
|
||||
const regions = [{ fromDayOfWeek: 7, toDayOfWeek: 7, fill: true, colorMode: 'red' }];
|
||||
const from = dateTime('2018-10-20T14:50:11+02:00');
|
||||
const to = dateTime('2018-11-07T12:56:23+01:00');
|
||||
|
||||
@ -7,7 +7,7 @@ export class ThresholdFormCtrl {
|
||||
disabled: boolean;
|
||||
|
||||
/** @ngInject */
|
||||
constructor($scope) {
|
||||
constructor($scope: any) {
|
||||
this.panel = this.panelCtrl.panel;
|
||||
|
||||
if (this.panel.alert) {
|
||||
@ -35,7 +35,7 @@ export class ThresholdFormCtrl {
|
||||
this.panelCtrl.render();
|
||||
}
|
||||
|
||||
removeThreshold(index) {
|
||||
removeThreshold(index: number) {
|
||||
this.panel.thresholds.splice(index, 1);
|
||||
this.panelCtrl.render();
|
||||
}
|
||||
@ -44,21 +44,21 @@ export class ThresholdFormCtrl {
|
||||
this.panelCtrl.render();
|
||||
}
|
||||
|
||||
onFillColorChange(index) {
|
||||
return newColor => {
|
||||
onFillColorChange(index: number) {
|
||||
return (newColor: string) => {
|
||||
this.panel.thresholds[index].fillColor = newColor;
|
||||
this.render();
|
||||
};
|
||||
}
|
||||
|
||||
onLineColorChange(index) {
|
||||
return newColor => {
|
||||
onLineColorChange(index: number) {
|
||||
return (newColor: string) => {
|
||||
this.panel.thresholds[index].lineColor = newColor;
|
||||
this.render();
|
||||
};
|
||||
}
|
||||
|
||||
onThresholdTypeChange(index) {
|
||||
onThresholdTypeChange(index: number) {
|
||||
// Because of the ng-model binding, threshold's color mode is already set here
|
||||
if (this.panel.thresholds[index].colorMode === 'custom') {
|
||||
this.panel.thresholds[index].fillColor = tinycolor(config.theme.colors.blueBase)
|
||||
|
||||
@ -27,7 +27,7 @@ describe('HeatmapCtrl', () => {
|
||||
|
||||
describe('when time series are outside range', () => {
|
||||
beforeEach(() => {
|
||||
const data = [
|
||||
const data: any = [
|
||||
{
|
||||
target: 'test.cpu1',
|
||||
datapoints: [[45, 1234567890], [60, 1234567899]],
|
||||
@ -52,7 +52,7 @@ describe('HeatmapCtrl', () => {
|
||||
to: dateTime().valueOf(),
|
||||
};
|
||||
|
||||
const data = [
|
||||
const data: any = [
|
||||
{
|
||||
target: 'test.cpu1',
|
||||
datapoints: [[45, range.from + 1000], [60, range.from + 10000]],
|
||||
@ -70,7 +70,7 @@ describe('HeatmapCtrl', () => {
|
||||
|
||||
describe('datapointsCount given 2 series', () => {
|
||||
beforeEach(() => {
|
||||
const data = [{ target: 'test.cpu1', datapoints: [] }, { target: 'test.cpu2', datapoints: [] }];
|
||||
const data: any = [{ target: 'test.cpu1', datapoints: [] }, { target: 'test.cpu2', datapoints: [] }];
|
||||
ctx.ctrl.onDataReceived(data);
|
||||
});
|
||||
|
||||
|
||||
@ -17,7 +17,7 @@ class TablePanelCtrl extends MetricsPanelCtrl {
|
||||
table: any;
|
||||
renderer: any;
|
||||
|
||||
panelDefaults = {
|
||||
panelDefaults: any = {
|
||||
targets: [{}],
|
||||
transform: 'timeseries_to_columns',
|
||||
pageSize: null,
|
||||
@ -180,7 +180,7 @@ class TablePanelCtrl extends MetricsPanelCtrl {
|
||||
}
|
||||
|
||||
link(scope: any, elem: JQuery, attrs: any, ctrl: TablePanelCtrl) {
|
||||
let data;
|
||||
let data: any;
|
||||
const panel = ctrl.panel;
|
||||
let pageCount = 0;
|
||||
|
||||
@ -194,19 +194,19 @@ class TablePanelCtrl extends MetricsPanelCtrl {
|
||||
return panelHeight - 31 + 'px';
|
||||
}
|
||||
|
||||
function appendTableRows(tbodyElem) {
|
||||
function appendTableRows(tbodyElem: JQuery) {
|
||||
ctrl.renderer.setTable(data);
|
||||
tbodyElem.empty();
|
||||
tbodyElem.html(ctrl.renderer.render(ctrl.pageIndex));
|
||||
}
|
||||
|
||||
function switchPage(e) {
|
||||
function switchPage(e: any) {
|
||||
const el = $(e.currentTarget);
|
||||
ctrl.pageIndex = parseInt(el.text(), 10) - 1;
|
||||
renderPanel();
|
||||
}
|
||||
|
||||
function appendPaginationControls(footerElem) {
|
||||
function appendPaginationControls(footerElem: JQuery) {
|
||||
footerElem.empty();
|
||||
|
||||
const pageSize = panel.pageSize || 100;
|
||||
@ -251,7 +251,7 @@ class TablePanelCtrl extends MetricsPanelCtrl {
|
||||
selector: '[data-link-tooltip]',
|
||||
});
|
||||
|
||||
function addFilterClicked(e) {
|
||||
function addFilterClicked(e: any) {
|
||||
const filterData = $(e.currentTarget).data();
|
||||
const options = {
|
||||
datasource: panel.datasource,
|
||||
@ -272,7 +272,7 @@ class TablePanelCtrl extends MetricsPanelCtrl {
|
||||
unbindDestroy();
|
||||
});
|
||||
|
||||
ctrl.events.on('render', renderData => {
|
||||
ctrl.events.on('render', (renderData: any) => {
|
||||
data = renderData || data;
|
||||
if (data) {
|
||||
renderPanel();
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
// Libraries
|
||||
import _ from 'lodash';
|
||||
import $ from 'jquery';
|
||||
// @ts-ignore
|
||||
import Drop from 'tether-drop';
|
||||
|
||||
// Utils and servies
|
||||
|
||||
@ -1,10 +1,12 @@
|
||||
import { route } from 'angular';
|
||||
|
||||
interface RegisterRoutesHandler {
|
||||
($routeProvider): any;
|
||||
($routeProvider: route.IRouteProvider): any;
|
||||
}
|
||||
|
||||
const handlers: RegisterRoutesHandler[] = [];
|
||||
|
||||
export function applyRouteRegistrationHandlers($routeProvider) {
|
||||
export function applyRouteRegistrationHandlers($routeProvider: route.IRouteProvider) {
|
||||
for (const handler of handlers) {
|
||||
handler($routeProvider);
|
||||
}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
export let store;
|
||||
export let store: any;
|
||||
|
||||
export function setStore(newStore) {
|
||||
export function setStore(newStore: any) {
|
||||
store = newStore;
|
||||
}
|
||||
|
||||
@ -49,6 +49,7 @@ export class TestPage<T> implements TestPageType<T> {
|
||||
}
|
||||
|
||||
Object.keys(this.pageObjects).forEach(key => {
|
||||
// @ts-ignore
|
||||
const pageObject: PageObject = this.pageObjects[key];
|
||||
pageObject.init(page);
|
||||
});
|
||||
|
||||
@ -106,6 +106,7 @@ export const epicTester = (
|
||||
};
|
||||
|
||||
const getDependencyMock = (dependency: string, method?: string) => {
|
||||
// @ts-ignore
|
||||
const dep = theDependencies[dependency];
|
||||
let mock = null;
|
||||
if (dep instanceof Function) {
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
echo -e "Collecting code stats (typescript errors & more)"
|
||||
|
||||
|
||||
ERROR_COUNT_LIMIT=4400
|
||||
ERROR_COUNT_LIMIT=3789
|
||||
DIRECTIVES_LIMIT=172
|
||||
CONTROLLERS_LIMIT=139
|
||||
|
||||
|
||||
@ -2376,6 +2376,11 @@
|
||||
version "1.4.1"
|
||||
resolved "https://registry.yarnpkg.com/@types/tinycolor2/-/tinycolor2-1.4.1.tgz#2f5670c9d1d6e558897a810ed284b44918fc1253"
|
||||
|
||||
"@types/tinycolor2@1.4.2":
|
||||
version "1.4.2"
|
||||
resolved "https://registry.yarnpkg.com/@types/tinycolor2/-/tinycolor2-1.4.2.tgz#721ca5c5d1a2988b4a886e35c2ffc5735b6afbdf"
|
||||
integrity sha512-PeHg/AtdW6aaIO2a+98Xj7rWY4KC1E6yOy7AFknJQ7VXUGNrMlyxDFxJo7HqLtjQms/ZhhQX52mLVW/EX3JGOw==
|
||||
|
||||
"@types/unist@*", "@types/unist@^2.0.0", "@types/unist@^2.0.2":
|
||||
version "2.0.3"
|
||||
resolved "https://registry.yarnpkg.com/@types/unist/-/unist-2.0.3.tgz#9c088679876f374eb5983f150d4787aa6fb32d7e"
|
||||
|
||||
Loading…
Reference in New Issue
Block a user