specify the type returned for most of the function that is missing it

Signed-off-by: Augustin Husson <husson.augustin@gmail.com>
This commit is contained in:
Augustin Husson 2021-09-02 11:12:25 +02:00
parent 27bd8fef40
commit 5d29b7b6f7
9 changed files with 42 additions and 42 deletions

View file

@ -2,7 +2,7 @@ import React from 'react';
const PathPrefixContext = React.createContext(''); const PathPrefixContext = React.createContext('');
function usePathPrefix() { function usePathPrefix(): string {
return React.useContext(PathPrefixContext); return React.useContext(PathPrefixContext);
} }

View file

@ -17,6 +17,6 @@ export const ThemeContext = React.createContext<ThemeCtx>({
setTheme: (s: themeSetting) => {}, setTheme: (s: themeSetting) => {},
}); });
export const useTheme = () => { export const useTheme = (): ThemeCtx => {
return React.useContext(ThemeContext); return React.useContext(ThemeContext);
}; };

View file

@ -1,7 +1,7 @@
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
// A hook to determine whether a CSS media query finds any matches. // A hook to determine whether a CSS media query finds any matches.
const useMedia = (query: string) => { const useMedia = (query: string): boolean => {
const mediaQuery = window.matchMedia(query); const mediaQuery = window.matchMedia(query);
const [matches, setMatches] = useState(mediaQuery.matches); const [matches, setMatches] = useState(mediaQuery.matches);

View file

@ -37,34 +37,34 @@ class ExpressionInput extends Component<ExpressionInputProps, ExpressionInputSta
}; };
} }
componentDidMount() { componentDidMount(): void {
this.setHeight(); this.setHeight();
} }
setHeight = () => { setHeight = (): void => {
const { offsetHeight, clientHeight, scrollHeight } = this.exprInputRef.current!; const { offsetHeight, clientHeight, scrollHeight } = this.exprInputRef.current!;
const offset = offsetHeight - clientHeight; // Needed in order for the height to be more accurate. const offset = offsetHeight - clientHeight; // Needed in order for the height to be more accurate.
this.setState({ height: scrollHeight + offset }); this.setState({ height: scrollHeight + offset });
}; };
handleInput = () => { handleInput = (): void => {
this.setValue(this.exprInputRef.current!.value); this.setValue(this.exprInputRef.current!.value);
}; };
setValue = (value: string) => { setValue = (value: string): void => {
const { onExpressionChange } = this.props; const { onExpressionChange } = this.props;
onExpressionChange(value); onExpressionChange(value);
this.setState({ height: 'auto' }, this.setHeight); this.setState({ height: 'auto' }, this.setHeight);
}; };
componentDidUpdate(prevProps: ExpressionInputProps) { componentDidUpdate(prevProps: ExpressionInputProps): void {
const { value } = this.props; const { value } = this.props;
if (value !== prevProps.value) { if (value !== prevProps.value) {
this.setValue(value); this.setValue(value);
} }
} }
handleKeyPress = (event: React.KeyboardEvent<HTMLInputElement>) => { handleKeyPress = (event: React.KeyboardEvent<HTMLInputElement>): void => {
const { executeQuery } = this.props; const { executeQuery } = this.props;
if (event.key === 'Enter' && !event.shiftKey) { if (event.key === 'Enter' && !event.shiftKey) {
executeQuery(); executeQuery();
@ -72,7 +72,7 @@ class ExpressionInput extends Component<ExpressionInputProps, ExpressionInputSta
} }
}; };
getSearchMatches = (input: string, expressions: string[]) => { getSearchMatches = (input: string, expressions: string[]): FuzzyResult[] => {
return fuz.filter(input.replace(/ /g, ''), expressions); return fuz.filter(input.replace(/ /g, ''), expressions);
}; };
@ -84,9 +84,9 @@ class ExpressionInput extends Component<ExpressionInputProps, ExpressionInputSta
}; };
let index = 0; let index = 0;
const sections = const sections =
inputValue!.length && this.props.enableAutocomplete inputValue?.length && this.props.enableAutocomplete
? Object.entries(autocompleteSections).reduce((acc, [title, items]) => { ? Object.entries(autocompleteSections).reduce((acc, [title, items]) => {
const matches = this.getSearchMatches(inputValue!, items); const matches = this.getSearchMatches(inputValue, items);
return !matches.length return !matches.length
? acc ? acc
: [ : [
@ -131,19 +131,19 @@ class ExpressionInput extends Component<ExpressionInputProps, ExpressionInputSta
); );
}; };
openMetricsExplorer = () => { openMetricsExplorer = (): void => {
this.setState({ this.setState({
showMetricsExplorer: true, showMetricsExplorer: true,
}); });
}; };
updateShowMetricsExplorer = (show: boolean) => { updateShowMetricsExplorer = (show: boolean): void => {
this.setState({ this.setState({
showMetricsExplorer: show, showMetricsExplorer: show,
}); });
}; };
insertAtCursor = (value: string) => { insertAtCursor = (value: string): void => {
if (!this.exprInputRef.current) return; if (!this.exprInputRef.current) return;
const startPosition = this.exprInputRef.current.selectionStart; const startPosition = this.exprInputRef.current.selectionStart;

View file

@ -102,7 +102,7 @@ class Graph extends PureComponent<GraphProps, GraphState> {
} }
} }
componentDidMount() { componentDidMount(): void {
this.plot(); this.plot();
$(`.graph-${this.props.id}`).bind('plotclick', (event, pos, item) => { $(`.graph-${this.props.id}`).bind('plotclick', (event, pos, item) => {
@ -130,7 +130,7 @@ class Graph extends PureComponent<GraphProps, GraphState> {
}); });
} }
componentWillUnmount() { componentWillUnmount(): void {
this.destroyPlot(); this.destroyPlot();
} }
@ -143,7 +143,7 @@ class Graph extends PureComponent<GraphProps, GraphState> {
this.$chart = $.plot($(this.chartRef.current), data, getOptions(this.props.stacked, this.props.useLocalTime)); this.$chart = $.plot($(this.chartRef.current), data, getOptions(this.props.stacked, this.props.useLocalTime));
}; };
destroyPlot = () => { destroyPlot = (): void => {
if (isPresent(this.$chart)) { if (isPresent(this.$chart)) {
this.$chart.destroy(); this.$chart.destroy();
} }
@ -151,14 +151,14 @@ class Graph extends PureComponent<GraphProps, GraphState> {
plotSetAndDraw( plotSetAndDraw(
data: (GraphSeries | GraphExemplar)[] = [...this.state.chartData.series, ...this.state.chartData.exemplars] data: (GraphSeries | GraphExemplar)[] = [...this.state.chartData.series, ...this.state.chartData.exemplars]
) { ): void {
if (isPresent(this.$chart)) { if (isPresent(this.$chart)) {
this.$chart.setData(data); this.$chart.setData(data);
this.$chart.draw(); this.$chart.draw();
} }
} }
handleSeriesSelect = (selected: number[], selectedIndex: number) => { handleSeriesSelect = (selected: number[], selectedIndex: number): void => {
const { chartData } = this.state; const { chartData } = this.state;
this.plot( this.plot(
this.selectedSeriesIndexes.length === 1 && this.selectedSeriesIndexes.includes(selectedIndex) this.selectedSeriesIndexes.length === 1 && this.selectedSeriesIndexes.includes(selectedIndex)
@ -181,7 +181,7 @@ class Graph extends PureComponent<GraphProps, GraphState> {
this.selectedSeriesIndexes = selected; this.selectedSeriesIndexes = selected;
}; };
handleSeriesHover = (index: number) => () => { handleSeriesHover = (index: number) => (): void => {
if (this.rafID) { if (this.rafID) {
cancelAnimationFrame(this.rafID); cancelAnimationFrame(this.rafID);
} }
@ -193,12 +193,12 @@ class Graph extends PureComponent<GraphProps, GraphState> {
}); });
}; };
handleLegendMouseOut = () => { handleLegendMouseOut = (): void => {
cancelAnimationFrame(this.rafID); cancelAnimationFrame(this.rafID);
this.plotSetAndDraw(); this.plotSetAndDraw();
}; };
handleResize = () => { handleResize = (): void => {
if (isPresent(this.$chart)) { if (isPresent(this.$chart)) {
this.plot(this.$chart.getData() as (GraphSeries | GraphExemplar)[]); this.plot(this.$chart.getData() as (GraphSeries | GraphExemplar)[]);
} }

View file

@ -84,7 +84,7 @@ class Panel extends Component<PanelProps, PanelState> {
}; };
} }
componentDidUpdate({ options: prevOpts }: PanelProps) { componentDidUpdate({ options: prevOpts }: PanelProps): void {
const { endTime, range, resolution, showExemplars, type } = this.props.options; const { endTime, range, resolution, showExemplars, type } = this.props.options;
if ( if (
prevOpts.endTime !== endTime || prevOpts.endTime !== endTime ||
@ -97,7 +97,7 @@ class Panel extends Component<PanelProps, PanelState> {
} }
} }
componentDidMount() { componentDidMount(): void {
this.executeQuery(); this.executeQuery();
} }
@ -230,15 +230,15 @@ class Panel extends Component<PanelProps, PanelState> {
return this.props.options.endTime; return this.props.options.endTime;
}; };
handleChangeEndTime = (endTime: number | null) => { handleChangeEndTime = (endTime: number | null): void => {
this.setOptions({ endTime: endTime }); this.setOptions({ endTime: endTime });
}; };
handleChangeResolution = (resolution: number | null) => { handleChangeResolution = (resolution: number | null): void => {
this.setOptions({ resolution: resolution }); this.setOptions({ resolution: resolution });
}; };
handleChangeType = (type: PanelType) => { handleChangeType = (type: PanelType): void => {
if (this.props.options.type === type) { if (this.props.options.type === type) {
return; return;
} }
@ -247,15 +247,15 @@ class Panel extends Component<PanelProps, PanelState> {
this.setOptions({ type: type }); this.setOptions({ type: type });
}; };
handleChangeStacking = (stacked: boolean) => { handleChangeStacking = (stacked: boolean): void => {
this.setOptions({ stacked: stacked }); this.setOptions({ stacked: stacked });
}; };
handleChangeShowExemplars = (show: boolean) => { handleChangeShowExemplars = (show: boolean): void => {
this.setOptions({ showExemplars: show }); this.setOptions({ showExemplars: show });
}; };
handleTimeRangeSelection = (startTime: number, endTime: number) => { handleTimeRangeSelection = (startTime: number, endTime: number): void => {
this.setOptions({ range: endTime - startTime, endTime: endTime }); this.setOptions({ range: endTime - startTime, endTime: endTime });
}; };

View file

@ -39,7 +39,7 @@ class TimeInput extends Component<TimeInputProps> {
return this.props.time || moment().valueOf(); return this.props.time || moment().valueOf();
}; };
calcShiftRange = () => this.props.range / 2; calcShiftRange = (): number => this.props.range / 2;
increaseTime = (): void => { increaseTime = (): void => {
const time = this.getBaseTime() + this.calcShiftRange(); const time = this.getBaseTime() + this.calcShiftRange();
@ -59,7 +59,7 @@ class TimeInput extends Component<TimeInputProps> {
return this.props.useLocalTime ? moment.tz.guess() : 'UTC'; return this.props.useLocalTime ? moment.tz.guess() : 'UTC';
}; };
componentDidMount() { componentDidMount(): void {
this.$time = $(this.timeInputRef.current!); this.$time = $(this.timeInputRef.current!);
this.$time.datetimepicker({ this.$time.datetimepicker({
@ -87,11 +87,11 @@ class TimeInput extends Component<TimeInputProps> {
}); });
} }
componentWillUnmount() { componentWillUnmount(): void {
this.$time.datetimepicker('destroy'); this.$time.datetimepicker('destroy');
} }
componentDidUpdate(prevProps: TimeInputProps) { componentDidUpdate(prevProps: TimeInputProps): void {
const { time, useLocalTime } = this.props; const { time, useLocalTime } = this.props;
if (prevProps.time !== time) { if (prevProps.time !== time) {
this.$time.datetimepicker('date', time ? moment(time) : null); this.$time.datetimepicker('date', time ? moment(time) : null);

View file

@ -48,7 +48,7 @@ export const processSummary = (activeTargets: Target[], droppedTargets: DroppedT
return targets; return targets;
}; };
export const processTargets = (activeTargets: Target[], droppedTargets: DroppedTarget[]) => { export const processTargets = (activeTargets: Target[], droppedTargets: DroppedTarget[]): Record<string, TargetLabels[]> => {
const labels: Record<string, TargetLabels[]> = {}; const labels: Record<string, TargetLabels[]> = {};
for (const target of activeTargets) { for (const target of activeTargets) {

View file

@ -3,11 +3,11 @@ import moment from 'moment-timezone';
import { PanelOptions, PanelType, PanelDefaultOptions } from '../pages/graph/Panel'; import { PanelOptions, PanelType, PanelDefaultOptions } from '../pages/graph/Panel';
import { PanelMeta } from '../pages/graph/PanelList'; import { PanelMeta } from '../pages/graph/PanelList';
export const generateID = () => { export const generateID = (): string => {
return `_${Math.random().toString(36).substr(2, 9)}`; return `_${Math.random().toString(36).substr(2, 9)}`;
}; };
export const byEmptyString = (p: string) => p.length > 0; export const byEmptyString = (p: string): boolean => p.length > 0;
export const isPresent = <T>(obj: T): obj is NonNullable<T> => obj !== null && obj !== undefined; export const isPresent = <T>(obj: T): obj is NonNullable<T> => obj !== null && obj !== undefined;
@ -26,7 +26,7 @@ export const escapeHTML = (str: string): string => {
}); });
}; };
export const metricToSeriesName = (labels: { [key: string]: string }) => { export const metricToSeriesName = (labels: { [key: string]: string }): string => {
if (labels === null) { if (labels === null) {
return 'scalar'; return 'scalar';
} }
@ -237,11 +237,11 @@ export const toQueryString = ({ key, options }: PanelMeta) => {
return urlParams.filter(byEmptyString).join('&'); return urlParams.filter(byEmptyString).join('&');
}; };
export const encodePanelOptionsToQueryString = (panels: PanelMeta[]) => { export const encodePanelOptionsToQueryString = (panels: PanelMeta[]): string => {
return `?${panels.map(toQueryString).join('&')}`; return `?${panels.map(toQueryString).join('&')}`;
}; };
export const createExpressionLink = (expr: string) => { export const createExpressionLink = (expr: string): string => {
return `../graph?g0.expr=${encodeURIComponent(expr)}&g0.tab=1&g0.stacked=0&g0.show_exemplars=0.g0.range_input=1h.`; return `../graph?g0.expr=${encodeURIComponent(expr)}&g0.tab=1&g0.stacked=0&g0.show_exemplars=0.g0.range_input=1h.`;
}; };
export const mapObjEntries = <T, key extends keyof T, Z>( export const mapObjEntries = <T, key extends keyof T, Z>(
@ -256,7 +256,7 @@ export const callAll =
fns.filter(Boolean).forEach((fn) => fn.apply(null, args)); fns.filter(Boolean).forEach((fn) => fn.apply(null, args));
}; };
export const parsePrometheusFloat = (value: string) => { export const parsePrometheusFloat = (value: string): number | string => {
if (isNaN(Number(value))) { if (isNaN(Number(value))) {
return value; return value;
} else { } else {