DM-5276: Upgrade JS third party packages

buildScript/webpack.config.js

@@ -8,7 +8,7 @@ import path from 'path';
 import fs from 'fs';
 
 
-var exclude_dirs = [/node_modules/, /java/, /python/, /config/, /test/];
+var exclude_dirs = /(node_modules|java|python|config|test)/;
 
 /**
  * A helper function to create the webpack config object to be sent to webpack module bundler. 
@@ -23,9 +23,9 @@ var exclude_dirs = [/node_modules/, /java/, /python/, /config/, /test/];
  * @returns {Object} a webpack config object.
  */
 export default function makeWebpackConfig(config) {
-    
+
     // setting defaults
-    config.src = config.src || __dirname;
+    config.src = config.src || process.cwd();
     config.firefly_root = config.firefly_root || path.resolve(config.src, '../..');
     config.firefly_dir = config.firefly_dir || path.resolve(config.firefly_root, 'src/firefly');
     config.project = config.project || path.resolve(config.src, '../../');
@@ -135,15 +135,19 @@ export default function makeWebpackConfig(config) {
     /*------------------------ MODULE -----------------------------*/
     var loaders = [
                     {   test : /\.(js|jsx)$/,
-                        exclude: exclude_dirs,
-                        loaders : ['babel-loader']
+                        include: [config.src, config.firefly_dir,
+                                 `${config.firefly_root}/node_modules/react-component-resizable/`],
+                        loader: 'babel',
+                        query: {
+                            presets: ['es2015', 'react', 'stage-2']
+                        }
                     },
                     {   test    : /\.css$/,
                         exclude: exclude_dirs,
                         loaders : [
                             'style-loader',
                             `css-loader?root=${path.resolve(config.firefly_dir, 'html')}`,
-                            'autoprefixer?browsers=last 2 version'
+                            'postcss-loader'
                         ]
                     },
                     {   test: /\.(png|jpg|gif)$/,

package.json

@@ -8,59 +8,58 @@
     "url": "https://github.com/Caltech-IPAC/firefly.git"
   },
   "dependencies": {
-    "babel": "5.8.34",
+    "babel-core": "6.14.0",
+    "babel-loader"      : "6.2.5",
+    "babel-polyfill"    : "6.13.0 ",
+    "babel-preset-es2015": "6.14.0",
+    "babel-preset-react": "6.11.1",
+    "babel-preset-stage-2": "6.13.0",
+    "babel-runtime"     : "6.9.2",
+    "babel-plugin-react-transform": "2.0.2",
     "enum": "2.3.0",
-    "fixed-data-table": "0.6.0",
-    "history": "1.17.0",
-    "icepick": "0.2.0",
+    "fixed-data-table": "0.6.3",
     "isomorphic-fetch": "2.2.1",
     "local-storage": "1.4.2",
     "lodash": "4.6.1",
     "numeral": "1.5.3",
-    "react": "0.14.7",
-    "react-dom": "0.14.7",
-    "react-addons-pure-render-mixin": "0.14.7",
-    "react-addons-shallow-compare": "0.14.7",
-    "react-addons-update": "0.14.7",
-    "react-component-resizable": "0.3.0",
-    "react-grid-layout": "0.10.0-beta1",
-    "react-highcharts": "5.0.6",
-    "react-split-pane": "0.1.22",
-    "redux": "3.3.1",
-    "redux-thunk": "2.0.1",
+    "react": "15.3.1",
+    "react-dom": "15.3.1",
+    "react-addons-pure-render-mixin": "15.3.1",
+    "react-addons-shallow-compare": "15.3.1",
+    "react-addons-update": "15.3.1",
+    "react-addons-perf" : "15.3.1",
+    "react-component-resizable": "1.0.1",
+    "react-grid-layout": "0.13.3",
+    "react-highcharts": "10.0.0",
+    "react-split-pane": "0.1.44",
+    "redux": "3.5.2",
+    "redux-thunk": "2.1.0",
     "redux-logger": "2.6.1",
-    "redux-saga": "0.9.5",
+    "redux-saga": "0.11.1",
     "underscore.string": "3.2.3",
     "uniq": "1.0.1",
     "validator": "4.5.0",
     "whatwg-fetch": "0.10.1",
-    "react-color": "1.3.6",
+    "react-color": "2.2.6",
     "shallowequal": "0.2.2"
   },
   "devDependencies": {
-    "autoprefixer": "^6.0.3",
-    "autoprefixer-loader": "^3.1.0",
-    "babel-eslint": "^4.1.3",
-    "babel-loader": "^5.3.2",
-    "babel-plugin-react-transform": "^1.1.0",
-    "babel-runtime"     : "^5.8.20",
+    "postcss-loader": "^0.11.1",
     "css-loader"        : "^0.19.0",
-    "eslint"            : "^2.8.0",
-    "eslint-config-airbnb": "7.0.0",
-    "eslint-loader"     : "^1.3.0",
-    "eslint-plugin-react": "^4.3.0",
+    "eslint"            : "^3.4.0",
+    "eslint-loader"     : "^1.5.0",
+    "eslint-plugin-react": "^6.2.0",
     "chai": "^2.3.0",
     "clean-webpack-plugin": "^0.1.3",
     "coveralls": "^2.11.2",
     "esprima-fb": "^14001.1.0-dev-harmony-fb",
     "extract-text-webpack-plugin": "^0.8.0",
+    "file-loader": "^0.9.0",
     "html-webpack-plugin": "^1.6.1",
     "istanbul": "^0.3.13",
     "istanbul-instrumenter-loader": "^0.1.2",
-    "jquery": "^2.1.3",
-    "jscs": "^1.12.0",
     "jsdoc": "^3.4.0",
-    "karma": "^0.13.9",
+    "karma": "^1.2.0",
     "karma-chai": "^0.1.0",
     "karma-cli": "0.0.4",
     "karma-coverage": "^0.2.7",
@@ -69,12 +68,10 @@
     "karma-phantomjs-launcher": "^0.1.4",
     "karma-sinon-chai": "^0.3.0",
     "karma-webpack": "^1.5.0",
-    "less": "^2.5.0",
-    "less-loader": "^2.2.0",
     "mocha": "^2.2.4",
     "publish-release": "^1.1.0",
-    "react-tools": "^0.13.1",
-    "redux-devtools": "^2.1.2",
+    "react-addons-test-utils": "15.3.1",
+    "redux-devtools": "^3.3.1",
     "request": "^2.65.0",
     "rewire": "^2.3.1",
     "rewire-webpack": "^1.0.0",
@@ -83,8 +80,7 @@
     "sinon-chai": "^2.7.0",
     "style-loader": "^0.12.3",
     "url-loader": "^0.5.7",
-    "webpack": "^1.8.2",
-    "react-addons-perf" : "0.14.7",
+    "webpack": "^1.13.2",
     "eslint-plugin-jsx-a11y": "^0.6.2",
     "jsdoc-jsx": "^0.1.0",
     "ink-docstrap" :"^1.2.1"

src/fftools/webpack.config.js

@@ -1,10 +1,10 @@
 /* eslint-env node */
 
-require('babel/register');
+require('babel-core/register')({presets: ['es2015']});
 var path = require('path');
 
 var firefly_root = path.resolve(__dirname, '../..');
 var name = 'fftools';
 var entry = {fflib: path.resolve(firefly_root, 'src/firefly/js/fireflyJSLib.js')};
 
-module.exports = require(firefly_root + '/buildScript/webpack.config.js')({firefly_root, name, entry, use_loader: false});
+module.exports = require(firefly_root + '/buildScript/webpack.config.js').default({firefly_root, name, entry, use_loader: false});

src/firefly/js/Firefly.js

@@ -4,7 +4,7 @@
 /*global __$version_tag*/
 
 
-import 'babel/polyfill';
+import 'babel-polyfill';
 import 'isomorphic-fetch';
 import React from 'react';
 import 'styles/global.css';

src/firefly/js/charts/ui/Histogram.jsx

@@ -3,7 +3,7 @@
  */
 
 import React, {PropTypes} from 'react';
-import ReactHighcharts from 'react-highcharts/bundle/highcharts';
+import ReactHighcharts from 'react-highcharts';
 import numeral from 'numeral';
 import {getFormatString} from '../../util/MathUtil.js';
 import {logError} from '../../util/WebUtil.js';

src/firefly/js/charts/ui/XYPlot.jsx

@@ -4,7 +4,7 @@
 import {isUndefined, debounce, get, omit} from 'lodash';
 import shallowequal from 'shallowequal';
 import React, {PropTypes} from 'react';
-import ReactHighcharts from 'react-highcharts/bundle/highcharts';
+import ReactHighcharts from 'react-highcharts';
 
 import {SelectInfo} from '../../tables/SelectInfo.js';
 import {parseDecimateKey} from '../../tables/Decimate.js';

src/firefly/js/core/ReduxFlux.js

@@ -216,9 +216,11 @@ var logger= loggerMiddleware({duration:true, predicate:logFilter, collapsed:coll
 function createRedux() {
     // create a rootReducer from all of the registered reducers
     const rootReducer = combineReducers(reducers);
-    const middleWare=  applyMiddleware(thunkMiddleware, /*logger,*/ createSagaMiddleware(masterSaga));
-
-    return createStore(rootReducer, middleWare);
+    const sagaMiddleware = createSagaMiddleware();
+    const middleWare=  applyMiddleware(thunkMiddleware, /*logger,*/ sagaMiddleware);
+    const store = createStore(rootReducer, middleWare);
+    sagaMiddleware.run(masterSaga);
+    return store;
 }
 
 function bootstrap() {

src/firefly/js/drawingLayers/NorthUpCompass.js

@@ -2,20 +2,13 @@
  * License information at https://github.com/Caltech-IPAC/firefly/blob/master/License.txt
  */
 
-import DrawLayerCntlr from '../visualize/DrawLayerCntlr.js';
 import ImagePlotCntlr, {visRoot,dispatchAttributeChange} from '../visualize/ImagePlotCntlr.js';
 import {makeDrawingDef,Style, TextLocation} from '../visualize/draw/DrawingDef.js';
 import DrawLayer, {ColorChangeType}  from '../visualize/draw/DrawLayer.js';
-import {MouseState} from '../visualize/VisMouseSync.js';
-import {PlotAttribute} from '../visualize/WebPlot.js';
 import CsysConverter from '../visualize/CsysConverter.js';
-import { makeOffsetPt, makeWorldPt, makeImagePt, makeViewPortPt,makeScreenPt} from '../visualize/Point.js';
-import BrowserInfo from '../util/BrowserInfo.js';
-import VisUtil from '../visualize/VisUtil.js';
-import ShapeDataObj from '../visualize/draw/ShapeDataObj.js';
+import { makeWorldPt, makeScreenPt} from '../visualize/Point.js';
 import {primePlot, getPlotViewById} from '../visualize/PlotViewUtil.js';
 import {makeFactoryDef} from '../visualize/draw/DrawLayerFactory.js';
-import {flux} from '../Firefly.js';
 import {makeDirectionArrowDrawObj} from '../visualize/draw/DirectionArrowDrawObj.js';
 
 const ID= 'NORTH_UP_COMPASS_TOOL';
@@ -91,8 +84,8 @@ function makeCompass(plotId, action){
         return null;
     }
 
-    var dataN= makeDirectionArrowDrawObj(sptStart, spt2,"N");
-    var dataE= makeDirectionArrowDrawObj(sptStart, sptE2,"E");
+    var dataN= makeDirectionArrowDrawObj(sptStart, spt2,'N');
+    var dataE= makeDirectionArrowDrawObj(sptStart, sptE2,'E');
 
     //return Arrays.asList(new DrawObj[]{dataN, dataE});
     //

src/firefly/js/tables/TablesCntlr.js

@@ -370,6 +370,10 @@ export function dispatchTblResultsAdded(tbl_id, title, options, removable, tbl_g
     title = title || tbl_id;
     tbl_group = tbl_group || 'main';
     removable = isNil(removable) ? true : removable;
+    const pageSize = get(options, 'pageSize');
+    if ( pageSize && !Number.isInteger(pageSize)) {
+        options.pageSize = parseInt(pageSize);
+    }
     flux.process( {type: TBL_RESULTS_ADDED, payload: {tbl_id, tbl_group, title, removable, tbl_ui_id, options}});
 }
 

src/firefly/js/tables/reducer/TableDataReducer.js

@@ -12,35 +12,44 @@ import {SelectInfo} from '../SelectInfo.js';
 
 /*---------------------------- REDUCERS -----------------------------*/
 export function dataReducer(state={data:{}}, action={}) {
-    const {tbl_id, selectInfo} = action.payload || {};
     var root = state.data;
     switch (action.type) {
         case (Cntlr.TABLE_SELECT)  :
+        {
+            const {tbl_id, selectInfo} = action.payload;
             if (selectInfo) {
                 return updateSet(root, [tbl_id, 'selectInfo'], selectInfo);
             } else return root;
-
+        }
         case (Cntlr.TABLE_LOADED)  :
+        {
+            const {tbl_id} = action.payload;
             const statusPath = [tbl_id, 'tableMeta', 'Loading-Status'];
             if (get(root, statusPath, 'COMPLETED') !== 'COMPLETED') {
                 return updateSet(root, statusPath, 'COMPLETED');
             } else return root;
-
+        }
         case (Cntlr.TABLE_HIGHLIGHT)  :
         case (Cntlr.TABLE_UPDATE)  :
+        {
+            const {tbl_id} = action.payload;
             return TblUtil.smartMerge(root, {[tbl_id] : {isFetching:false, ...action.payload}});
-
+        }
         case (Cntlr.TABLE_FETCH)      :
         case (Cntlr.TABLE_FILTER)      :
         case (Cntlr.TABLE_SORT)     :
         case (Cntlr.TABLE_REPLACE)  :
+        {
+            const {tbl_id} = action.payload || {};
             const rowCount = action.payload.totalRows || get(action, 'payload.tableData.data.length', 0);
             const nTable = Object.assign({isFetching:false, selectInfo: SelectInfo.newInstance({rowCount}).data}, action.payload);
             return updateSet(root, [tbl_id], nTable);
-
+        }
         case (Cntlr.TABLE_REMOVE)  :
+        {
+            const {tbl_id} = action.payload;
             return omit(root, [tbl_id]);
-
+        }
         default:
             return root;
     }

src/firefly/js/tables/reducer/TableResultsReducer.js

@@ -13,19 +13,22 @@ import * as TblUtil from '../TableUtil.js';
 export function resultsReducer(state={results:{}}, action={}) {
     var root = state.results;
     if (!action || !action.payload) return root;
-    const {tbl_id, tbl_group} = action.payload;
     switch (action.type) {
         case (Cntlr.TBL_RESULTS_ADDED)     :
         case (Cntlr.TBL_RESULTS_UPDATE)    :
+        {
+            const {tbl_id, tbl_group} = action.payload;
             if (tbl_id ) {
                 const changes = set({}, [tbl_group, 'tables', tbl_id], action.payload);
                 set(changes, [tbl_group, 'name'], tbl_group);
                 return TblUtil.smartMerge(root, changes);
             } else return root;
-
+        }
         case Cntlr.TBL_RESULTS_ACTIVE :
+        {
+            const {tbl_id, tbl_group} = action.payload;
             return updateSet(root, [tbl_group,'active'], tbl_id);
-            
+        }
         case (Cntlr.TABLE_REMOVE)    :
             return removeTable(root, action);
 

src/firefly/js/tables/reducer/TableUiReducer.js

@@ -13,17 +13,20 @@ import * as TblUtil from '../TableUtil.js';
 export function uiReducer(state={ui:{}}, action={}) {
     var root = state.ui;
     if (!action || !action.payload) return root;
-    const {tbl_ui_id, tbl_id} = action.payload;
     switch (action.type) {
         case (Cntlr.TBL_UI_UPDATE)    :
+        {
+            const {tbl_ui_id, tbl_id} = action.payload;
             return updateAllUi(root, tbl_id, tbl_ui_id, action.payload);
+        }
         case (Cntlr.TABLE_REMOVE)    :
             return removeTable(root, action);
 
         case (Cntlr.TBL_RESULTS_ADDED) :
-            const {options} = action.payload || {}; 
+        {
+            const {tbl_ui_id, tbl_id, options} = action.payload;
             return Object.assign(root, {[tbl_ui_id]:{tbl_ui_id, tbl_id, ...options}});
-
+        }
         case (Cntlr.TABLE_FETCH)      :
         case (Cntlr.TABLE_FILTER)      :
         case (Cntlr.TABLE_SORT)     :
@@ -32,16 +35,19 @@ export function uiReducer(state={ui:{}}, action={}) {
         case (Cntlr.TABLE_SELECT)   :
         case (Cntlr.TABLE_LOADED) :
         case (Cntlr.TABLE_HIGHLIGHT)  :
+        {
             // state is in-progress(fresh) data.. use it to reduce ui state.
+            const {tbl_id} = action.payload;
             return uiStateReducer(root, get(state, ['data', tbl_id]));
-
+        }
         case (Cntlr.TBL_UI_EXPANDED) :
+        {
             const {tbl_ui_id, tbl_id} = action.payload;
             const tbl_group = findKey(get(state, 'results'), (o) => {
                 return has(o, ['tables', tbl_id]);
             });
             return updateSet(root, 'expanded', {tbl_group, tbl_id, tbl_ui_id});
-
+        }
         default:
             return root;
     }
@@ -69,7 +75,7 @@ function uiStateReducer(ui, tableModel) {
     const filterCount = filterInfo ? filterInfo.split(';').length : 0;
     const sortInfo = get(tableModel, 'request.sortInfo');
     const showLoading = !TblUtil.isTableLoaded(tableModel);
-    const showMask = tableModel.isFetching;
+    const showMask = tableModel && tableModel.isFetching;
 
     var data = has(tableModel, 'tableData.data') ? tableModel.tableData.data.slice(startIdx, endIdx) : [];
     var tableRowCount = data.length;

src/firefly/js/tables/ui/TablePanel.jsx

@@ -120,7 +120,7 @@ export class TablePanel extends Component {
         const {onTableChanged} = this.props;
 
         if (error) return <div className='TablePanel__error'>{error}</div>;
-        if (isEmpty(columns)) return <div style={{position: 'relative', width: '100%', height: '100%'}}><div msg='loading...' className='loading-mask'/></div>;
+        if (isEmpty(columns)) return <div style={{position: 'relative', width: '100%', height: '100%'}}><div className='loading-mask'/></div>;
 
         const selectInfoCls = SelectInfo.newInstance(selectInfo, startIdx);
         const viewIcoStyle = 'tablepanel ' + (textView ? 'tableView' : 'textView');