diff --git a/client/.eslintrc b/client/.eslintrc
index 57c45d316..b7f6738ac 100644
--- a/client/.eslintrc
+++ b/client/.eslintrc
@@ -15,21 +15,14 @@
     "react/prop-types": 0,
 
 
-    "import/first": 0,
     "import/prefer-default-export": 0,
     "import/no-extraneous-dependencies": 0,
-    "import/no-named-as-default": 0,
     "jsx-a11y/no-static-element-interactions": 0,
     "jsx-a11y/label-has-for": 0,
-    "react/jsx-indent": 0,
     "react/jsx-filename-extension": 0,
-    "react/jsx-first-prop-new-line": 0,
     "react/jsx-no-target-blank": 0,
     "react/no-find-dom-node": 0,
-    "react/no-string-refs": 0,
-    "react/self-closing-comp": 0,
     "react/forbid-prop-types": 0,
-    "no-plusplus": 0,
     "no-mixed-operators": 0,
     "no-restricted-properties": 0,
     "no-underscore-dangle": 0,
diff --git a/client/app/scripts/charts/edge.js b/client/app/scripts/charts/edge.js
index 458a8a7c3..ef33a5f1a 100644
--- a/client/app/scripts/charts/edge.js
+++ b/client/app/scripts/charts/edge.js
@@ -17,7 +17,8 @@ class Edge extends React.Component {
     const className = classNames('edge', {highlighted, blurred, focused});
 
     return (
-      <g className={className} onMouseEnter={this.handleMouseEnter}
+      <g
+        className={className} onMouseEnter={this.handleMouseEnter}
         onMouseLeave={this.handleMouseLeave} id={id}>
         <path d={path} className="shadow" />
         <path d={path} className="link" />
diff --git a/client/app/scripts/charts/node-container.js b/client/app/scripts/charts/node-container.js
index 92455a8ad..99acfa24d 100644
--- a/client/app/scripts/charts/node-container.js
+++ b/client/app/scripts/charts/node-container.js
@@ -14,11 +14,12 @@ class NodeContainer extends React.Component {
     const other = omit(this.props, 'dx', 'dy');
 
     return (
-      <Motion style={{
-        x: spring(dx, animConfig),
-        y: spring(dy, animConfig),
-        f: spring(scaleFactor, animConfig)
-      }}>
+      <Motion
+        style={{
+          x: spring(dx, animConfig),
+          y: spring(dy, animConfig),
+          f: spring(scaleFactor, animConfig)
+        }}>
         {interpolated => {
           const transform = `translate(${round(interpolated.x, layoutPrecision)},`
             + `${round(interpolated.y, layoutPrecision)})`;
diff --git a/client/app/scripts/charts/node-shape-circle.js b/client/app/scripts/charts/node-shape-circle.js
index 9fc8fe13c..9505ed086 100644
--- a/client/app/scripts/charts/node-shape-circle.js
+++ b/client/app/scripts/charts/node-shape-circle.js
@@ -17,8 +17,12 @@ export default function NodeShapeCircle({id, highlighted, size, color, metric})
       {highlighted && <circle r={size * 0.7} className="highlighted" />}
       <circle r={size * 0.5} className="border" stroke={color} />
       <circle r={size * 0.45} className="shadow" />
-      {hasMetric && <circle r={size * 0.45} className="metric-fill" style={metricStyle}
-        clipPath={`url(#${clipId})`} />}
+      {hasMetric && <circle
+        r={size * 0.45}
+        className="metric-fill"
+        style={metricStyle}
+        clipPath={`url(#${clipId})`}
+      />}
       {highlighted && hasMetric ?
         <text style={{fontSize}}>{formattedValue}</text> :
         <circle className="node" r={Math.max(2, (size * 0.125))} />}
diff --git a/client/app/scripts/charts/node-shape-cloud.js b/client/app/scripts/charts/node-shape-cloud.js
index cf71e326e..ebf5dd2b7 100644
--- a/client/app/scripts/charts/node-shape-cloud.js
+++ b/client/app/scripts/charts/node-shape-cloud.js
@@ -37,8 +37,7 @@ export default function NodeShapeCloud({highlighted, size, color}) {
 
   return (
     <g className="shape shape-cloud">
-      {highlighted &&
-          <path className="highlighted" {...pathProps(0.7)} />}
+      {highlighted && <path className="highlighted" {...pathProps(0.7)} />}
       <path className="border" stroke={color} {...pathProps(0.5)} />
       <path className="shadow" {...pathProps(0.45)} />
       <circle className="node" r={Math.max(2, (size * 0.125))} />
diff --git a/client/app/scripts/charts/node-shape-heptagon.js b/client/app/scripts/charts/node-shape-heptagon.js
index 4f8d617d9..7ccadcc10 100644
--- a/client/app/scripts/charts/node-shape-heptagon.js
+++ b/client/app/scripts/charts/node-shape-heptagon.js
@@ -12,7 +12,7 @@ const spline = line()
 function polygon(r, sides) {
   const a = (Math.PI * 2) / sides;
   const points = [];
-  for (let i = 0; i < sides; i++) {
+  for (let i = 0; i < sides; i += 1) {
     points.push([r * Math.sin(a * i), -r * Math.cos(a * i)]);
   }
   return points;
@@ -37,8 +37,12 @@ export default function NodeShapeHeptagon({id, highlighted, size, color, metric}
       {highlighted && <path className="highlighted" {...pathProps(0.7)} />}
       <path className="border" stroke={color} {...pathProps(0.5)} />
       <path className="shadow" {...pathProps(0.45)} />
-      {hasMetric && <path className="metric-fill" clipPath={`url(#${clipId})`}
-        style={metricStyle} {...pathProps(0.45)} />}
+      {hasMetric && <path
+        className="metric-fill"
+        clipPath={`url(#${clipId})`}
+        style={metricStyle}
+        {...pathProps(0.45)}
+      />}
       {highlighted && hasMetric ?
         <text style={{fontSize}}>{formattedValue}</text> :
         <circle className="node" r={Math.max(2, (size * 0.125))} />}
diff --git a/client/app/scripts/charts/node-shape-hexagon.js b/client/app/scripts/charts/node-shape-hexagon.js
index dcae18c6f..1d1cd9763 100644
--- a/client/app/scripts/charts/node-shape-hexagon.js
+++ b/client/app/scripts/charts/node-shape-hexagon.js
@@ -53,8 +53,12 @@ export default function NodeShapeHexagon({id, highlighted, size, color, metric})
       {highlighted && <path className="highlighted" {...pathProps(0.7)} />}
       <path className="border" stroke={color} {...pathProps(0.5)} />
       <path className="shadow" {...pathProps(shadowSize)} />
-      {hasMetric && <path className="metric-fill" style={metricStyle}
-        clipPath={`url(#${clipId})`} {...pathProps(shadowSize)} />}
+      {hasMetric && <path
+        className="metric-fill"
+        style={metricStyle}
+        clipPath={`url(#${clipId})`}
+        {...pathProps(shadowSize)}
+      />}
       {highlighted && hasMetric ?
         <text style={{fontSize}}>
           {formattedValue}
diff --git a/client/app/scripts/charts/node-shape-square.js b/client/app/scripts/charts/node-shape-square.js
index c3c24d86e..f99cfdceb 100644
--- a/client/app/scripts/charts/node-shape-square.js
+++ b/client/app/scripts/charts/node-shape-square.js
@@ -28,8 +28,11 @@ export default function NodeShapeSquare({
       {highlighted && <rect className="highlighted" {...rectProps(0.7)} />}
       <rect className="border" stroke={color} {...rectProps(0.5, 0.5)} />
       <rect className="shadow" {...rectProps(0.45, 0.39)} />
-      {hasMetric && <rect className="metric-fill" style={metricStyle}
-        clipPath={`url(#${clipId})`} {...rectProps(0.45, 0.39)} />}
+      {hasMetric && <rect
+        className="metric-fill" style={metricStyle}
+        clipPath={`url(#${clipId})`}
+        {...rectProps(0.45, 0.39)}
+      />}
       {highlighted && hasMetric ?
         <text style={{fontSize}}>
           {formattedValue}
diff --git a/client/app/scripts/charts/node.js b/client/app/scripts/charts/node.js
index 118f5194f..9b9f53766 100644
--- a/client/app/scripts/charts/node.js
+++ b/client/app/scripts/charts/node.js
@@ -127,9 +127,12 @@ class Node extends React.Component {
 
           svgLabels(label, subLabel, labelClassName, subLabelClassName, labelOffsetY) :
 
-          <foreignObject style={{pointerEvents: 'none'}} x={labelOffsetX} y={labelOffsetY}
+          <foreignObject
+            style={{pointerEvents: 'none'}}
+            x={labelOffsetX} y={labelOffsetY}
             width={labelWidth} height="100em">
-            <div className="node-label-wrapper"
+            <div
+              className="node-label-wrapper"
               style={{pointerEvents: 'all', fontSize, maxWidth: labelWidth}}
               {...mouseEvents}>
               <div className={labelClassName}>
@@ -149,8 +152,11 @@ class Node extends React.Component {
             {...this.props} />
         </g>
 
-        {showingNetworks && <NodeNetworksOverlay offset={networkOffset}
-          size={size} networks={networks} stack={stack} />}
+        {showingNetworks && <NodeNetworksOverlay
+          offset={networkOffset}
+          size={size} networks={networks}
+          stack={stack}
+        />}
       </g>
     );
   }
diff --git a/client/app/scripts/charts/nodes-chart.js b/client/app/scripts/charts/nodes-chart.js
index 279738494..d44982c39 100644
--- a/client/app/scripts/charts/nodes-chart.js
+++ b/client/app/scripts/charts/nodes-chart.js
@@ -219,7 +219,8 @@ class NodesChart extends React.Component {
     const layoutPrecision = getLayoutPrecision(nodes.size);
     return (
       <div className="nodes-chart">
-        <svg width="100%" height="100%" id="nodes-chart-canvas"
+        <svg
+          width="100%" height="100%" id="nodes-chart-canvas"
           className={svgClassNames} onClick={this.handleMouseClick}>
           <g transform="translate(24,24) scale(0.25)">
             <Logo />
diff --git a/client/app/scripts/charts/nodes-layout.js b/client/app/scripts/charts/nodes-layout.js
index 670671777..5f25d270f 100644
--- a/client/app/scripts/charts/nodes-layout.js
+++ b/client/app/scripts/charts/nodes-layout.js
@@ -249,11 +249,11 @@ function layoutSingleNodes(layout, opts) {
       if (singleNodes.has(node.get('id'))) {
         if (col === columns) {
           col = 0;
-          row++;
+          row += 1;
         }
         singleX = col * (nodesep + nodeWidth) + offsetX;
         singleY = row * (ranksep + nodeHeight) + offsetY;
-        col++;
+        col += 1;
         return node.merge({
           x: singleX,
           y: singleY
@@ -453,9 +453,10 @@ export function doLayout(immNodes, immEdges, opts) {
   const useCache = !options.forceRelayout && cachedLayout && nodeCache && edgeCache;
   let layout;
 
-  ++layoutRuns;
+  layoutRuns += 1;
   if (useCache && !hasUnseenNodes(immNodes, nodeCache)) {
-    log('skip layout, trivial adjustment', ++layoutRunsTrivial, layoutRuns);
+    layoutRunsTrivial += 1;
+    log('skip layout, trivial adjustment', layoutRunsTrivial, layoutRuns);
     layout = cloneLayout(cachedLayout, immNodes, immEdges);
     // copy old properties, works also if nodes get re-added
     layout = copyLayoutProperties(layout, nodeCache, edgeCache);
diff --git a/client/app/scripts/components/debug-toolbar.js b/client/app/scripts/components/debug-toolbar.js
index 13f69eaef..487baed92 100644
--- a/client/app/scripts/components/debug-toolbar.js
+++ b/client/app/scripts/components/debug-toolbar.js
@@ -338,7 +338,7 @@ class DebugToolbar extends React.Component {
               {LABEL_PREFIXES.map(r => (
                 <tr key={r}>
                   {LABEL_PREFIXES.map(c => (
-                    <td key={c} title={`(${r}, ${c})`} style={{backgroundColor: fn(r, c)}}></td>
+                    <td key={c} title={`(${r}, ${c})`} style={{backgroundColor: fn(r, c)}} />
                   ))}
                 </tr>
               ))}
diff --git a/client/app/scripts/components/details-card.js b/client/app/scripts/components/details-card.js
index 1179248c4..e72aa4fca 100644
--- a/client/app/scripts/components/details-card.js
+++ b/client/app/scripts/components/details-card.js
@@ -3,8 +3,11 @@ import { connect } from 'react-redux';
 
 import NodeDetails from './node-details';
 import EmbeddedTerminal from './embedded-terminal';
-import { DETAILS_PANEL_WIDTH as WIDTH, DETAILS_PANEL_OFFSET as OFFSET,
-  DETAILS_PANEL_MARGINS as MARGINS } from '../constants/styles';
+import {
+  DETAILS_PANEL_WIDTH as WIDTH,
+  DETAILS_PANEL_OFFSET as OFFSET,
+  DETAILS_PANEL_MARGINS as MARGINS
+} from '../constants/styles';
 
 class DetailsCard extends React.Component {
 
diff --git a/client/app/scripts/components/details.js b/client/app/scripts/components/details.js
index 87938a052..553751062 100644
--- a/client/app/scripts/components/details.js
+++ b/client/app/scripts/components/details.js
@@ -9,10 +9,12 @@ class Details extends React.Component {
     // render all details as cards, later cards go on top
     return (
       <div className="details">
-        {details.toIndexedSeq().map((obj, index) => <DetailsCard key={obj.id}
-          index={index} cardCount={details.size}
-          nodeControlStatus={controlStatus.get(obj.id)} {...obj} />
-        )}
+        {details.toIndexedSeq().map((obj, index) => (
+          <DetailsCard
+            key={obj.id} index={index} cardCount={details.size}
+            nodeControlStatus={controlStatus.get(obj.id)} {...obj}
+          />
+        ))}
       </div>
     );
   }
diff --git a/client/app/scripts/components/dev-tools.js b/client/app/scripts/components/dev-tools.js
index 3012ab99b..2722a23a4 100644
--- a/client/app/scripts/components/dev-tools.js
+++ b/client/app/scripts/components/dev-tools.js
@@ -4,8 +4,10 @@ import LogMonitor from 'redux-devtools-log-monitor';
 import DockMonitor from 'redux-devtools-dock-monitor';
 
 export default createDevTools(
-  <DockMonitor defaultIsVisible={false}
-    toggleVisibilityKey="ctrl-h" changePositionKey="ctrl-w">
+  <DockMonitor
+    defaultIsVisible={false}
+    toggleVisibilityKey="ctrl-h"
+    changePositionKey="ctrl-w">
     <LogMonitor />
   </DockMonitor>
 );
diff --git a/client/app/scripts/components/footer.js b/client/app/scripts/components/footer.js
index b592916df..6055ecfc1 100644
--- a/client/app/scripts/components/footer.js
+++ b/client/app/scripts/components/footer.js
@@ -48,7 +48,8 @@ class Footer extends React.Component {
       <div className="footer">
 
         <div className="footer-status">
-          {versionUpdate && <a className="footer-versionupdate"
+          {versionUpdate && <a
+            className="footer-versionupdate"
             title={versionUpdateTitle} href={versionUpdate.downloadUrl} target="_blank">
             Update available: {versionUpdate.version}
           </a>}
@@ -67,11 +68,14 @@ class Footer extends React.Component {
             {pauseLabel !== '' && <span className="footer-label">{pauseLabel}</span>}
             <span className="fa fa-pause" />
           </a>
-          <a className="footer-icon" onClick={this.props.clickForceRelayout}
+          <a
+            className="footer-icon"
+            onClick={this.props.clickForceRelayout}
             title={forceRelayoutTitle}>
             <span className="fa fa-refresh" />
           </a>
-          <a className="footer-icon" onClick={this.props.clickDownloadGraph}
+          <a
+            className="footer-icon" onClick={this.props.clickDownloadGraph}
             title="Save canvas as SVG (does not include search highlighting)">
             <span className="fa fa-download" />
           </a>
@@ -84,8 +88,7 @@ class Footer extends React.Component {
           <a className="footer-icon" href="https://gitreports.com/issue/weaveworks/scope" target="_blank" title="Report an issue">
             <span className="fa fa-bug" />
           </a>
-          <a className="footer-icon" onClick={this.props.toggleHelp}
-            title="Show help">
+          <a className="footer-icon" onClick={this.props.toggleHelp} title="Show help">
             <span className="fa fa-question" />
           </a>
         </div>
diff --git a/client/app/scripts/components/help-panel.js b/client/app/scripts/components/help-panel.js
index b7147aaa6..aad9b3b7f 100644
--- a/client/app/scripts/components/help-panel.js
+++ b/client/app/scripts/components/help-panel.js
@@ -85,7 +85,7 @@ function renderSearches(searches) {
       {searches.map(({term, label}) => (
         <div key={term} className="help-panel-search-row">
           <div className="help-panel-search-row-term">
-            <i className="fa fa-search search-label-icon"></i>
+            <i className="fa fa-search search-label-icon" />
             {term}
           </div>
           <div className="help-panel-search-row-term-label">{label}</div>
diff --git a/client/app/scripts/components/logo.js b/client/app/scripts/components/logo.js
index 8b402443d..457398982 100644
--- a/client/app/scripts/components/logo.js
+++ b/client/app/scripts/components/logo.js
@@ -6,53 +6,66 @@ export default function Logo() {
     <g className="logo">
       <path fill="#32324B" d="M114.937,118.165l75.419-67.366c-5.989-4.707-12.71-8.52-19.981-11.211l-55.438,49.52V118.165z" />
       <path fill="#32324B" d="M93.265,108.465l-20.431,18.25c1.86,7.57,4.88,14.683,8.87,21.135l11.561-10.326V108.465z" />
-      <path fill="#00D2FF" d="M155.276,53.074V35.768C151.815,35.27,148.282,35,144.685,35c-3.766,0-7.465,0.286-11.079,0.828v36.604
+      <path
+        fill="#00D2FF" d="M155.276,53.074V35.768C151.815,35.27,148.282,35,144.685,35c-3.766,0-7.465,0.286-11.079,0.828v36.604
         L155.276,53.074z" />
-      <path fill="#00D2FF" d="M155.276,154.874V82.133l-21.671,19.357v80.682c3.614,0.543,7.313,0.828,11.079,0.828
+      <path
+        fill="#00D2FF" d="M155.276,154.874V82.133l-21.671,19.357v80.682c3.614,0.543,7.313,0.828,11.079,0.828
         c4.41,0,8.723-0.407,12.921-1.147l58.033-51.838c1.971-6.664,3.046-13.712,3.046-21.015c0-3.439-0.254-6.817-0.708-10.132
         L155.276,154.874z" />
       <path fill="#FF4B19" d="M155.276,133.518l58.14-51.933c-2.77-6.938-6.551-13.358-11.175-19.076l-46.965,41.951V133.518z" />
-      <path fill="#FF4B19" d="M133.605,123.817l-18.668,16.676V41.242c-8.086,3.555-15.409,8.513-21.672,14.567V162.19
+      <path
+        fill="#FF4B19" d="M133.605,123.817l-18.668,16.676V41.242c-8.086,3.555-15.409,8.513-21.672,14.567V162.19
         c4.885,4.724,10.409,8.787,16.444,12.03l23.896-21.345V123.817z" />
-      <polygon fill="#32324B" points="325.563,124.099 339.389,72.22 357.955,72.22 337.414,144.377 315.556,144.377 303.311,95.79
+      <polygon
+        fill="#32324B" points="325.563,124.099 339.389,72.22 357.955,72.22 337.414,144.377 315.556,144.377 303.311,95.79
         291.065,144.377 269.207,144.377 248.666,72.22 267.232,72.22 281.058,124.099 294.752,72.22 311.869,72.22 " />
-      <path fill="#32324B" d="M426.429,120.676c-2.106,14.352-13.167,24.623-32.128,24.623c-20.146,0-35.025-12.114-35.025-36.605
+      <path
+        fill="#32324B" d="M426.429,120.676c-2.106,14.352-13.167,24.623-32.128,24.623c-20.146,0-35.025-12.114-35.025-36.605
         c0-24.622,15.406-37.395,35.025-37.395c21.726,0,33.182,15.933,33.182,37.263v3.819h-49.772c0,8.031,3.291,18.17,16.327,18.17
         c7.242,0,12.904-3.555,14.353-10.27L426.429,120.676z M408.654,99.608c-0.659-10.008-7.11-13.694-14.484-13.694
         c-8.427,0-14.879,5.135-15.801,13.694H408.654z" />
-      <path fill="#32324B" d="M480.628,97.634v-2.502c0-5.662-2.37-9.351-13.036-9.351c-13.298,0-13.694,7.375-13.694,9.877h-17.117
+      <path
+        fill="#32324B" d="M480.628,97.634v-2.502c0-5.662-2.37-9.351-13.036-9.351c-13.298,0-13.694,7.375-13.694,9.877h-17.117
         c0-10.666,4.477-24.359,31.338-24.359c25.676,0,30.285,12.771,30.285,23.174v39.766c0,2.897,0.131,5.267,0.395,7.11l0.527,3.028
         h-18.172v-7.241c-5.134,5.134-12.245,8.163-22.384,8.163c-14.221,0-25.018-8.296-25.018-22.648c0-16.59,15.67-20.146,21.99-21.199
         L480.628,97.634z M480.628,111.195l-6.979,1.054c-3.819,0.658-8.427,1.315-11.192,1.843c-3.029,0.527-5.662,1.186-7.637,2.765
         c-1.844,1.449-2.765,3.425-2.765,5.926c0,2.107,0.79,8.69,10.666,8.69c5.793,0,10.928-2.105,13.693-4.872
         c3.556-3.555,4.214-8.032,4.214-11.587V111.195z" />
-      <polygon fill="#32324B" points="549.495,144.377 525.399,144.377 501.698,72.221 521.186,72.221 537.775,127.392 554.499,72.221
+      <polygon
+        fill="#32324B" points="549.495,144.377 525.399,144.377 501.698,72.221 521.186,72.221 537.775,127.392 554.499,72.221
         573.459,72.221 " />
-      <path fill="#32324B" d="M641.273,120.676c-2.106,14.352-13.167,24.623-32.128,24.623c-20.146,0-35.025-12.114-35.025-36.605
+      <path
+        fill="#32324B" d="M641.273,120.676c-2.106,14.352-13.167,24.623-32.128,24.623c-20.146,0-35.025-12.114-35.025-36.605
         c0-24.622,15.406-37.395,35.025-37.395c21.726,0,33.182,15.933,33.182,37.263v3.819h-49.772c0,8.031,3.291,18.17,16.327,18.17
         c7.242,0,12.904-3.555,14.354-10.27L641.273,120.676z M623.498,99.608c-0.659-10.008-7.109-13.694-14.483-13.694
         c-8.428,0-14.88,5.135-15.802,13.694H623.498z" />
-      <path fill="#32324B" d="M682.976,80.873c-7.524,0-16.896,2.376-16.896,10.692c0,17.952,46.201,1.452,46.201,30.229
+      <path
+        fill="#32324B" d="M682.976,80.873c-7.524,0-16.896,2.376-16.896,10.692c0,17.952,46.201,1.452,46.201,30.229
         c0,9.637-5.676,22.309-30.229,22.309c-19.009,0-27.721-9.636-28.249-22.44h11.881c0.264,7.788,5.147,13.332,17.688,13.332
         c14.52,0,17.952-6.204,17.952-12.54c0-13.332-24.421-7.788-37.753-15.181c-4.885-2.771-8.316-7.128-8.316-15.048
         c0-11.616,10.824-20.461,27.853-20.461c20.989,0,27.193,12.145,27.589,20.196h-11.484
         C698.685,83.381,691.556,80.873,682.976,80.873z" />
-      <path fill="#32324B" d="M756.233,134.994c10.429,0,17.953-5.939,19.009-16.632h10.957c-1.98,17.028-13.597,25.74-29.966,25.74
+      <path
+        fill="#32324B" d="M756.233,134.994c10.429,0,17.953-5.939,19.009-16.632h10.957c-1.98,17.028-13.597,25.74-29.966,25.74
         c-18.744,0-32.076-12.012-32.076-35.905c0-23.76,13.464-36.433,32.209-36.433c16.104,0,27.721,8.712,29.568,25.213h-10.956
         c-1.452-11.353-9.24-16.104-18.877-16.104c-12.012,0-20.856,8.448-20.856,27.324C735.245,127.471,744.485,134.994,756.233,134.994z
         " />
-      <path fill="#32324B" d="M830.418,144.103c-19.141,0-32.341-12.145-32.341-36.169c0-23.893,13.2-36.169,32.341-36.169
+      <path
+        fill="#32324B" d="M830.418,144.103c-19.141,0-32.341-12.145-32.341-36.169c0-23.893,13.2-36.169,32.341-36.169
         c19.009,0,32.209,12.145,32.209,36.169C862.627,132.091,849.427,144.103,830.418,144.103z M830.418,134.994
         c12.145,0,21.12-7.392,21.12-27.061c0-19.536-8.976-27.061-21.12-27.061c-12.276,0-21.253,7.393-21.253,27.061
         C809.165,127.603,818.142,134.994,830.418,134.994z" />
-      <path fill="#32324B" d="M888.629,72.688v10.692c3.96-6.732,12.54-11.616,22.969-11.616c19.009,0,30.757,12.673,30.757,36.169
+      <path
+        fill="#32324B" d="M888.629,72.688v10.692c3.96-6.732,12.54-11.616,22.969-11.616c19.009,0,30.757,12.673,30.757,36.169
         c0,23.629-12.145,36.169-31.152,36.169c-10.429,0-18.745-4.224-22.573-11.22v35.641h-10.824V72.688H888.629z M910.409,134.994
         c12.145,0,20.857-7.392,20.857-27.061c0-19.536-8.713-27.061-20.857-27.061c-12.275,0-21.912,7.393-21.912,27.061
         C888.497,127.603,898.134,134.994,910.409,134.994z" />
-      <path fill="#32324B" d="M1016.801,119.022c-1.452,12.408-10.032,25.08-30.229,25.08c-18.745,0-32.341-12.804-32.341-36.037
+      <path
+        fill="#32324B" d="M1016.801,119.022c-1.452,12.408-10.032,25.08-30.229,25.08c-18.745,0-32.341-12.804-32.341-36.037
         c0-21.912,13.464-36.301,32.209-36.301c19.8,0,30.757,14.784,30.757,38.018h-51.878c0.265,13.332,5.809,25.212,21.385,25.212
         c11.484,0,18.217-7.128,19.141-16.104L1016.801,119.022z M1005.448,101.201c-1.056-14.916-9.636-20.328-19.272-20.328
-      c-10.824,0-19.141,7.26-20.46,20.328H1005.448z" />
+        c-10.824,0-19.141,7.26-20.46,20.328H1005.448z" />
     </g>
   );
 }
diff --git a/client/app/scripts/components/matched-results.js b/client/app/scripts/components/matched-results.js
index 48ed8f3fd..24c23dbec 100644
--- a/client/app/scripts/components/matched-results.js
+++ b/client/app/scripts/components/matched-results.js
@@ -18,7 +18,9 @@ class MatchedResults extends React.Component {
           <span className="matched-results-match-label">
             {match.label}:
           </span>
-          <MatchedText text={text} match={match} maxLength={MAX_MATCH_LENGTH}
+          <MatchedText
+            text={text} match={match}
+            maxLength={MAX_MATCH_LENGTH}
             truncate={match.truncate} />
         </div>
       </div>
diff --git a/client/app/scripts/components/metric-selector-item.js b/client/app/scripts/components/metric-selector-item.js
index 9c6e4481c..3bce457ec 100644
--- a/client/app/scripts/components/metric-selector-item.js
+++ b/client/app/scripts/components/metric-selector-item.js
@@ -45,7 +45,7 @@ class MetricSelectorItem extends React.Component {
         onMouseOver={this.onMouseOver}
         onClick={this.onMouseClick}>
         {metric.get('label')}
-        {isPinned && <span className="fa fa-thumb-tack"></span>}
+        {isPinned && <span className="fa fa-thumb-tack" />}
       </div>
     );
   }
diff --git a/client/app/scripts/components/network-selector-item.js b/client/app/scripts/components/network-selector-item.js
index fbd747c26..44043402e 100644
--- a/client/app/scripts/components/network-selector-item.js
+++ b/client/app/scripts/components/network-selector-item.js
@@ -50,7 +50,7 @@ class NetworkSelectorItem extends React.Component {
         onClick={this.onMouseClick}
         style={style}>
         {network.get('label')}
-        {isPinned && <span className="fa fa-thumb-tack"></span>}
+        {isPinned && <span className="fa fa-thumb-tack" />}
       </div>
     );
   }
diff --git a/client/app/scripts/components/node-details.js b/client/app/scripts/components/node-details.js
index 4e7f7ee6a..87831c16a 100644
--- a/client/app/scripts/components/node-details.js
+++ b/client/app/scripts/components/node-details.js
@@ -20,7 +20,7 @@ function getTruncationText(count) {
   + ` (${count} extra entries not included). We are working to remove this limitation.`;
 }
 
-export class NodeDetails extends React.Component {
+class NodeDetails extends React.Component {
 
   constructor(props, context) {
     super(props, context);
@@ -53,8 +53,10 @@ export class NodeDetails extends React.Component {
     return (
       <div className="node-details-tools-wrapper">
         <div className="node-details-tools">
-          {showSwitchTopology && <span title={topologyTitle}
-            className="fa fa-long-arrow-left" onClick={this.handleShowTopologyForNode}>
+          {showSwitchTopology && <span
+            title={topologyTitle}
+            className="fa fa-long-arrow-left"
+            onClick={this.handleShowTopologyForNode}>
             <span>Show in <span>{this.props.topologyId.replace(/-/g, ' ')}</span></span>
           </span>}
           <span title="Close details" className="fa fa-close" onClick={this.handleClickClose} />
@@ -168,7 +170,8 @@ export class NodeDetails extends React.Component {
         </div>
 
         {showControls && <div className="node-details-controls-wrapper" style={styles.controls}>
-          <NodeDetailsControls nodeId={this.props.nodeId}
+          <NodeDetailsControls
+            nodeId={this.props.nodeId}
             controls={details.controls}
             pending={pending}
             error={error} />
@@ -184,18 +187,21 @@ export class NodeDetails extends React.Component {
             <NodeDetailsInfo rows={details.metadata} matches={nodeMatches.get('metadata')} />
           </div>}
 
-          {details.connections && details.connections.map(connections => <div
-            className="node-details-content-section" key={connections.id}>
-              <NodeDetailsTable {...connections} nodes={connections.connections}
-                nodeIdKey="nodeId" />
+          {details.connections && details.connections.map(connections => (
+            <div className="node-details-content-section" key={connections.id}>
+              <NodeDetailsTable
+                {...connections}
+                nodes={connections.connections}
+                nodeIdKey="nodeId"
+              />
             </div>
-          )}
+          ))}
 
-          {details.children && details.children.map(children => <div
-            className="node-details-content-section" key={children.topologyId}>
+          {details.children && details.children.map(children => (
+            <div className="node-details-content-section" key={children.topologyId}>
               <NodeDetailsTable {...children} />
             </div>
-          )}
+          ))}
 
           {details.tables && details.tables.length > 0 && details.tables.map(table => {
             if (table.rows.length > 0) {
@@ -208,7 +214,8 @@ export class NodeDetails extends React.Component {
                       <Warning text={getTruncationText(table.truncationCount)} />
                     </span>}
                   </div>
-                  <NodeDetailsLabels rows={table.rows} controls={table.controls}
+                  <NodeDetailsLabels
+                    rows={table.rows} controls={table.controls}
                     matches={nodeMatches.get('tables')} />
                 </div>
               );
diff --git a/client/app/scripts/components/node-details/node-details-controls.js b/client/app/scripts/components/node-details/node-details-controls.js
index 87a45df99..9c6d828c7 100644
--- a/client/app/scripts/components/node-details/node-details-controls.js
+++ b/client/app/scripts/components/node-details/node-details-controls.js
@@ -21,7 +21,7 @@ export default function NodeDetailsControls({controls, error, nodeId, pending})
         {sortBy(controls, 'rank').map(control => <NodeDetailsControlButton
           nodeId={nodeId} control={control} pending={pending} key={control.id} />)}
       </span>
-      {controls && <span title="Applying..." className={spinnerClassName}></span>}
+      {controls && <span title="Applying..." className={spinnerClassName} />}
     </div>
   );
 }
diff --git a/client/app/scripts/components/node-details/node-details-health-item.js b/client/app/scripts/components/node-details/node-details-health-item.js
index f418220d6..04767a00c 100644
--- a/client/app/scripts/components/node-details/node-details-health-item.js
+++ b/client/app/scripts/components/node-details/node-details-health-item.js
@@ -6,9 +6,10 @@ import { formatMetric } from '../../utils/string-utils';
 function NodeDetailsHealthItem(props) {
   return (
     <div className="node-details-health-item">
-    <div className="node-details-health-item-value">{formatMetric(props.value, props)}</div>
+      <div className="node-details-health-item-value">{formatMetric(props.value, props)}</div>
       <div className="node-details-health-item-sparkline">
-        <Sparkline data={props.samples} max={props.max} format={props.format}
+        <Sparkline
+          data={props.samples} max={props.max} format={props.format}
           first={props.first} last={props.last} />
       </div>
       <div className="node-details-health-item-label">{props.label}</div>
diff --git a/client/app/scripts/components/node-details/node-details-health.js b/client/app/scripts/components/node-details/node-details-health.js
index 18831c2d8..c51556264 100644
--- a/client/app/scripts/components/node-details/node-details-health.js
+++ b/client/app/scripts/components/node-details/node-details-health.js
@@ -33,10 +33,13 @@ export default class NodeDetailsHealth extends React.Component {
       <div className="node-details-health" style={{flexWrap, justifyContent}}>
         <div className="node-details-health-wrapper">
           {primeMetrics.map(item => <NodeDetailsHealthItem key={item.id} {...item} />)}
-          {showOverflow && <NodeDetailsHealthOverflow items={overflowMetrics}
-            handleClick={this.handleClickMore} />}
+          {showOverflow && <NodeDetailsHealthOverflow
+            items={overflowMetrics}
+            handleClick={this.handleClickMore}
+          />}
         </div>
-        <ShowMore handleClick={this.handleClickMore} collection={this.props.metrics}
+        <ShowMore
+          handleClick={this.handleClickMore} collection={this.props.metrics}
           expanded={this.state.expanded} notShown={notShown} hideNumber />
       </div>
     );
diff --git a/client/app/scripts/components/node-details/node-details-info.js b/client/app/scripts/components/node-details/node-details-info.js
index 7c2ce1758..7edf3486c 100644
--- a/client/app/scripts/components/node-details/node-details-info.js
+++ b/client/app/scripts/components/node-details/node-details-info.js
@@ -54,7 +54,8 @@ export default class NodeDetailsInfo extends React.Component {
             </div>
           );
         })}
-        <ShowMore handleClick={this.handleClickMore} collection={this.props.rows}
+        <ShowMore
+          handleClick={this.handleClickMore} collection={this.props.rows}
           expanded={this.state.expanded} notShown={notShown} />
       </div>
     );
diff --git a/client/app/scripts/components/node-details/node-details-labels.js b/client/app/scripts/components/node-details/node-details-labels.js
index b3928a50f..fa3fb0850 100644
--- a/client/app/scripts/components/node-details/node-details-labels.js
+++ b/client/app/scripts/components/node-details/node-details-labels.js
@@ -50,9 +50,11 @@ export default class NodeDetailsLabels extends React.Component {
     return (
       <div className="node-details-labels">
         {controls && this.renderControls(controls)}
-        {rows.map(field => (<div className="node-details-labels-field" key={field.id}>
-            <div className="node-details-labels-field-label truncate" title={field.label}
-              key={field.id}>
+        {rows.map(field => (
+          <div className="node-details-labels-field" key={field.id}>
+            <div
+              className="node-details-labels-field-label truncate"
+              title={field.label} key={field.id}>
               {field.label}
             </div>
             <div className="node-details-labels-field-value truncate" title={field.value}>
@@ -60,7 +62,8 @@ export default class NodeDetailsLabels extends React.Component {
             </div>
           </div>
         ))}
-        <ShowMore handleClick={this.handleLimitClick} collection={this.props.rows}
+        <ShowMore
+          handleClick={this.handleLimitClick} collection={this.props.rows}
           expanded={expanded} notShown={notShown} />
       </div>
     );
diff --git a/client/app/scripts/components/node-details/node-details-relatives.js b/client/app/scripts/components/node-details/node-details-relatives.js
index 06c3038a5..26cef8a78 100644
--- a/client/app/scripts/components/node-details/node-details-relatives.js
+++ b/client/app/scripts/components/node-details/node-details-relatives.js
@@ -39,8 +39,11 @@ export default class NodeDetailsRelatives extends React.Component {
             key={relative.id}
             match={matches.get(relative.id)}
             {...relative} />))}
-        {showLimitAction && <span className="node-details-relatives-more"
-          onClick={this.handleLimitClick}>{limitActionText}</span>}
+        {showLimitAction && <span
+          className="node-details-relatives-more"
+          onClick={this.handleLimitClick}>
+          {limitActionText}
+        </span>}
       </div>
     );
   }
diff --git a/client/app/scripts/components/node-details/node-details-table-node-link.js b/client/app/scripts/components/node-details/node-details-table-node-link.js
index af66e9609..2b080afc2 100644
--- a/client/app/scripts/components/node-details/node-details-table-node-link.js
+++ b/client/app/scripts/components/node-details/node-details-table-node-link.js
@@ -23,8 +23,9 @@ class NodeDetailsTableNodeLink extends React.Component {
 
     if (linkable) {
       return (
-        <span className="node-details-table-node-link" title={title}
-          onClick={this.handleClick}>
+        <span
+          className="node-details-table-node-link"
+          title={title} onClick={this.handleClick}>
           {label}
         </span>
       );
diff --git a/client/app/scripts/components/node-details/node-details-table-row.js b/client/app/scripts/components/node-details/node-details-table-row.js
index 2a9f9e3eb..402cc7795 100644
--- a/client/app/scripts/components/node-details/node-details-table-row.js
+++ b/client/app/scripts/components/node-details/node-details-table-row.js
@@ -40,7 +40,9 @@ function renderValues(node, columns = [], columnStyles = []) {
       if (field.valueType === 'metadata') {
         const {value, title} = formatDataType(field);
         return (
-          <td className="node-details-table-node-value truncate" title={title}
+          <td
+            className="node-details-table-node-value truncate"
+            title={title}
             style={style}
             key={field.id}>
             {value}
@@ -49,7 +51,9 @@ function renderValues(node, columns = [], columnStyles = []) {
       }
       if (field.valueType === 'relatives') {
         return (
-          <td className="node-details-table-node-value truncate" title={field.value}
+          <td
+            className="node-details-table-node-value truncate"
+            title={field.value}
             style={style}
             key={field.id}>
             {<NodeDetailsTableNodeLink linkable nodeId={field.relative.id} {...field.relative} />}
@@ -132,8 +136,9 @@ export default class NodeDetailsTableRow extends React.Component {
         onMouseEnter={onMouseEnterRow && this.onMouseEnter}
         onMouseLeave={onMouseLeaveRow && this.onMouseLeave}
         className={className}>
-        <td ref={this.storeLabelRef} className="node-details-table-node-label truncate"
-          style={firstColumnStyle}>
+        <td
+          className="node-details-table-node-label truncate"
+          ref={this.storeLabelRef} style={firstColumnStyle}>
           {this.props.renderIdCell(Object.assign(node, {topologyId, nodeId}))}
         </td>
         {values}
diff --git a/client/app/scripts/components/node-details/node-details-table.js b/client/app/scripts/components/node-details/node-details-table.js
index 1b464fe05..7eeb6a74d 100644
--- a/client/app/scripts/components/node-details/node-details-table.js
+++ b/client/app/scripts/components/node-details/node-details-table.js
@@ -243,7 +243,8 @@ export default class NodeDetailsTable extends React.Component {
             header.label;
 
           return (
-            <td className={headerClasses.join(' ')} style={style} onClick={onHeaderClick}
+            <td
+              className={headerClasses.join(' ')} style={style} onClick={onHeaderClick}
               title={header.label} key={header.id}>
               {isSortedAsc
                 && <span className="node-details-table-header-sorter fa fa-caret-up" />}
@@ -278,14 +279,15 @@ export default class NodeDetailsTable extends React.Component {
     const className = classNames('node-details-table-wrapper-wrapper', this.props.className);
 
     return (
-      <div className={className}
-        style={this.props.style}>
+      <div className={className} style={this.props.style}>
         <div className="node-details-table-wrapper">
           <table className="node-details-table">
             <thead>
               {this.renderHeaders(sortedBy, sortedDesc)}
             </thead>
-            <tbody style={this.props.tbodyStyle} onMouseEnter={onMouseEnter}
+            <tbody
+              style={this.props.tbodyStyle}
+              onMouseEnter={onMouseEnter}
               onMouseLeave={onMouseLeave}>
               {nodes && nodes.map(node => (
                 <NodeDetailsTableRow
diff --git a/client/app/scripts/components/nodes.js b/client/app/scripts/components/nodes.js
index 1aa054ee9..2b9afac12 100644
--- a/client/app/scripts/components/nodes.js
+++ b/client/app/scripts/components/nodes.js
@@ -63,13 +63,8 @@ class Nodes extends React.Component {
         {this.renderEmptyTopologyError(topologiesLoaded && nodesLoaded && topologyEmpty)}
 
         {gridMode ?
-          <NodesGrid {...this.state}
-            nodeSize="24"
-            margins={CANVAS_MARGINS}
-          /> :
-         <NodesChart {...this.state}
-           margins={CANVAS_MARGINS}
-           />}
+          <NodesGrid {...this.state} nodeSize="24" margins={CANVAS_MARGINS} /> :
+          <NodesChart {...this.state} margins={CANVAS_MARGINS} />}
       </div>
     );
   }
diff --git a/client/app/scripts/components/search.js b/client/app/scripts/components/search.js
index 1164baae1..63bd0d899 100644
--- a/client/app/scripts/components/search.js
+++ b/client/app/scripts/components/search.js
@@ -90,9 +90,9 @@ class Search extends React.Component {
 
   componentDidUpdate() {
     if (this.props.searchFocused) {
-      ReactDOM.findDOMNode(this.refs.queryInput).focus();
+      ReactDOM.findDOMNode(this.queryInput).focus();
     } else if (!this.state.value) {
-      ReactDOM.findDOMNode(this.refs.queryInput).blur();
+      ReactDOM.findDOMNode(this.queryInput).blur();
     }
   }
 
@@ -121,13 +121,14 @@ class Search extends React.Component {
           <div className="search-input">
             {showPinnedSearches && pinnedSearches.toIndexedSeq()
               .map(query => <SearchItem query={query} key={query} />)}
-            <input className="search-input-field" type="text" id={inputId}
+            <input
+              className="search-input-field" type="text" id={inputId}
               value={value} onChange={this.handleChange}
               onFocus={this.handleFocus} onBlur={this.handleBlur}
-              disabled={disabled} ref="queryInput" />
+              disabled={disabled} ref={(c) => { this.queryInput = c; }} />
           </div>
           <div className="search-label">
-            <i className="fa fa-search search-label-icon"></i>
+            <i className="fa fa-search search-label-icon" />
             <label className="search-label-hint" htmlFor={inputId}>
               Search
             </label>
diff --git a/client/app/scripts/components/sparkline.js b/client/app/scripts/components/sparkline.js
index ea23e9dfd..0c3483dbf 100644
--- a/client/app/scripts/components/sparkline.js
+++ b/client/app/scripts/components/sparkline.js
@@ -81,10 +81,14 @@ export default class Sparkline extends React.Component {
     return (
       <div title={title}>
         <svg width={this.props.width} height={this.props.height}>
-          <path className="sparkline" fill="none" stroke={this.props.strokeColor}
-            strokeWidth={this.props.strokeWidth} ref="path" d={this.line(data)} />
-          <circle className="sparkcircle" cx={lastX} cy={lastY} fill="#46466a"
-            fillOpacity="0.6" stroke="none" r={this.props.circleDiameter} />
+          <path
+            className="sparkline" fill="none" stroke={this.props.strokeColor}
+            strokeWidth={this.props.strokeWidth} d={this.line(data)}
+          />
+          <circle
+            className="sparkcircle" cx={lastX} cy={lastY} fill="#46466a"
+            fillOpacity="0.6" stroke="none" r={this.props.circleDiameter}
+          />
         </svg>
       </div>
     );
diff --git a/client/app/scripts/components/terminal.js b/client/app/scripts/components/terminal.js
index af2ce51da..1c6be169d 100644
--- a/client/app/scripts/components/terminal.js
+++ b/client/app/scripts/components/terminal.js
@@ -5,12 +5,12 @@ import ReactDOM from 'react-dom';
 import { connect } from 'react-redux';
 import classNames from 'classnames';
 import { debounce } from 'lodash';
+import Term from 'xterm';
 
 import { clickCloseTerminal } from '../actions/app-actions';
 import { getNeutralColor } from '../utils/color-utils';
 import { setDocumentTitle } from '../utils/title-utils';
 import { getPipeStatus, basePath, doResizeTty } from '../utils/web-api-utils';
-import Term from 'xterm';
 
 const wsProto = location.protocol === 'https:' ? 'wss' : 'ws';
 const wsUrl = `${wsProto}://${location.host}${basePath(location.pathname)}`;
@@ -313,7 +313,8 @@ class Terminal extends React.Component {
             onClick={this.handlePopoutTerminal}>
           Pop out
           </span>
-          <span title="Close" className="terminal-header-tools-item-icon fa fa-close"
+          <span
+            title="Close" className="terminal-header-tools-item-icon fa fa-close"
             onClick={this.handleCloseClick} />
         </div>
         <span className="terminal-header-title">{this.getTitle()}</span>
diff --git a/client/app/scripts/components/topologies.js b/client/app/scripts/components/topologies.js
index 8ffcc77aa..08cb6fec2 100644
--- a/client/app/scripts/components/topologies.js
+++ b/client/app/scripts/components/topologies.js
@@ -28,7 +28,8 @@ class Topologies extends React.Component {
     });
 
     return (
-      <div className={className} title={title} key={topologyId} rel={topologyId}
+      <div
+        className={className} title={title} key={topologyId} rel={topologyId}
         onClick={this.onTopologyClick}>
         <div className="topologies-sub-item-label">
           {subTopology.get('name')}
diff --git a/client/app/scripts/contrast-main.js b/client/app/scripts/contrast-main.js
index 707094e18..d90655cee 100644
--- a/client/app/scripts/contrast-main.js
+++ b/client/app/scripts/contrast-main.js
@@ -1,13 +1,13 @@
-require('font-awesome-webpack');
-require('../styles/contrast.less');
-require('../images/favicon.ico');
-
 import 'babel-polyfill';
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { Provider } from 'react-redux';
 import configureStore from './stores/configureStore';
 
+require('font-awesome-webpack');
+require('../styles/contrast.less');
+require('../images/favicon.ico');
+
 const store = configureStore();
 
 function renderApp() {
diff --git a/client/app/scripts/main.dev.js b/client/app/scripts/main.dev.js
index 6a354bf6d..87ef7e862 100644
--- a/client/app/scripts/main.dev.js
+++ b/client/app/scripts/main.dev.js
@@ -1,17 +1,17 @@
-require('font-awesome-webpack');
-require('../styles/main.less');
-require('../images/favicon.ico');
-
 import 'babel-polyfill';
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { Provider } from 'react-redux';
-import configureStore from './stores/configureStore.dev';
-
-import DevTools from './components/dev-tools';
 import Immutable from 'immutable';
 import installDevTools from 'immutable-devtools';
 
+import configureStore from './stores/configureStore.dev';
+import DevTools from './components/dev-tools';
+
+require('font-awesome-webpack');
+require('../styles/main.less');
+require('../images/favicon.ico');
+
 installDevTools(Immutable);
 const store = configureStore();
 
diff --git a/client/app/scripts/main.js b/client/app/scripts/main.js
index a7c74057f..8b55fcfcd 100644
--- a/client/app/scripts/main.js
+++ b/client/app/scripts/main.js
@@ -1,13 +1,13 @@
-require('font-awesome-webpack');
-require('../styles/main.less');
-require('../images/favicon.ico');
-
 import 'babel-polyfill';
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { Provider } from 'react-redux';
 import configureStore from './stores/configureStore';
 
+require('font-awesome-webpack');
+require('../styles/main.less');
+require('../images/favicon.ico');
+
 const store = configureStore();
 
 function renderApp() {
diff --git a/client/app/scripts/terminal-main.js b/client/app/scripts/terminal-main.js
index 149c80128..5b1864844 100644
--- a/client/app/scripts/terminal-main.js
+++ b/client/app/scripts/terminal-main.js
@@ -1,12 +1,12 @@
-require('../styles/main.less');
-require('../images/favicon.ico');
-
 import 'babel-polyfill';
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { Provider } from 'react-redux';
 import configureStore from './stores/configureStore';
 
+require('../styles/main.less');
+require('../images/favicon.ico');
+
 const store = configureStore();
 
 function renderApp() {
diff --git a/client/app/scripts/utils/color-utils.js b/client/app/scripts/utils/color-utils.js
index c728c1088..676d7af04 100644
--- a/client/app/scripts/utils/color-utils.js
+++ b/client/app/scripts/utils/color-utils.js
@@ -17,7 +17,7 @@ const letterRange = endLetterRange - startLetterRange;
 export function text2degree(text) {
   const input = text.substr(0, 2).toUpperCase();
   let num = 0;
-  for (let i = 0; i < input.length; i++) {
+  for (let i = 0; i < input.length; i += 1) {
     const charCode = Math.max(Math.min(input[i].charCodeAt(), endLetterRange), startLetterRange);
     num += Math.pow(letterRange, input.length - i - 1) * (charCode - startLetterRange);
   }
diff --git a/client/app/scripts/utils/file-utils.js b/client/app/scripts/utils/file-utils.js
index e01723560..d44203746 100644
--- a/client/app/scripts/utils/file-utils.js
+++ b/client/app/scripts/utils/file-utils.js
@@ -55,8 +55,7 @@ function setInlineStyles(svg, target, emptySvgDeclarationComputed) {
   // hardcode computed css styles inside svg
   const allElements = traverse(svg);
   const allTargetElements = traverse(target);
-  let i = allElements.length;
-  while (i--) {
+  for (let i = allElements.length - 1; i >= 0; i -= 1) {
     explicitlySetStyle(allElements[i], allTargetElements[i]);
   }
 
diff --git a/client/app/scripts/utils/metric-utils.js b/client/app/scripts/utils/metric-utils.js
index a686d4df0..2515d5b89 100644
--- a/client/app/scripts/utils/metric-utils.js
+++ b/client/app/scripts/utils/metric-utils.js
@@ -1,9 +1,9 @@
 import { includes } from 'lodash';
 import { scaleLog } from 'd3-scale';
-import { formatMetricSvg } from './string-utils';
-import { colors } from './color-utils';
 import React from 'react';
 
+import { formatMetricSvg } from './string-utils';
+import { colors } from './color-utils';
 
 export function getClipPathDefinition(clipId, size, height,
   x = -size * 0.5, y = size * 0.5 - height) {