fix lint problems

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

@@ -1,7 +1,7 @@
-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

@@ -1,21 +1,24 @@
 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

@@ -1,9 +1,9 @@
 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" />
+    );
   }
 }
+