Merge branch '499-refactor-route-definitions' of https://github.com/L…

…iskHQ/lisk-hub into 499-refactor-route-definitions

.eslintignore

@@ -2,3 +2,4 @@ dist
 node_modules
 coverage
 app/build
+app/build-testnet

.eslintrc

@@ -15,7 +15,6 @@
     "beforeEach": true,
     "afterEach": true,
     "ipc": true,
-    "DEFAULT_NEWTORK": true,
     "PRODUCTION": true,
     "TEST": true
   },

.gitignore

@@ -8,6 +8,7 @@ e2e-test-screenshots
 app/report.html
 app/*.map
 app/build
+app/build-testnet
 *.sw[pon]
 app/app.js
 .vscode

Jenkinsfile

@@ -10,16 +10,14 @@ def get_build_info() {
 def slack_send(color, message) {
   /* Slack channel names are limited to 21 characters */
   CHANNEL_MAX_LEN = 21
-  CHANNEL_SUFFIX = '-jenkins'
 
   channel = "${env.JOB_NAME}".tokenize('/')[0]
-  channel_len = CHANNEL_MAX_LEN - CHANNEL_SUFFIX.size()
-  if ( channel.size() > channel_len ) {
-     channel = channel.substring(0, channel_len)
+  channel = channel.replace('lisk-', 'lisk-ci-')
+  if ( channel.size() > CHANNEL_MAX_LEN ) {
+     channel = channel.substring(0, CHANNEL_MAX_LEN)
   }
-  channel += CHANNEL_SUFFIX
-  echo "[slack_send] channel: ${channel} "
 
+  echo "[slack_send] channel: ${channel} "
   slackSend color: "${color}", message: "${message}", channel: "${channel}"
 }
 
