Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[eslint-config-kibana] Upgrade eslint-config to 0.10.0. #13323

Merged
merged 3 commits into from
Aug 11, 2017
Merged

[eslint-config-kibana] Upgrade eslint-config to 0.10.0. #13323

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
a6880c2
Upgrade eslint-config to 0.10.0. Autofix rule violations.
cjcenizal Aug 3, 2017
6a842f5
Manual fixes.
cjcenizal Aug 3, 2017
87a4b88
Fix linting violations with popover and typography stuff in UI Framew…
cjcenizal Aug 11, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -204,7 +204,7 @@
"yauzl": "2.7.0"
},
"devDependencies": {
"@elastic/eslint-config-kibana": "0.9.0",
"@elastic/eslint-config-kibana": "0.10.0",
"@elastic/eslint-import-resolver-kibana": "0.8.1",
"@elastic/eslint-plugin-kibana-custom": "1.0.3",
"angular-mocks": "1.4.7",
Expand Down
10 changes: 5 additions & 5 deletions src/core_plugins/kibana/public/dashboard/top_nav/clone_modal.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ export class DashboardCloneModal extends React.Component {
data-tests-subj="dashboardCloneModal"
aria-label="Clone a dashboard"
className="dashboardCloneModal"
onKeyDown={ this.onKeyDown }
onKeyDown={this.onKeyDown}
>
<KuiModalHeader>
<KuiModalHeaderTitle>
Expand All @@ -58,8 +58,8 @@ export class DashboardCloneModal extends React.Component {
autoFocus
data-test-subj="clonedDashboardTitle"
className="kuiTextInput kuiTextInput--large"
value={ this.state.newDashboardName }
onChange={ this.onInputChange }
value={this.state.newDashboardName}
onChange={this.onInputChange}
/>
</KuiModalBodyText>
</KuiModalBody>
Expand All @@ -68,14 +68,14 @@ export class DashboardCloneModal extends React.Component {
<KuiButton
buttonType="hollow"
data-test-subj="cloneCancelButton"
onClick={ this.props.onClose }
onClick={this.props.onClose}
>
Cancel
</KuiButton>
<KuiButton
buttonType="primary"
data-test-subj="cloneConfirmButton"
onClick={ this.cloneDashboard }
onClick={this.cloneDashboard}
>
Confirm Clone
</KuiButton>
Expand Down
6 changes: 3 additions & 3 deletions src/core_plugins/metrics/public/components/add_delete_buttons.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ function AddDeleteButtons(props) {
}
return (
<Tooltip text={props.deleteTooltip}>
<a className="thor__button-outlined-danger sm" onClick={ props.onDelete }>
<a className="thor__button-outlined-danger sm" onClick={props.onDelete}>
<i className="fa fa-trash-o" />
</a>
</Tooltip>
Expand All @@ -20,7 +20,7 @@ function AddDeleteButtons(props) {
}
return (
<Tooltip text={props.addTooltip}>
<a className="thor__button-outlined-default sm" onClick={ props.onAdd }>
<a className="thor__button-outlined-default sm" onClick={props.onAdd}>
<i className="fa fa-plus" />
</a>
</Tooltip>
Expand All @@ -32,7 +32,7 @@ function AddDeleteButtons(props) {
if (props.onClone && !props.disableAdd) {
clone = (
<Tooltip text={props.cloneTooltip}>
<a className="thor__button-outlined-default sm" onClick={ props.onClone }>
<a className="thor__button-outlined-default sm" onClick={props.onClone}>
<i className="fa fa-files-o" />
</a>
</Tooltip>
Expand Down
96 changes: 45 additions & 51 deletions src/core_plugins/metrics/public/components/aggs/derivative.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,62 +1,58 @@
import React, { Component, PropTypes } from 'react';
import React, { PropTypes } from 'react';
import AggSelect from './agg_select';
import MetricSelect from './metric_select';
import AggRow from './agg_row';
import createChangeHandler from '../lib/create_change_handler';
import createSelectHandler from '../lib/create_select_handler';
import createTextHandler from '../lib/create_text_handler';

class DerivativeAgg extends Component {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Changing these components from classes to function makes a lot more changed lines than necessary. Is this a requirement of the new eslint rules? Is it autofixable? If there are auto-fixed changes and manual changes, it would be great if they were in separate commits so they could be reviewed with different scrutiny.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If the class -> function conversion isn't necessary, I'd be fine with it still but another separate commit would be very helpful.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Preferring stateless functional components is one of the rules I added, but no it isn't autofixable unfortunately. It also means moving a lot of default exports to named exports (which is also part of our style guide, I believe). I broke this PR up into 2 commits (automatic fixes and manual ones), for your convenience.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome, thanks!

export const DerivativeAgg = props => {
const { siblings } = props;

render() {
const { siblings } = this.props;
const defaults = { unit: '' };
const model = { ...defaults, ...props.model };

const defaults = { unit: '' };
const model = { ...defaults, ...this.props.model };
const handleChange = createChangeHandler(props.onChange, model);
const handleSelectChange = createSelectHandler(handleChange);
const handleTextChange = createTextHandler(handleChange);

const handleChange = createChangeHandler(this.props.onChange, model);
const handleSelectChange = createSelectHandler(handleChange);
const handleTextChange = createTextHandler(handleChange);

return (
<AggRow
disableDelete={this.props.disableDelete}
model={this.props.model}
onAdd={this.props.onAdd}
onDelete={this.props.onDelete}
siblings={this.props.siblings}
>
<div className="vis_editor__row_item">
<div className="vis_editor__label">Aggregation</div>
<AggSelect
siblings={this.props.siblings}
value={model.type}
onChange={handleSelectChange('type')}
/>
</div>
<div className="vis_editor__row_item">
<div className="vis_editor__label">Metric</div>
<MetricSelect
onChange={handleSelectChange('field')}
metrics={siblings}
metric={model}
value={model.field}
/>
</div>
<div>
<div className="vis_editor__label">Units (1s, 1m, etc)</div>
<input
className="vis_editor__input"
onChange={handleTextChange('unit')}
value={model.unit}
type="text"
/>
</div>
</AggRow>
);
}

}
return (
<AggRow
disableDelete={props.disableDelete}
model={props.model}
onAdd={props.onAdd}
onDelete={props.onDelete}
siblings={props.siblings}
>
<div className="vis_editor__row_item">
<div className="vis_editor__label">Aggregation</div>
<AggSelect
siblings={props.siblings}
value={model.type}
onChange={handleSelectChange('type')}
/>
</div>
<div className="vis_editor__row_item">
<div className="vis_editor__label">Metric</div>
<MetricSelect
onChange={handleSelectChange('field')}
metrics={siblings}
metric={model}
value={model.field}
/>
</div>
<div>
<div className="vis_editor__label">Units (1s, 1m, etc)</div>
<input
className="vis_editor__input"
onChange={handleTextChange('unit')}
value={model.unit}
type="text"
/>
</div>
</AggRow>
);
};

DerivativeAgg.propTypes = {
disableDelete: PropTypes.bool,
Expand All @@ -69,5 +65,3 @@ DerivativeAgg.propTypes = {
series: PropTypes.object,
siblings: PropTypes.array,
};

export default DerivativeAgg;
160 changes: 77 additions & 83 deletions src/core_plugins/metrics/public/components/aggs/filter_ratio.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,99 +1,95 @@
import React, { Component, PropTypes } from 'react';
import React, { PropTypes } from 'react';
import AggSelect from './agg_select';
import FieldSelect from './field_select';
import AggRow from './agg_row';
import createChangeHandler from '../lib/create_change_handler';
import createSelectHandler from '../lib/create_select_handler';
import createTextHandler from '../lib/create_text_handler';

class FilterRatioAgg extends Component {
export const FilterRatioAgg = props => {
const {
series,
fields,
panel
} = props;

render() {
const {
series,
fields,
panel
} = this.props;
const handleChange = createChangeHandler(props.onChange, props.model);
const handleSelectChange = createSelectHandler(handleChange);
const handleTextChange = createTextHandler(handleChange);
const indexPattern = series.override_index_pattern && series.series_index_pattern || panel.index_pattern;

const handleChange = createChangeHandler(this.props.onChange, this.props.model);
const handleSelectChange = createSelectHandler(handleChange);
const handleTextChange = createTextHandler(handleChange);
const indexPattern = series.override_index_pattern && series.series_index_pattern || panel.index_pattern;
const defaults = {
numerator: '*',
denominator: '*',
metric_agg: 'count'
};

const defaults = {
numerator: '*',
denominator: '*',
metric_agg: 'count'
};
const model = { ...defaults, ...props.model };

const model = { ...defaults, ...this.props.model };

return (
<AggRow
disableDelete={this.props.disableDelete}
model={this.props.model}
onAdd={this.props.onAdd}
onDelete={this.props.onDelete}
siblings={this.props.siblings}
>
<div style={{ flex: '1 0 auto' }}>
<div style={{ flex: '1 0 auto', display: 'flex' }}>
<div className="vis_editor__row_item">
<div className="vis_editor__label">Aggregation</div>
<AggSelect
siblings={this.props.siblings}
value={model.type}
onChange={handleSelectChange('type')}
/>
</div>
<div className="vis_editor__row_item">
<div className="vis_editor__label">Numerator</div>
<input
className="vis_editor__input-grows-100"
onChange={handleTextChange('numerator')}
value={model.numerator}
type="text"
/>
</div>
<div className="vis_editor__row_item">
<div className="vis_editor__label">Denominator</div>
<input
className="vis_editor__input-grows-100"
onChange={handleTextChange('denominator')}
value={model.denominator}
type="text"
/>
</div>
return (
<AggRow
disableDelete={props.disableDelete}
model={props.model}
onAdd={props.onAdd}
onDelete={props.onDelete}
siblings={props.siblings}
>
<div style={{ flex: '1 0 auto' }}>
<div style={{ flex: '1 0 auto', display: 'flex' }}>
<div className="vis_editor__row_item">
<div className="vis_editor__label">Aggregation</div>
<AggSelect
siblings={props.siblings}
value={model.type}
onChange={handleSelectChange('type')}
/>
</div>
<div className="vis_editor__row_item">
<div className="vis_editor__label">Numerator</div>
<input
className="vis_editor__input-grows-100"
onChange={handleTextChange('numerator')}
value={model.numerator}
type="text"
/>
</div>
<div style={{ flex: '1 0 auto', display: 'flex', marginTop: '10px' }}>
<div className="vis_editor__row_item">
<div className="vis_editor__label">Denominator</div>
<input
className="vis_editor__input-grows-100"
onChange={handleTextChange('denominator')}
value={model.denominator}
type="text"
/>
</div>
</div>
<div style={{ flex: '1 0 auto', display: 'flex', marginTop: '10px' }}>
<div className="vis_editor__row_item">
<div className="vis_editor__label">Metric Aggregation</div>
<AggSelect
siblings={props.siblings}
panelType="metrics"
value={model.metric_agg}
onChange={handleSelectChange('metric_agg')}
/>
</div>
{ model.metric_agg !== 'count' ? (
<div className="vis_editor__row_item">
<div className="vis_editor__label">Metric Aggregation</div>
<AggSelect
siblings={this.props.siblings}
panelType="metrics"
value={model.metric_agg}
onChange={handleSelectChange('metric_agg')}
<div className="vis_editor__label">Field</div>
<FieldSelect
fields={fields}
type={model.metric_agg}
restrict="numeric"
indexPattern={indexPattern}
value={model.field}
onChange={handleSelectChange('field')}
/>
</div>
{ model.metric_agg !== 'count' ? (
<div className="vis_editor__row_item">
<div className="vis_editor__label">Field</div>
<FieldSelect
fields={fields}
type={model.metric_agg}
restrict="numeric"
indexPattern={indexPattern}
value={model.field}
onChange={handleSelectChange('field')}
/>
</div>) : null }
</div>
</div>) : null }
</div>
</AggRow>
);
}

}
</div>
</AggRow>
);
};

FilterRatioAgg.propTypes = {
disableDelete: PropTypes.bool,
Expand All @@ -106,5 +102,3 @@ FilterRatioAgg.propTypes = {
series: PropTypes.object,
siblings: PropTypes.array,
};

export default FilterRatioAgg;
Loading