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

Clean up hoc and extend component props automatically

Browse Source
This commit is contained in:
Johannes Schill 2018-12-11 11:46:59 +01:00
parent 645812f643
commit 07ce88f685
1 changed files with 7 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
public/app/features/dashboard/dashgrid/withKeyboardNavigation.tsx
View File

@ -1,19 +1,17 @@
import React from 'react';
import { Props as DataSourceProps } from './DataSourcePicker';
import { Props as VizTypeProps } from './VizTypePicker';
import React, { KeyboardEvent, ComponentType, Component } from 'react';
interface State {
selected: number;
}
export interface KeyboardNavigationProps {
selected?: number;
onKeyDown?: (evt: React.KeyboardEvent<EventTarget>, maxSelectedIndex: number, onEnterAction: () => void) => void;
onMouseEnter?: (select: number) => void;
onKeyDown: (evt: KeyboardEvent<EventTarget>, maxSelectedIndex: number, onEnterAction: () => void) => void;
onMouseEnter: (select: number) => void;
selected: number;
}
const withKeyboardNavigation = WrappedComponent => {
return class extends React.Component<DataSourceProps | VizTypeProps, State> {
const withKeyboardNavigation = <P extends object>(WrappedComponent: ComponentType<P & KeyboardNavigationProps>) => {
return class WithKeyboardNavigation extends Component<P, State> {
constructor(props) {
super(props);
@ -58,12 +56,7 @@ const withKeyboardNavigation = WrappedComponent => {
render() {
return (
<WrappedComponent
selected={this.state.selected}
onKeyDown={this.onKeyDown}
onMouseEnter={this.onMouseEnter}
{...this.props}
/>
<WrappedComponent {...this.state} {...this.props} onKeyDown={this.onKeyDown} onMouseEnter={this.onMouseEnter} />
);
}
};