Add more linter rules and de-lint

awx/ui/.eslintignore

@@ -16,5 +16,4 @@ test
 !client/lib/components/**/*.js
 !client/lib/models/**/*.js
 !client/lib/services/**/*.js
-
 !client/features/**/*.js

awx/ui/.eslintrc.js

@@ -1,6 +1,7 @@
 const path = require('path');
 
 module.exports = {
+    root: true,
     extends: [
         'airbnb-base'
     ],
@@ -27,15 +28,22 @@ module.exports = {
         jsyaml: true
     },
     rules: {
-        indent: [0, 4],
+        'arrow-parens': 'off',
-        'comma-dangle': 0,
+        'comma-dangle': 'off',
-        'space-before-function-paren': [2, 'always'],
+        indent: ['error', 4, {
-        'arrow-parens': 0,
+            SwitchCase: 1
-        'no-param-reassign': 0,
+        }],
-        'no-underscore-dangle': 0,
+        'max-len': ['error', {
-        'no-mixed-operators': 0,
+            code: 100,
-        'no-plusplus': 0,
+            ignoreStrings: true,
-        'no-continue': 0,
+            ignoreTemplateLiterals: true,
-        'object-curly-newline': 0
+        }],
+        'no-continue': 'off',
+        'no-mixed-operators': 'off',
+        'no-param-reassign': 'off',
+        'no-plusplus': 'off',
+        'no-underscore-dangle': 'off',
+        'object-curly-newline': 'off',
+        'space-before-function-paren': ['error', 'always']
     }
 };

awx/ui/build/webpack.base.js

@@ -3,8 +3,8 @@ const path = require('path');
 const webpack = require('webpack');
 const CleanWebpackPlugin = require('clean-webpack-plugin');
 const CopyWebpackPlugin = require('copy-webpack-plugin');
-const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
 
 const CLIENT_PATH = path.resolve(__dirname, '../client');
 const LIB_PATH = path.join(CLIENT_PATH, 'lib');
@@ -20,6 +20,7 @@ const NODE_MODULES_PATH = path.join(UI_PATH, 'node_modules');
 const SERVICES_PATH = path.join(LIB_PATH, 'services');
 const SOURCE_PATH = path.join(CLIENT_PATH, 'src');
 const STATIC_PATH = path.join(UI_PATH, 'static');
+const THEME_PATH = path.join(LIB_PATH, 'theme');
 
 const APP_ENTRY = path.join(SOURCE_PATH, 'app.js');
 const VENDOR_ENTRY = path.join(SOURCE_PATH, 'vendor.js');
@@ -32,7 +33,7 @@ const CHUNKS = ['vendor', 'app'];
 const VENDOR = VENDOR_ENTRY;
 const APP = [THEME_ENTRY, APP_ENTRY];
 