@@ -101,6 +99,7 @@ node('lisk-hub') {
         sh '''
         cp ~/.coveralls.yml-hub .coveralls.yml
         npm run --silent build
+        npm run --silent build:testnet
         rsync -axl --delete --rsync-path="mkdir -p /var/www/test/${JOB_NAME%/*}/$BRANCH_NAME/ && rsync" $WORKSPACE/app/build/ jenkins@master-01:/var/www/test/${JOB_NAME%/*}/$BRANCH_NAME/
         npm run --silent bundlesize
         '''

config/webpack.config.prod.js

@@ -3,14 +3,16 @@ const webpack = require('webpack');
 const { resolve } = require('path');
 const merge = require('webpack-merge');
 const { NamedModulesPlugin } = require('webpack');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const FileChanger = require('webpack-file-changer');
 const baseConfig = require('./webpack.config');
 const reactConfig = require('./webpack.config.react');
 /* eslint-enable import/no-extraneous-dependencies */
 
 module.exports = merge(baseConfig, reactConfig, {
   output: {
     path: resolve(__dirname, '../app', '../app/build'),
-    filename: 'bundle.[name].js',
+    filename: 'bundle.[name].[hash].js',
   },
   plugins: [
     new webpack.DefinePlugin({
@@ -29,5 +31,21 @@ module.exports = merge(baseConfig, reactConfig, {
     new webpack.optimize.CommonsChunkPlugin({
       name: 'vendor',
     }),
+    new ExtractTextPlugin({
+      filename: 'styles.[hash].css',
+      allChunks: true,
+    }),
+    new FileChanger({
+      change: [
+        {
+          file: './index.html',
+          parameters: {
+            'styles\\.css': 'styles.[hash].css',
+            'bundle\\.vendor\\.js': 'bundle.vendor.[hash].js',
+            'bundle\\.app\\.js': 'bundle.app.[hash].js',
+          },
+        },
+      ],
+    }),
   ],
 });

config/webpack.config.react.js

@@ -1,12 +1,15 @@
 /* eslint-disable import/no-extraneous-dependencies */
 const { resolve } = require('path');
-const { ContextReplacementPlugin, DefinePlugin } = require('webpack');
+const { ContextReplacementPlugin } = require('webpack');
 const StyleLintPlugin = require('stylelint-webpack-plugin');
 const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const HtmlWebpackInlineSourcePlugin = require('html-webpack-inline-source-plugin');
 const reactToolboxVariables = require('./reactToolbox.config');
 const I18nScannerPlugin = require('../src/i18n-scanner');
 const fs = require('fs');
 const path = require('path');
+const bundleVersion = require('../package.json').version;
 
 const getLocales = (url) => {
   const file = fs.readFileSync(path.join(__dirname, url));
@@ -23,6 +26,65 @@ const langRegex = getLocales('../i18n/languages.js');
 const entries = {
   app: `${resolve(__dirname, '../src')}/main.js`,
   vendor: ['babel-polyfill', 'url-polyfill', 'react', 'redux', 'react-dom', 'react-redux'],
+  'head.css': `${resolve(__dirname, '../src/assets/css')}/styles.head.css`,
+};
+const extractHeadCSS = new ExtractTextPlugin({
+  filename: 'head.css',
+  allChunks: false,
+});
+const cssLoader = {
+  loader: 'css-loader',
+  options: {
+    sourceMap: true,
+    minimize: true,
+    modules: true,
+    importLoaders: 1,
+    localIdentName: '[name]__[local]___[hash:base64:5]',
+  },
+};
+const headCssLoader = {
+  loader: 'css-loader',
+  options: {
+    sourceMap: true,
+    minimize: true,
+    modules: false,
+  },
+};
+const headCssLoadersConfig = Object.assign({}, headCssLoader);
+
+const cssLoadersConfig = {
+  fallback: 'style-loader',
+  use: [
+    cssLoader,
+    {
+      loader: 'postcss-loader',
+      options: {
+        ident: 'postcss',
+        sourceMap: true,
+        sourceComments: true,
+        plugins: [
+          /* eslint-disable import/no-extraneous-dependencies */
+          require('postcss-partial-import')({}),
+          require('postcss-mixins')({}),
+          require('postcss-nesting')({}),
+          require('postcss-cssnext')({
+            features: {
+              customProperties: {
+                variables: reactToolboxVariables,
+              },
+            },
+          }),
+          require('postcss-functions')({
+            functions: {
+              rem: px => `${(px / 10)}rem`,
+            },
+          }),
+          require('postcss-for')({}),
+          /* eslint-enable import/no-extraneous-dependencies */
+        ],
+      },
+    },
+  ],
 };
 
 module.exports = {
@@ -35,17 +97,14 @@ module.exports = {
     historyApiFallback: true,
   },
   plugins: [
-    new DefinePlugin({
-      DEFAULT_NEWTORK: JSON.stringify(process.env.TESTNET ? 'testnet' : 'mainnet'),
-    }),
     new StyleLintPlugin({
       context: `${resolve(__dirname, '../src')}/`,
       files: '**/*.css',
       config: {
         extends: 'stylelint-config-standard',
         rules: {
           'selector-pseudo-class-no-unknown': null,
-          'unit-whitelist': ['px', 'deg', '%', 'em', 'ms'],
+          'unit-whitelist': ['px', 'deg', '%', 'ms'],
           'length-zero-no-unit': null,
           'at-rule-no-unknown': null,
         },
@@ -55,6 +114,14 @@ module.exports = {
       filename: 'styles.css',
       allChunks: true,
     }),
+    extractHeadCSS,
+    new HtmlWebpackPlugin({
+      template: './src/index.html',
+      VERSION: bundleVersion,
+      inject: false,
+      inlineSource: '.(css)$',
+    }),
+    new HtmlWebpackInlineSourcePlugin(),
     new I18nScannerPlugin({
       translationFunctionNames: ['i18next.t', 'props.t', 'this.props.t', 't'],
       outputFilePath: './i18n/locales/en/common.json',
@@ -68,50 +135,12 @@ module.exports = {
   module: {
     rules: [
       {
-        test: /\.css$/,
-        use: ['css-hot-loader'].concat(ExtractTextPlugin.extract({
-          fallback: 'style-loader',
-          use: [
-            {
-              loader: 'css-loader',
-              options: {
-                sourceMap: true,
-                minimize: true,
-                modules: true,
-                importLoaders: 1,
-                localIdentName: '[name]__[local]___[hash:base64:5]',
-              },
-            },
-            {
-              loader: 'postcss-loader',
-              options: {
-                ident: 'postcss',
-                sourceMap: true,
-                sourceComments: true,
-                plugins: [
-                  /* eslint-disable import/no-extraneous-dependencies */
-                  require('postcss-partial-import')({}),
-                  require('postcss-mixins')({}),
-                  require('postcss-nesting')({}),
-                  require('postcss-cssnext')({
-                    features: {
-                      customProperties: {
-                        variables: reactToolboxVariables,
-                      },
-                    },
-                  }),
-                  require('postcss-functions')({
-                    functions: {
-                      rem: px => `${(px / 10)}rem`,
-                    },
-                  }),
-                  require('postcss-for')({}),
-                  /* eslint-enable import/no-extraneous-dependencies */
-                ],
-              },
-            },
-          ],
-        })),
+        test: /styles\.head\.css$/,
+        use: [].concat(extractHeadCSS.extract(headCssLoadersConfig)),
+      },
+      {
+        test: /^((?!styles\.head).)*\.css$/,
+        use: ['css-hot-loader'].concat(ExtractTextPlugin.extract(cssLoadersConfig)),
       },
     ],
   },

config/webpack.config.test.js

@@ -31,3 +31,4 @@ module.exports = merge(baseConfig, reactConfig, {
   ],
   externals,
 });
+

karma.conf.js

@@ -58,11 +58,6 @@ module.exports = function (config) {
             'src/components/setting/index.js',
             'src/components/setting/setting.js',
             'src/components/menuBar/menuBar.js',
-            'src/store/middlewares/account.js',
-            'src/store/middlewares/login.js',
-            'src/store/middlewares/peers.js',
-            'src/store/middlewares/savedAccounts.js',
-            'src/store/middlewares/socket.js',
             'src/components/accountVisual/demo.js',
             'src/components/delegateList/votingHeader.js',
             'src/components/app/index.js',
@@ -77,7 +72,7 @@ module.exports = function (config) {
             'src/components/multiStep/index.js',
             'src/components/passphrase/create/index.js',
             'src/components/passphrase/safekeeping/index.js',
-            'src/components/toolbox/checkbox/index.js',
+            'src/components/toolbox/sliderCheckbox/index.js',
             'src/components/toolbox/transitionWrapper/index.js',
             'src/components/searchBar/index.js',
             'src/components/sendWritable/index.js',

package.json

@@ -7,7 +7,9 @@
   "main": "main.js",
   "scripts": {
     "build": "npm run clean-build && npm run copy-files && npm run build-prod && npm run build-electron",
-    "build:testnet": "export TESTNET=true && npm run build",
+    "build:testnet": "npm run build:testnet:pre",
+    "build:testnet:pre": "cpx \"./app/build/**\" ./app/build-testnet && npm run build:testnet:post",
+    "build:testnet:post": "replace '\"mainnet\";//defaultNetwork' '\"testnet\";//defaultNetwork' ./app/build-testnet/index.html ",
     "dev": "webpack-dev-server --config ./config/webpack.config.dev --env.dev --hot",
     "build-prod": "webpack --config ./config/webpack.config.prod --env.prod",
     "build-electron": "webpack --config ./config/webpack.config.electron",
@@ -126,6 +128,8 @@
     "extract-text-webpack-plugin": "3.0.0",
     "file-loader": "1.1.6",
     "glob": "=7.1.2",
+    "html-webpack-inline-source-plugin": "0.0.10",
+    "html-webpack-plugin": "3.0.4",
     "i18next-scanner": "=2.0.0",
     "imports-loader": "0.7.1",
     "js-nacl": "=1.2.2",
@@ -157,6 +161,7 @@
     "react-hot-loader": "=1.3.1",
     "react-test-renderer": "=16.0.0",
     "redux-mock-store": "1.3.0",
+    "replace": "0.3.0",
     "should": "13.1.0",
     "simulant": "0.2.2",
     "sinon": "3.3.0",
@@ -168,9 +173,10 @@
     "stylelint-webpack-plugin": "=0.9.0",
     "url-loader": "0.5.9",
     "url-polyfill": "1.0.10",
-    "webpack": "3.6.0",
+    "webpack": "3.11.0",
     "webpack-bundle-analyzer": "2.9.0",
-    "webpack-dev-server": "2.8.2"
+    "webpack-dev-server": "2.8.2",
+    "webpack-file-changer": "2.0.1"
   },
   "build": {
     "appId": "io.lisk.hub",
@@ -203,15 +209,15 @@
   },
   "bundlesize": [
     {
-      "path": "./app/build/bundle.app.js",
+      "path": "./app/build/bundle.app.*.js",
       "maxSize": "890 kB"
     },
     {
-      "path": "./app/build/bundle.vendor.js",
+      "path": "./app/build/bundle.vendor.*.js",
       "maxSize": "150 kB"
     },
     {
-      "path": "./app/build/styles.css",
+      "path": "./app/build/styles.*.css",
       "maxSize": "1.50 MB"
     }
   ],