clean up unused color param, use mapEntries instead of map to fix positioning

src/components/monitor-list/monitor-list.jsx

@@ -13,7 +13,7 @@ const MonitorList = props => (
     >
         {props.monitors.valueSeq().map(monitorData => (
             <Monitor
-                color={monitorData.color}
+                category={monitorData.category}
                 key={monitorData.id}
                 label={monitorData.label}
                 value={monitorData.value}

src/lib/monitor-adapter.js

@@ -11,16 +11,17 @@ const MONITOR_HEIGHT = 23;
 
 const isUndefined = a => typeof a === 'undefined';
 
-module.exports = function ({id, opcode, params, value, x, y}) {
+module.exports = function ([key, {id, opcode, params, value, x, y}], index) {
     let {label, category, labelFn} = OpcodeLabels(opcode);
 
     // Use labelFn if provided for dynamic labelling (e.g. variables)
     if (!isUndefined(labelFn)) label = labelFn(params);
 
-    // @todo fix layout
-    const index = 0;
+    // Simple layout if x or y are undefined
+    // @todo scratch2 has a more complex layout behavior we may want to adopt
+    // @todo e.g. this does not work well when monitors have already been moved
     if (isUndefined(x)) x = PADDING;
     if (isUndefined(y)) y = PADDING + (index * (PADDING + MONITOR_HEIGHT));
 
-    return MonitorRecord({id, label, category, value, x, y});
+    return [key, MonitorRecord({id, label, category, value, x, y})];
 };

src/lib/monitor-record.js

@@ -5,7 +5,6 @@ const MonitorRecord = Record({
     label: null,
     value: null,
     category: null,
-    color: null,
     x: null,
     y: null
 });

src/reducers/monitors.js

@@ -9,7 +9,7 @@ const reducer = function (state, action) {
     if (typeof state === 'undefined') state = initialState;
     switch (action.type) {
     case UPDATE_MONITORS:
-        return action.monitors.map(monitorAdapter);
+        return action.monitors.mapEntries(monitorAdapter);
     default:
         return state;
     }