Ui 2 package upgrades (#6076)

* Upgrade to React 15.6

* Import PropTypes from prop-types

* Update package.json

* UI version in built version

* Cleanup /api/health status failures

* Check reponse.ok

* Add icons to view dapps

* Adjust layout for dapps

* Slightly darker balance background

* Adjust shadows

js/webpack/dev.server.js

@@ -73,6 +73,7 @@ app.use(webpackDevMiddleware(compiler, {
     // @see https://github.com/webpack/webpack/blob/324d309107f00cfc38ec727521563d309339b2ec/lib/Stats.js#L790
     // Accepted values: none, errors-only, minimal, normal, verbose
     const options = WebpackStats.presetToOptions('minimal');
+
     options.timings = true;
 
     const output = data.stats.toString(options);
@@ -89,6 +90,7 @@ Shared.addProxies(app);
 app.use(express.static(webpackConfig.output.path));
 
 const server = http.createServer(app);
+
 server.listen(process.env.PORT || 3000, function () {
   console.log('Listening on port', server.address().port);
   progressBar = new ProgressBar('[:bar] :percent :etas', { total: 50 });

js/webpack/shared.js

@@ -25,7 +25,19 @@ const postcssVars = require('postcss-simple-vars');
 const rucksack = require('rucksack-css');
 const CircularDependencyPlugin = require('circular-dependency-plugin');
 const ProgressBarPlugin = require('progress-bar-webpack-plugin');
+const PackageJson = require('../package.json');
 
+const UI_VERSION = PackageJson
+  .version
+  .split('.')
+  .map((part, index) => {
+    if (index !== 2) {
+      return part;
+    }
+
+    return `${parseInt(part, 10) + 1}`;
+  })
+  .join('.');
 const EMBED = process.env.EMBED;
 const ENV = process.env.NODE_ENV || 'development';
 const isProd = ENV === 'production';
@@ -113,7 +125,8 @@ function getPlugins (_isProd = isProd) {
           RPC_ADDRESS: JSON.stringify(process.env.RPC_ADDRESS),
           PARITY_URL: JSON.stringify(process.env.PARITY_URL),
           DAPPS_URL: JSON.stringify(process.env.DAPPS_URL),
-          LOGGING: JSON.stringify(!isProd)
+          LOGGING: JSON.stringify(!isProd),
+          UI_VERSION: JSON.stringify(UI_VERSION)
         }
       }),
 
@@ -125,26 +138,28 @@ function getPlugins (_isProd = isProd) {
           postcss: postcss,
           babel: getBabelrc()
         }
-      }),
+      })
+    ]);
 
+  if (_isProd) {
+    plugins.push(
       new webpack.optimize.OccurrenceOrderPlugin(!_isProd),
 
       new CircularDependencyPlugin({
         exclude: /node_modules/,
         failOnError: true
-      })
-    ]);
+      }),
 
-  if (_isProd) {
-    plugins.push(new webpack.optimize.UglifyJsPlugin({
-      screwIe8: true,
-      compress: {
-        warnings: false
-      },
-      output: {
-        comments: false
-      }
-    }));
+      new webpack.optimize.UglifyJsPlugin({
+        screwIe8: true,
+        compress: {
+          warnings: false
+        },
+        output: {
+          comments: false
+        }
+      })
+    );
   }
 
   return plugins;