-let base = {
+const base = {
     entry: {
         vendor: VENDOR,
         app: APP
@@ -42,7 +43,17 @@ let base = {
         publicPath: '',
         filename: OUTPUT
     },
-    stats: 'minimal',
+    stats: {
+        children: false,
+        modules: false,
+        chunks: false,
+        excludeAssets: name => {
+            const chunkNames = `(${CHUNKS.join('|')})`;
+            const outputPattern = new RegExp(`${chunkNames}\.[a-f0-9]+\.(js|css)$`, 'i');
+
+            return !outputPattern.test(name);
+        }
+    },
     module: {
         rules: [
             {
@@ -50,7 +61,13 @@ let base = {
                 loader: 'babel-loader',
                 exclude: /node_modules/,
                 options: {
-                    presets: ['env']
+                    presets: [
+                        ['env', {
+                            targets: {
+                                browsers: ['last 2 versions']
+                            }
+                        }]
+                    ]
                 }
             },
             {
@@ -81,10 +98,6 @@ let base = {
                     /node_modules\/d3\/d3\.min.js$/
                 ]
             },
-            {
-                test: /\.js$/,
-                use: 'imports-loader?define=>false'
-            },
             {
                 test: /\.html$/,
                 use: ['ngtemplate-loader', 'html-loader'],
@@ -169,11 +182,12 @@ let base = {
             filename: INDEX_OUTPUT,
             inject: false,
             chunks: CHUNKS,
-            chunksSortMode: (moduleA, moduleB) => {
+            chunksSortMode: (chunk) => {
-                moduleA.files.sort((fileA, fileB) => fileA.includes('js') ? -1 : 1)
+                if (chunk.names[0] === 'polyfill' || chunk.names[0] === 'vendor') {
-                moduleB.files.sort((fileA, fileB) => fileA.includes('js') ? -1 : 1)
+                    return -1;
+                }
 
-                return moduleA.names[0] === 'vendor' ? -1 : 1
+                return 1;
             }
         })
     ],
@@ -183,12 +197,13 @@ let base = {
             '~models': MODELS_PATH,
             '~services': SERVICES_PATH,
             '~components': COMPONENTS_PATH,
+            '~theme': THEME_PATH,
             '~modules': NODE_MODULES_PATH,
             '~assets': ASSETS_PATH,
-            'd3$': '~modules/d3/d3.min.js',
+            d3$: '~modules/d3/d3.min.js',
             'codemirror.jsonlint$': '~modules/codemirror/addon/lint/json-lint.js',
             'jquery-resize$': '~modules/javascript-detect-element-resize/jquery.resize.js',
-            'select2$': '~modules/select2/dist/js/select2.full.min.js',
+            select2$: '~modules/select2/dist/js/select2.full.min.js',
             'js-yaml$': '~modules/js-yaml/dist/js-yaml.min.js',
             'lr-infinite-scroll$': '~modules/lr-infinite-scroll/lrInfiniteScroll.js',
             'angular-ui-router$': '~modules/angular-ui-router/release/angular-ui-router.js',

awx/ui/build/webpack.development.js

@@ -2,27 +2,10 @@ const path = require('path');
 
 const _ = require('lodash');
 
-const ESLINTRC_PATH = path.resolve(__dirname, '..', '.eslintrc.js');
+const base = require('./webpack.base');
-const LINTED_PATHS = [
-    /.js$/
-];
 
-let base = require('./webpack.base');
+const development = {
-
+    devtool: 'cheap-source-map'
-let development = {
-    devtool: 'cheap-source-map',
-    module: {
-        rules: [
-            {
-                test: /\.js$/,
-                enforce: 'pre',
-                exclude: /node_modules/,
-                loader: 'eslint-loader'
-            }
-        ]
-    }
 };
 
-development.module.rules = base.module.rules.concat(development.module.rules)
-
 module.exports = _.merge(base, development);

awx/ui/build/webpack.production.js

@@ -5,15 +5,15 @@ const webpack = require('webpack');
 const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 
-let base = require('./webpack.base');
+const base = require('./webpack.base');
 
 const CLIENT_PATH = path.resolve(__dirname, '../client');
 const UI_PATH = path.resolve(__dirname, '..');
-const INSTALL_RUNNING_ENTRY = path.join(CLIENT_PATH, 'installing.template.ejs')
+const INSTALL_RUNNING_ENTRY = path.join(CLIENT_PATH, 'installing.template.ejs');
 const INSTALL_RUNNING_OUTPUT = path.join(UI_PATH, 'templates/ui/installing.html');
 const CHUNKS = ['vendor', 'app'];
 
-let production = {
+const production = {
     plugins: [
         new UglifyJSPlugin({
             compress: true,
@@ -25,16 +25,17 @@ let production = {
             filename: INSTALL_RUNNING_OUTPUT,
             inject: false,
             chunks: CHUNKS,
-            chunksSortMode: (moduleA, moduleB) => {
+            chunksSortMode: (chunk) => {
-                moduleA.files.sort((fileA, fileB) => fileA.includes('js') ? -1 : 1);
+                if (chunk.names[0] === 'polyfill' || chunk.names[0] === 'vendor') {
-                moduleB.files.sort((fileA, fileB) => fileA.includes('js') ? -1 : 1);
+                    return -1;
+                }
 
-                return moduleA.names[0] === 'vendor' ? -1 : 1;
+                return 1;
             }
         })
     ]
 };
 
-production.plugins = base.plugins.concat(production.plugins)
+production.plugins = base.plugins.concat(production.plugins);
 
 module.exports = _.merge(base, production);

awx/ui/build/webpack.test.js

@@ -5,9 +5,9 @@ const webpack = require('webpack');
 
 const STATIC_URL = '/static/';
 
-let development = require('./webpack.development');
+const development = require('./webpack.development');
 
-let test = {
+const test = {
     plugins: [
         new webpack.DefinePlugin({
             $basePath: STATIC_URL
@@ -15,7 +15,7 @@ let test = {
     ]
 };
 
-test.plugins = development.plugins.concat(test.plugins)
+test.plugins = development.plugins.concat(test.plugins);
 
 module.exports = _.merge(development, test);
 

awx/ui/build/webpack.watch.js

@@ -8,9 +8,19 @@ const TARGET_PORT = _.get(process.env, 'npm_package_config_django_port', 8043);
 const TARGET_HOST = _.get(process.env, 'npm_package_config_django_host', 'https://localhost');
 const TARGET = `https://${TARGET_HOST}:${TARGET_PORT}`;
 
-let development = require('./webpack.development');
+const development = require('./webpack.development');
 
-let watch = {
+const watch = {
+    module: {
+        rules: [
+            {
+                test: /\.js$/,
+                enforce: 'pre',
+                exclude: /node_modules/,
+                loader: 'eslint-loader'
+            }
+        ]
+    },
     plugins: [
         new HtmlWebpackHarddiskPlugin(),
         new webpack.HotModuleReplacementPlugin()
@@ -36,7 +46,8 @@ let watch = {
     }
 };
 
-watch.plugins = development.plugins.concat(watch.plugins)
+watch.module.rules = development.module.rules.concat(watch.module.rules);
+watch.plugins = development.plugins.concat(watch.plugins);
 
 module.exports = _.merge(development, watch);
 

awx/ui/client/features/credentials/legacy.credentials.js

@@ -100,8 +100,7 @@ function LegacyCredentialsService () {
                 const path = `api/v2/credentials/${id}/access_list/`;
 
                 return qs.search(path, $stateParams.permission_search);
-                }
+            }]
-            ]
         },
         params: {
             permission_search: {
@@ -144,7 +143,14 @@ function LegacyCredentialsService () {
                 'GetBasePath',
                 'resourceData',
                 (list, qs, $stateParams, GetBasePath, resourceData) => {
-                    const path = resourceData.data.organization ? `${GetBasePath('organizations')}${resourceData.data.organization}/users` : ((list.basePath) || GetBasePath(list.name));
+                    let path;
+
+                    if (resourceData.data.organization) {
+                        path = `${GetBasePath('organizations')}${resourceData.data.organization}/users`;
+                    } else {
+                        path = list.basePath || GetBasePath(list.name);
+                    }
+
                     return qs.search(path, $stateParams.user_search);
                 }
             ],
@@ -156,17 +162,21 @@ function LegacyCredentialsService () {
                 'resourceData',
                 (list, qs, $stateParams, GetBasePath, resourceData) => {
                     const path = GetBasePath(list.basePath) || GetBasePath(list.name);
+                    const org = resourceData.data.organization;
 
-                    if (!resourceData.data.organization) {
+                    if (!org) {
                         return null;
                     }
 
-                        $stateParams[`${list.iterator}_search`].organization = resourceData.data.organization;
+                    $stateParams[`${list.iterator}_search`].organization = org;
+
                     return qs.search(path, $stateParams.team_search);
                 }
             ],
-            resourceData: ['CredentialModel', '$stateParams', (Credential, $stateParams) => new Credential('get', $stateParams.credential_id)
+            resourceData: ['CredentialModel', '$stateParams', (Credential, $stateParams) =>
-                    .then(credential => ({ data: credential.get() }))],
+                new Credential('get', $stateParams.credential_id)
+                    .then(credential => ({ data: credential.get() }))
+            ]
         },
         params: {
             user_search: {

awx/ui/client/src/vendor.js

@@ -8,6 +8,7 @@ require('~modules/codemirror/theme/elegant.css');
 require('~modules/codemirror/addon/lint/lint.css');
 require('~modules/nvd3/build/nv.d3.css');
 require('~modules/ng-toast/dist/ngToast.min.css');
+
 require('jquery');
 require('jquery-resize');
 require('jquery-ui');

awx/ui/package.json

@@ -58,7 +58,6 @@
     "html-loader": "^0.5.1",
     "html-webpack-harddisk-plugin": "^0.1.0",
     "html-webpack-plugin": "^2.30.1",
-    "imports-loader": "^0.7.1",
     "jasmine-core": "^2.5.2",
     "jshint": "^2.9.4",
     "jshint-loader": "^0.8.3",
@@ -80,7 +79,6 @@
     "less-plugin-autoprefix": "^1.4.2",
     "load-grunt-configs": "^1.0.0",
     "load-grunt-tasks": "^3.5.0",
-    "minimist": "^1.2.0",
     "nightwatch": "^0.9.16",
     "ngtemplate-loader": "^2.0.1",
     "phantomjs-prebuilt": "^2.1.12",
@@ -106,6 +104,7 @@
     "angular-scheduler": "git+https://git@github.com/ansible/angular-scheduler#0.1.1",
     "angular-tz-extensions": "git+https://git@github.com/ansible/angular-tz-extensions#0.3.13",
     "angular-ui-router": "1.0.0-beta.3",
+    "babel-polyfill": "^6.26.0",
     "bootstrap": "^3.3.7",
     "bootstrap-datepicker": "^1.7.1",
     "codemirror": "^5.17.0",