Skip to content

N
nexpie-grafana-theme
Commit 1ce3e49e by ryan
Options

fix lint problems

parent cae9c28f
Showing with 86 additions and 75 deletions
public/app/core/components/Login/LoginBackground.tsx
......@@ -4,14 +4,10 @@ const xCount = 50;
const yCount = 50;
function Cell({ x, y, flipIndex }) {
const index = y * xCount + x;
const index = (y * xCount) + x;
const bgColor1 = getColor(x, y);
return (
<div
className={`login-bg__item ${flipIndex === index ? 'login-bg-flip' : ''}`}
key={index}
style={{ background: bgColor1 }}
/>
<div className={`login-bg__item ${flipIndex === index ? 'login-bg-flip' : ''}`} key={index} style={{background: bgColor1}} />
);
}
......@@ -35,7 +31,7 @@ export default class LoginBackground extends Component<any, any> {
}
flipElements() {
const elementIndexToFlip = getRandomInt(0, xCount * yCount - 1);
const elementIndexToFlip = getRandomInt(0, (xCount * yCount) - 1);
this.setState(prevState => {
return {
...prevState,
......@@ -61,7 +57,9 @@ export default class LoginBackground extends Component<any, any> {
return (
<div className="login-bg__row">
{Array.from(Array(xCount)).map((el2, x) => {
return <Cell y={y} x={x} flipIndex={this.state.flipIndex} />;
return (
<Cell y={y} x={x} flipIndex={this.state.flipIndex} />
);
})}
</div>
);
......@@ -1238,5 +1236,5 @@ function getColor(x, y) {
// let randY = getRandomInt(0, y);
// let randIndex = randY * xCount + randX;
return colors[(y * xCount + x) % colors.length];
return colors[(y*xCount + x) % colors.length];
}
public/app/core/components/PasswordStrength.tsx
......@@ -5,27 +5,28 @@ export interface IProps {
}
export class PasswordStrength extends React.Component<IProps, any> {
constructor(props) {
super(props);
}
render() {
const { password } = this.props;
let strengthText = 'strength: strong like a bull.';
let strengthClass = 'password-strength-good';
let strengthText = "strength: strong like a bull.";
let strengthClass = "password-strength-good";
if (!password) {
return null;
}
if (password.length <= 8) {
strengthText = 'strength: you can do better.';
strengthClass = 'password-strength-ok';
strengthText = "strength: you can do better.";
strengthClass = "password-strength-ok";
}
if (password.length < 4) {
strengthText = 'strength: weak sauce.';
strengthClass = 'password-strength-bad';
strengthText = "strength: weak sauce.";
strengthClass = "password-strength-bad";
}
return (
......@@ -35,3 +36,5 @@ export class PasswordStrength extends React.Component<IProps, any> {
);
}
}
public/app/core/components/colorpicker/ColorPalette.tsx
......@@ -29,8 +29,7 @@ export class ColorPalette extends React.Component<IProps, any> {
key={paletteColor}
className={'pointer fa ' + cssClass}
style={{ color: paletteColor }}
onClick={this.onColorSelect(paletteColor)}
>
onClick={this.onColorSelect(paletteColor)}>
&nbsp;
</i>
);
......@@ -42,3 +41,4 @@ export class ColorPalette extends React.Component<IProps, any> {
);
}
}
public/app/core/components/colorpicker/ColorPickerPopover.tsx
......@@ -19,7 +19,7 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
this.state = {
tab: 'palette',
color: this.props.color || DEFAULT_COLOR,
colorString: this.props.color || DEFAULT_COLOR,
colorString: this.props.color || DEFAULT_COLOR
};
}
......@@ -32,7 +32,7 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
if (newColor.isValid()) {
this.setState({
color: newColor.toString(),
colorString: newColor.toString(),
colorString: newColor.toString()
});
this.props.onColorSelect(color);
}
......@@ -50,7 +50,7 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
onColorStringChange(e) {
let colorString = e.target.value;
this.setState({
colorString: colorString,
colorString: colorString
});
let newColor = tinycolor(colorString);
......@@ -71,11 +71,11 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
componentDidMount() {
this.pickerNavElem.find('li:first').addClass('active');
this.pickerNavElem.on('show', e => {
this.pickerNavElem.on('show', (e) => {
// use href attr (#name => name)
let tab = e.target.hash.slice(1);
this.setState({
tab: tab,
tab: tab
});
});
}
......@@ -97,24 +97,19 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
<div className="gf-color-picker">
<ul className="nav nav-tabs" id="colorpickernav" ref={this.setPickerNavElem.bind(this)}>
<li className="gf-tabs-item-colorpicker">
<a href="#palette" data-toggle="tab">
Colors
</a>
<a href="#palette" data-toggle="tab">Colors</a>
</li>
<li className="gf-tabs-item-colorpicker">
<a href="#spectrum" data-toggle="tab">
Custom
</a>
<a href="#spectrum" data-toggle="tab">Custom</a>
</li>
</ul>
<div className="gf-color-picker__body">{currentTab}</div>
<div className="gf-color-picker__body">
{currentTab}
</div>
<div>
<input
className="gf-form-input gf-form-input--small"
value={this.state.colorString}
onChange={this.onColorStringChange.bind(this)}
onBlur={this.onColorStringBlur.bind(this)}
/>
<input className="gf-form-input gf-form-input--small" value={this.state.colorString}
onChange={this.onColorStringChange.bind(this)} onBlur={this.onColorStringBlur.bind(this)}>
</input>
</div>
</div>
);
......
public/app/core/components/colorpicker/SpectrumPicker.tsx
......@@ -29,17 +29,14 @@ export class SpectrumPicker extends React.Component<IProps, any> {
}
componentDidMount() {
let spectrumOptions = _.assignIn(
{
flat: true,
showAlpha: true,
showButtons: false,
color: this.props.color,
appendTo: this.elem,
move: this.onSpectrumMove,
},
this.props.options
);
let spectrumOptions = _.assignIn({
flat: true,
showAlpha: true,
showButtons: false,
color: this.props.color,
appendTo: this.elem,
move: this.onSpectrumMove,
}, this.props.options);
this.elem.spectrum(spectrumOptions);
this.elem.spectrum('show');
......@@ -67,6 +64,9 @@ export class SpectrumPicker extends React.Component<IProps, any> {
}
render() {
return <div className="spectrum-container" ref={this.setComponentElem} />;
return (
<div className="spectrum-container" ref={this.setComponentElem}></div>
);
}
}
public/app/core/components/search/SearchResult.tsx
import React from 'react';
import classNames from 'classnames';
import { observer } from 'mobx-react';
import { store } from 'app/stores/store';
import React from "react";
import classNames from "classnames";
import { observer } from "mobx-react";
import { store } from "app/stores/store";
export interface SearchResultProps {
search: any;
......@@ -13,7 +13,7 @@ export class SearchResult extends React.Component<SearchResultProps, any> {
super(props);
this.state = {
search: store.search,
search: store.search
};
store.search.query();
......@@ -56,20 +56,29 @@ export class SearchResultSection extends React.Component<SectionProps, any> {
render() {
let collapseClassNames = classNames({
fa: true,
'fa-plus': !this.props.section.expanded,
'fa-minus': this.props.section.expanded,
'search-section__header__toggle': true,
"fa-plus": !this.props.section.expanded,
"fa-minus": this.props.section.expanded,
"search-section__header__toggle": true
});
return (
<div className="search-section" key={this.props.section.id}>
<div className="search-section__header">
<i className={classNames('search-section__header__icon', this.props.section.icon)} />
<span className="search-section__header__text">{this.props.section.title}</span>
<i
className={classNames(
"search-section__header__icon",
this.props.section.icon
)}
/>
<span className="search-section__header__text">
{this.props.section.title}
</span>
<i className={collapseClassNames} onClick={this.toggleSection} />
</div>
{this.props.section.expanded && (
<div className="search-section__items">{this.props.section.items.map(this.renderItem)}</div>
<div className="search-section__items">
{this.props.section.items.map(this.renderItem)}
</div>
)}
</div>
);
......
public/app/core/specs/PasswordStrength.jest.tsx
import React from 'react';
import { shallow } from 'enzyme';
import {shallow} from 'enzyme';
import { PasswordStrength } from '../components/PasswordStrength';
import {PasswordStrength} from '../components/PasswordStrength';
describe('PasswordStrength', () => {
it('should have class bad if length below 4', () => {
const wrapper = shallow(<PasswordStrength password="asd" />);
expect(wrapper.find('.password-strength-bad')).toHaveLength(1);
expect(wrapper.find(".password-strength-bad")).toHaveLength(1);
});
it('should have class ok if length below 8', () => {
const wrapper = shallow(<PasswordStrength password="asdasd" />);
expect(wrapper.find('.password-strength-ok')).toHaveLength(1);
expect(wrapper.find(".password-strength-ok")).toHaveLength(1);
});
it('should have class good if length above 8', () => {
const wrapper = shallow(<PasswordStrength password="asdaasdda" />);
expect(wrapper.find('.password-strength-good')).toHaveLength(1);
expect(wrapper.find(".password-strength-good")).toHaveLength(1);
});
});
public/app/core/utils/kbn.ts
......@@ -133,12 +133,12 @@ kbn.secondsToHms = function(seconds) {
kbn.secondsToHhmmss = function(seconds) {
var strings = [];
var numhours = Math.floor(seconds / 3600);
var numminutes = Math.floor((seconds % 3600) / 60);
var numseconds = Math.floor((seconds % 3600) % 60);
numhours > 9 ? strings.push('' + numhours) : strings.push('0' + numhours);
numminutes > 9 ? strings.push('' + numminutes) : strings.push('0' + numminutes);
numseconds > 9 ? strings.push('' + numseconds) : strings.push('0' + numseconds);
var numhours = Math.floor(seconds/3600);
var numminutes = Math.floor((seconds%3600)/60);
var numseconds = Math.floor((seconds%3600)%60);
numhours > 9 ? strings.push(''+numhours) : strings.push('0'+numhours);
numminutes > 9 ? strings.push(''+numminutes) : strings.push('0'+numminutes);
numseconds > 9 ? strings.push(''+numseconds) : strings.push('0'+numseconds);
return strings.join(':');
};
......
public/app/features/dashboard/dashgrid/DashboardPanel.tsx
import React from 'react';
import { PanelModel } from '../panel_model';
import { PanelContainer } from './PanelContainer';
import { AttachedPanel } from './PanelLoader';
import { DashboardRow } from './DashboardRow';
import { AddPanelPanel } from './AddPanelPanel';
import {PanelModel} from '../panel_model';
import {PanelContainer} from './PanelContainer';
import {AttachedPanel} from './PanelLoader';
import {DashboardRow} from './DashboardRow';
import {AddPanelPanel} from './AddPanelPanel';
export interface DashboardPanelProps {
panel: PanelModel;
......@@ -46,6 +46,9 @@ export class DashboardPanel extends React.Component<DashboardPanelProps, any> {
return <AddPanelPanel panel={this.props.panel} getPanelContainer={this.props.getPanelContainer} />;
}
return <div ref={element => (this.element = element)} className="panel-height-helper" />;
return (
<div ref={element => this.element = element} className="panel-height-helper" />
);
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment