Merge pull request #1171 from weaveworks/npm-updates

React/lodash/babel upgrades + updated linting (linted)
weaveworks · Mar 16, 2016 · d9938c8 · d9938c8
2 parents 88c39e2 + e4270f6
commit d9938c8
Show file tree

Hide file tree

Showing 49 changed files with 932 additions and 984 deletions.
diff --git a/client/.eslintrc b/client/.eslintrc
@@ -7,7 +7,8 @@
   },
   "rules": {
     "comma-dangle": 0,
-    "func-names": 0,
+    "object-curly-spacing": 0,
+    "react/jsx-closing-bracket-location": 0,
     "react/sort-comp": 0,
     "react/prop-types": 0
   }

diff --git a/client/app/scripts/actions/app-actions.js b/client/app/scripts/actions/app-actions.js
@@ -15,9 +15,9 @@ const log = debug('scope:app-actions');
 export function changeTopologyOption(option, value, topologyId) {
   AppDispatcher.dispatch({
     type: ActionTypes.CHANGE_TOPOLOGY_OPTION,
-    topologyId: topologyId,
-    option: option,
-    value: value
+    topologyId,
+    option,
+    value
   });
   updateRoute();
   // update all request workers with new options
@@ -53,7 +53,7 @@ export function clickCloseDetails(nodeId) {
 export function clickCloseTerminal(pipeId, closePipe) {
   AppDispatcher.dispatch({
     type: ActionTypes.CLICK_CLOSE_TERMINAL,
-    pipeId: pipeId
+    pipeId
   });
   if (closePipe) {
     deletePipe(pipeId);
@@ -130,7 +130,7 @@ export function clickShowTopologyForNode(topologyId, nodeId) {
 export function clickTopology(topologyId) {
   AppDispatcher.dispatch({
     type: ActionTypes.CLICK_TOPOLOGY,
-    topologyId: topologyId
+    topologyId
   });
   updateRoute();
   resetUpdateBuffer();
@@ -149,7 +149,7 @@ export function openWebsocket() {
 export function clearControlError(nodeId) {
   AppDispatcher.dispatch({
     type: ActionTypes.CLEAR_CONTROL_ERROR,
-    nodeId: nodeId
+    nodeId
   });
 }
 
@@ -162,22 +162,22 @@ export function closeWebsocket() {
 export function doControl(nodeId, control) {
   AppDispatcher.dispatch({
     type: ActionTypes.DO_CONTROL,
-    nodeId: nodeId
+    nodeId
   });
   doControlRequest(nodeId, control);
 }
 
 export function enterEdge(edgeId) {
   AppDispatcher.dispatch({
     type: ActionTypes.ENTER_EDGE,
-    edgeId: edgeId
+    edgeId
   });
 }
 
 export function enterNode(nodeId) {
   AppDispatcher.dispatch({
     type: ActionTypes.ENTER_NODE,
-    nodeId: nodeId
+    nodeId
   });
 }
 
@@ -191,44 +191,44 @@ export function hitEsc() {
     updateRoute();
     // Dont deselect node on ESC if there is a controlPipe (keep terminal open)
   } else if (AppStore.getTopCardNodeId() && !controlPipe) {
-    AppDispatcher.dispatch({type: ActionTypes.DESELECT_NODE});
+    AppDispatcher.dispatch({ type: ActionTypes.DESELECT_NODE });
     updateRoute();
   }
 }
 
 export function leaveEdge(edgeId) {
   AppDispatcher.dispatch({
     type: ActionTypes.LEAVE_EDGE,
-    edgeId: edgeId
+    edgeId
   });
 }
 
 export function leaveNode(nodeId) {
   AppDispatcher.dispatch({
     type: ActionTypes.LEAVE_NODE,
-    nodeId: nodeId
+    nodeId
   });
 }
 
 export function receiveControlError(nodeId, err) {
   AppDispatcher.dispatch({
     type: ActionTypes.DO_CONTROL_ERROR,
-    nodeId: nodeId,
+    nodeId,
     error: err
   });
 }
 
 export function receiveControlSuccess(nodeId) {
   AppDispatcher.dispatch({
     type: ActionTypes.DO_CONTROL_SUCCESS,
-    nodeId: nodeId
+    nodeId
   });
 }
 
 export function receiveNodeDetails(details) {
   AppDispatcher.dispatch({
     type: ActionTypes.RECEIVE_NODE_DETAILS,
-    details: details
+    details
   });
 }
 
@@ -238,15 +238,15 @@ export function receiveNodesDelta(delta) {
   } else {
     AppDispatcher.dispatch({
       type: ActionTypes.RECEIVE_NODES_DELTA,
-      delta: delta
+      delta
     });
   }
 }
 
 export function receiveTopologies(topologies) {
   AppDispatcher.dispatch({
     type: ActionTypes.RECEIVE_TOPOLOGIES,
-    topologies: topologies
+    topologies
   });
   getNodesDelta(
     AppStore.getCurrentTopologyUrl(),
@@ -270,8 +270,8 @@ export function receiveControlPipeFromParams(pipeId, rawTty) {
   // TODO add nodeId
   AppDispatcher.dispatch({
     type: ActionTypes.RECEIVE_CONTROL_PIPE,
-    pipeId: pipeId,
-    rawTty: rawTty
+    pipeId,
+    rawTty
   });
 }
 
@@ -289,9 +289,9 @@ export function receiveControlPipe(pipeId, nodeId, rawTty) {
 
   AppDispatcher.dispatch({
     type: ActionTypes.RECEIVE_CONTROL_PIPE,
-    nodeId: nodeId,
-    pipeId: pipeId,
-    rawTty: rawTty
+    nodeId,
+    pipeId,
+    rawTty
   });
 
   updateRoute();
@@ -300,14 +300,14 @@ export function receiveControlPipe(pipeId, nodeId, rawTty) {
 export function receiveControlPipeStatus(pipeId, status) {
   AppDispatcher.dispatch({
     type: ActionTypes.RECEIVE_CONTROL_PIPE_STATUS,
-    pipeId: pipeId,
-    status: status
+    pipeId,
+    status
   });
 }
 
 export function receiveError(errorUrl) {
   AppDispatcher.dispatch({
-    errorUrl: errorUrl,
+    errorUrl,
     type: ActionTypes.RECEIVE_ERROR
   });
 }
@@ -321,7 +321,7 @@ export function receiveNotFound(nodeId) {
 
 export function route(state) {
   AppDispatcher.dispatch({
-    state: state,
+    state,
     type: ActionTypes.ROUTE_TOPOLOGY
   });
   getTopologies(

diff --git a/client/app/scripts/charts/edge.js b/client/app/scripts/charts/edge.js
@@ -7,23 +7,23 @@ import { enterEdge, leaveEdge } from '../actions/app-actions';
 
 const line = d3.svg.line()
   .interpolate('basis')
-  .x(function(d) { return d.x; })
-  .y(function(d) { return d.y; });
+  .x(d => d.x)
+  .y(d => d.y);
 
-const animConfig = [80, 20];// stiffness, bounce
+const animConfig = {stiffness: 80, damping: 20};
 
-const flattenPoints = function(points) {
+const flattenPoints = points => {
   const flattened = {};
-  points.forEach(function(point, i) {
-    flattened['x' + i] = spring(point.x, animConfig);
-    flattened['y' + i] = spring(point.y, animConfig);
+  points.forEach((point, i) => {
+    flattened[`x${i}`] = spring(point.x, animConfig);
+    flattened[`y${i}`] = spring(point.y, animConfig);
   });
   return flattened;
 };
 
-const extractPoints = function(points) {
+const extractPoints = points => {
   const extracted = [];
-  _.each(points, function(value, key) {
+  _.each(points, (value, key) => {
     const axis = key[0];
     const index = key.slice(1);
     if (!extracted[index]) {
@@ -70,10 +70,11 @@ export default class Edge extends React.Component {
 
     return (
       <Motion style={points}>
-        {function(interpolated) {
+        {(interpolated) => {
           const path = line(extractPoints(interpolated));
           return (
-            <g className={classes} onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave} id={props.id}>
+            <g className={classes} onMouseEnter={handleMouseEnter}
+              onMouseLeave={handleMouseLeave} id={props.id}>
               <path d={path} className="shadow" />
               <path d={path} className="link" />
             </g>

diff --git a/client/app/scripts/charts/node-shape-cloud.js b/client/app/scripts/charts/node-shape-cloud.js
@@ -3,7 +3,11 @@ import d3 from 'd3';
 
 import { isContrastMode } from '../utils/contrast-utils';
 
-const CLOUD_PATH = 'M 1920,384 Q 1920,225 1807.5,112.5 1695,0 1536,0 H 448 Q 263,0 131.5,131.5 0,263 0,448 0,580 71,689.5 142,799 258,853 q -2,28 -2,43 0,212 150,362 150,150 362,150 158,0 286.5,-88 128.5,-88 187.5,-230 70,62 166,62 106,0 181,-75 75,-75 75,-181 0,-75 -41,-138 129,-30 213,-134.5 84,-104.5 84,-239.5 z';
+const CLOUD_PATH = 'M 1920,384 Q 1920,225 1807.5,112.5 1695,0 1536,0 H 448 '
+  + 'Q 263,0 131.5,131.5 0,263 0,448 0,580 71,689.5 142,799 258,853 '
+  + 'q -2,28 -2,43 0,212 150,362 150,150 362,150 158,0 286.5,-88 128.5,-88 '
+  + '187.5,-230 70,62 166,62 106,0 181,-75 75,-75 75,-181 0,-75 -41,-138 '
+  + '129,-30 213,-134.5 84,-104.5 84,-239.5 z';
 
 function toPoint(stringPair) {
   return stringPair.split(',').map(p => parseFloat(p, 10));
@@ -24,14 +28,12 @@ export default function NodeShapeCloud({highlighted, size, color}) {
   const baseScale = (size * 2) / pathSize;
   const strokeWidth = isContrastMode() ? 6 / baseScale : 4 / baseScale;
 
-  const pathProps = (v) => {
-    return {
-      d: CLOUD_PATH,
-      fill: 'none',
-      transform: `scale(-${v * baseScale}) translate(-${cx},-${cy})`,
-      strokeWidth
-    };
-  };
+  const pathProps = v => ({
+    d: CLOUD_PATH,
+    fill: 'none',
+    transform: `scale(-${v * baseScale}) translate(-${cx},-${cy})`,
+    strokeWidth
+  });
 
   return (
     <g className="shape shape-cloud">

diff --git a/client/app/scripts/charts/node-shape-heptagon.js b/client/app/scripts/charts/node-shape-heptagon.js
@@ -16,12 +16,10 @@ function polygon(r, sides) {
 
 export default function NodeShapeHeptagon({onlyHighlight, highlighted, size, color}) {
   const scaledSize = size * 1.0;
-  const pathProps = (v) => {
-    return {
-      d: line(polygon(scaledSize * v, 7)),
-      transform: `rotate(90)`
-    };
-  };
+  const pathProps = v => ({
+    d: line(polygon(scaledSize * v, 7)),
+    transform: 'rotate(90)'
+  });
 
   const hightlightNode = <path className="highlighted" {...pathProps(0.7)} />;
 
@@ -42,4 +40,3 @@ export default function NodeShapeHeptagon({onlyHighlight, highlighted, size, col
     </g>
   );
 }
-
diff --git a/client/app/scripts/charts/node-shape-hex.js b/client/app/scripts/charts/node-shape-hex.js
@@ -25,12 +25,10 @@ function getPoints(h) {
 
 
 export default function NodeShapeHex({onlyHighlight, highlighted, size, color}) {
-  const pathProps = (v) => {
-    return {
-      d: getPoints(size * v * 2),
-      transform: `rotate(90) translate(-${size * getWidth(v)}, -${size * v})`
-    };
-  };
+  const pathProps = v => ({
+    d: getPoints(size * v * 2),
+    transform: `rotate(90) translate(-${size * getWidth(v)}, -${size * v})`
+  });
 
   const hightlightNode = <path className="highlighted" {...pathProps(0.7)} />;
 

diff --git a/client/app/scripts/charts/node-shape-square.js b/client/app/scripts/charts/node-shape-square.js
@@ -1,15 +1,13 @@
 import React from 'react';
 
 export default function NodeShapeSquare({onlyHighlight, highlighted, size, color, rx = 0, ry = 0}) {
-  const rectProps = (v) => {
-    return {
-      width: v * size * 2,
-      height: v * size * 2,
-      rx: v * size * rx,
-      ry: v * size * ry,
-      transform: `translate(-${size * v}, -${size * v})`
-    };
-  };
+  const rectProps = v => ({
+    width: v * size * 2,
+    height: v * size * 2,
+    rx: v * size * rx,
+    ry: v * size * ry,
+    transform: `translate(-${size * v}, -${size * v})`
+  });
 
   const hightlightNode = <rect className="highlighted" {...rectProps(0.7)} />;