IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Chore: Fix more strict typescript errors (#35514)

Browse Source
This commit is contained in:
kay delaney
2021-06-14 15:13:48 +01:00
committed by GitHub
parent 6ee2f1fe3e
commit 0f81703c35
18 changed files with 128 additions and 161 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
public/app/features/query/components/QueryEditorRow.tsx
View File

@@ -29,38 +29,38 @@ import { DashboardModel } from '../../dashboard/state/DashboardModel';
import { selectors } from '@grafana/e2e-selectors';
import { PanelModel } from 'app/features/dashboard/state';
interface Props {
interface Props<TQuery extends DataQuery> {
data: PanelData;
query: DataQuery;
queries: DataQuery[];
query: TQuery;
queries: TQuery[];
id: string;
index: number;
dataSource: DataSourceInstanceSettings;
onChangeDataSource?: (dsSettings: DataSourceInstanceSettings) => void;
renderHeaderExtras?: () => ReactNode;
onAddQuery: (query: DataQuery) => void;
onRemoveQuery: (query: DataQuery) => void;
onChange: (query: DataQuery) => void;
onAddQuery: (query: TQuery) => void;
onRemoveQuery: (query: TQuery) => void;
onChange: (query: TQuery) => void;
onRunQuery: () => void;
visualization?: ReactNode;
hideDisableQuery?: boolean;
}
interface State {
interface State<TQuery extends DataQuery> {
loadedDataSourceIdentifier?: string | null;
datasource: DataSourceApi | null;
datasource: DataSourceApi<TQuery> | null;
hasTextEditMode: boolean;
data?: PanelData;
isOpen?: boolean;
showingHelp: boolean;
}
export class QueryEditorRow extends PureComponent<Props, State> {
export class QueryEditorRow<TQuery extends DataQuery> extends PureComponent<Props<TQuery>, State<TQuery>> {
element: HTMLElement | null = null;
angularScope: AngularQueryComponentScope | null = null;
angularScope: AngularQueryComponentScope<TQuery> | null = null;
angularQueryEditor: AngularComponent | null = null;
state: State = {
state: State<TQuery> = {
datasource: null,
hasTextEditMode: false,
data: undefined,
@@ -78,7 +78,7 @@ export class QueryEditorRow extends PureComponent<Props, State> {
}
}
getAngularQueryComponentScope(): AngularQueryComponentScope {
getAngularQueryComponentScope(): AngularQueryComponentScope<TQuery> {
const { query, queries } = this.props;
const { datasource } = this.state;
const panel = new PanelModel({ targets: queries });
@@ -129,13 +129,13 @@ export class QueryEditorRow extends PureComponent<Props, State> {
}
this.setState({
datasource,
datasource: (datasource as unknown) as DataSourceApi<TQuery>,
loadedDataSourceIdentifier: dataSourceIdentifier,
hasTextEditMode: has(datasource, 'components.QueryCtrl.prototype.toggleEditorMode'),
});
}
componentDidUpdate(prevProps: Props) {
componentDidUpdate(prevProps: Props<TQuery>) {
const { datasource, loadedDataSourceIdentifier } = this.state;
const { data, query } = this.props;
@@ -252,7 +252,7 @@ export class QueryEditorRow extends PureComponent<Props, State> {
}));
};
onClickExample = (query: DataQuery) => {
onClickExample = (query: TQuery) => {
this.props.onChange({
...query,
refId: this.props.query.refId,
@@ -371,7 +371,11 @@ export class QueryEditorRow extends PureComponent<Props, State> {
}
}
function notifyAngularQueryEditorsOfData(scope: AngularQueryComponentScope, data: PanelData, editor: AngularComponent) {
function notifyAngularQueryEditorsOfData<TQuery extends DataQuery>(
scope: AngularQueryComponentScope<TQuery>,
data: PanelData,
editor: AngularComponent
) {
if (data.state === LoadingState.Done) {
const legacy = data.series.map((v) => toLegacyResponseData(v));
scope.events.emit(PanelEvents.dataReceived, legacy);
@@ -384,14 +388,14 @@ function notifyAngularQueryEditorsOfData(scope: AngularQueryComponentScope, data
setTimeout(editor.digest);
}
export interface AngularQueryComponentScope {
target: DataQuery;
export interface AngularQueryComponentScope<TQuery extends DataQuery> {
target: TQuery;
panel: PanelModel;
dashboard: DashboardModel;
events: EventBusExtended;
refresh: () => void;
render: () => void;
datasource: DataSourceApi | null;
datasource: DataSourceApi<TQuery> | null;
toggleEditorMode?: () => void;
getCollapsedText?: () => string;
range: TimeRange;

15
public/app/features/query/components/QueryEditorRowHeader.tsx
View File

@@ -5,19 +5,19 @@ import { DataSourcePicker } from '@grafana/runtime';
import { Icon, Input, FieldValidationMessage, useStyles } from '@grafana/ui';
import { selectors } from '@grafana/e2e-selectors';
export interface Props {
query: DataQuery;
queries: DataQuery[];
export interface Props<TQuery extends DataQuery = DataQuery> {
query: TQuery;
queries: TQuery[];
disabled?: boolean;
dataSource: DataSourceInstanceSettings;
renderExtras?: () => ReactNode;
onChangeDataSource?: (settings: DataSourceInstanceSettings) => void;
onChange: (query: DataQuery) => void;
onChange: (query: TQuery) => void;
onClick: (e: React.MouseEvent) => void;
collapsedText: string | null;
}
export const QueryEditorRowHeader: React.FC<Props> = (props) => {
export const QueryEditorRowHeader = <TQuery extends DataQuery>(props: Props<TQuery>) => {
const { query, queries, onClick, onChange, collapsedText, renderExtras, disabled } = props;
const styles = useStyles(getStyles);
@@ -123,7 +123,10 @@ export const QueryEditorRowHeader: React.FC<Props> = (props) => {
);
};
const renderDataSource = (props: Props, styles: ReturnType<typeof getStyles>): ReactNode => {
const renderDataSource = <TQuery extends DataQuery>(
props: Props<TQuery>,
styles: ReturnType<typeof getStyles>
): ReactNode => {
const { dataSource, onChangeDataSource } = props;
if (!onChangeDataSource) {