Remove redundant parentheses in JS (#1949)

js/.eslint/index.js

@@ -0,0 +1,23 @@
+module.exports = {
+    rules: {
+        'no-extra-parens': require('./no-extra-parens-rule'),
+    },
+    configs: {
+        recommended: {
+            plugins: [
+                '@internal/eslint-plugin',
+            ],
+            rules: {
+                // https://github.com/eslint/eslint/issues/16626
+                // https://github.com/airbnb/javascript/blob/eslint-config-airbnb-v19.0.4/packages/eslint-config-airbnb-base/rules/errors.js#L66
+                '@internal/no-extra-parens': ['error', 'all', {
+                    conditionalAssign: true,
+                    enforceForArrowConditionals: false,
+                    ignoreJSX: 'all',
+                    nestedBinaryExpressions: false,
+                    returnAssign: false,
+                }],
+            },
+        },
+    },
+};

js/.eslint/no-extra-parens-rule.js

@@ -0,0 +1,17 @@
+const eslint = require('eslint');
+const ruleComposer = require('eslint-rule-composer');
+
+const rule = new eslint.Linter().getRules().get('no-extra-parens');
+
+module.exports = ruleComposer.filterReports(
+    rule,
+    (problem) => {
+        if (problem.node.type === 'ConditionalExpression'
+            && (problem.node.parent.type === 'ConditionalExpression' || problem.node.parent.type === 'SpreadElement')
+        ) {
+            return false;
+        }
+
+        return problem;
+    }
+);

js/.eslint/package.json

@@ -0,0 +1,11 @@
+{
+  "name": "@internal/eslint-plugin",
+  "version": "1.0.0",
+  "private": true,
+  "dependencies": {
+    "eslint-rule-composer": "^0.3.0"
+  },
+  "peerDependencies": {
+    "eslint": "*"
+  }
+}

js/.eslintrc.js

@@ -8,6 +8,7 @@ module.exports = {
         'airbnb-base',
         'plugin:unicorn/recommended',
         'plugin:vue/vue3-recommended',
+        'plugin:@internal/eslint-plugin/recommended',
     ],
     parserOptions: {
         ecmaVersion: '2020',
@@ -17,60 +18,61 @@ module.exports = {
         'import/resolver': 'webpack',
     },
     rules: {
-        indent: ['error', 4, { SwitchCase: 1 }],
-        curly: ['error', 'all'],
-        'object-shorthand': ['error', 'never'],
-        'func-names': ['error', 'never'],
-        'no-param-reassign': 'off',
         'class-methods-use-this': 'off',
-        'no-plusplus': 'off',
+        'comma-dangle': ['error', {
+            arrays: 'always-multiline',
+            exports: 'always-multiline',
+            functions: 'never',
+            imports: 'always-multiline',
+            objects: 'always-multiline',
+        }],
         'consistent-return': 'off',
-        'no-nested-ternary': 'off',
+        curly: ['error', 'all'],
         'default-case': 'off',
+        'func-names': ['error', 'never'],
+        'import/extensions': ['error', 'always', {
+            '': 'never',
+            js: 'never',
+            vue: 'never',
+        }],
+        'import/no-unresolved': 'off',
+        'import/prefer-default-export': 'off',
+        indent: ['error', 4, {
+            SwitchCase: 1,
+        }],
+        'jsdoc/check-line-alignment': ['error', 'always'],
+        'jsdoc/require-jsdoc': 'off',
+        'jsdoc/require-param': 'off',
+        'jsdoc/require-param-description': 'off',
+        'jsdoc/require-returns': 'off',
+        'jsdoc/require-returns-description': 'off',
+        'linebreak-style': ['error', 'unix'],
+        'max-len': 'off',
         'no-console': ['error', { allow: ['warn', 'error'] }],
+        'no-nested-ternary': 'off',
+        'no-param-reassign': 'off',
+        'no-plusplus': 'off',
         'no-restricted-syntax': 'off',
         'no-underscore-dangle': 'off',
-        'max-len': 'off',
-        'prefer-template': 'off',
         'no-unused-vars': ['error', { vars: 'all', args: 'none' }],
+        'object-shorthand': ['error', 'never'],
         'padding-line-between-statements': ['error', {
             blankLine: 'always',
-            prev: '*',
             next: ['continue', 'break', 'export', 'return', 'throw'],
+            prev: '*',
         }],
+        'prefer-template': 'off',
         'spaced-comment': ['error', 'always', {
-            line: {
-                markers: ['/'],
-                exceptions: ['-', '+'],
-            },
             block: {
-                markers: ['!'],
-                exceptions: ['*'],
                 balanced: true,
+                exceptions: ['*'],
+                markers: ['!'],
+            },
+            line: {
+                exceptions: ['-', '+'],
+                markers: ['/'],
             },
         }],
-        'comma-dangle': ['error', {
-            arrays: 'always-multiline',
-            objects: 'always-multiline',
-            functions: 'never',
-            imports: 'always-multiline',
-            exports: 'always-multiline',
-        }],
-        'import/no-unresolved': 'off',
-        'import/prefer-default-export': 'off',
-        'import/extensions': ['error', 'always', {
-            '': 'never',
-            js: 'never',
-            vue: 'never',
-        }],
-        'vue/html-indent': ['error', 4],
-        'vue/attribute-hyphenation': ['error', 'never'],
-        'jsdoc/require-param': 'off',
-        'jsdoc/require-param-description': 'off',
-        'jsdoc/require-returns': 'off',
-        'jsdoc/require-returns-description': 'off',
-        'jsdoc/require-jsdoc': 'off',
-        'jsdoc/check-line-alignment': ['error', 'always'],
         'unicorn/catch-error-name': 'off',
         'unicorn/no-array-callback-reference': 'off',
         'unicorn/no-lonely-if': 'off',
@@ -80,6 +82,8 @@ module.exports = {
         'unicorn/prefer-module': 'off',
         'unicorn/prevent-abbreviations': 'off',
         'unicorn/switch-case-braces': ['error', 'avoid'],
+        'vue/attribute-hyphenation': ['error', 'never'],
+        'vue/html-indent': ['error', 4],
     },
     reportUnusedDisableDirectives: true,
 };

js/package.json

@@ -37,6 +37,7 @@
         "@babel/core": "^7.19.6",
         "@babel/plugin-transform-runtime": "^7.19.6",
         "@babel/preset-env": "^7.19.4",
+        "@internal/eslint-plugin": "file:.eslint",
         "babel-loader": "^8.2.5",
         "css-loader": "^6.7.1",
         "eslint": "^8.28.0",

js/src/plugins/column-resizer.plugin.js

@@ -8,7 +8,7 @@ import AtkPlugin from './atk.plugin';
 export default class AtkColumnResizerPlugin extends AtkPlugin {
     main() {
         this.settings.onResize = this.onResize.bind(this);
-        this.resizable = new Resizer(this.$el[0], ({ ...this.settings.atkDefaults, ...this.settings }));
+        this.resizable = new Resizer(this.$el[0], { ...this.settings.atkDefaults, ...this.settings });
 
         // reset padding class.
         this.$el.removeClass('grip-padding');

js/src/plugins/scroll.plugin.js

@@ -40,7 +40,7 @@ export default class AtkScrollPlugin extends AtkPlugin {
             this.setTableHeader();
         } else {
             // check if scroll apply vs Window or inside our element.
-            this.isWindow = (this.$el.css('overflow-y') === 'visible');
+            this.isWindow = this.$el.css('overflow-y') === 'visible';
             this.$scroll = this.isWindow ? $(window) : this.$el;
             // is Inner the element itself or it's children.
             this.$inner = this.isWindow ? this.$el : this.$el.children();

js/src/services/form.service.js

@@ -162,7 +162,7 @@ class FormService {
             return false;
         }
 
-        return (rule.value === undefined || rule.value === null)
+        return rule.value === undefined || rule.value === null
             ? rule.type.match(this.formSettings.regExp.bracket)[1] + ''
             : rule.value;
     }
@@ -176,7 +176,7 @@ class FormService {
     }
 
     isBracketedRule(rule) {
-        return (rule.type && rule.type.match(this.formSettings.regExp.bracket));
+        return rule.type && rule.type.match(this.formSettings.regExp.bracket);
     }
 }
 

js/src/services/modal.service.js

@@ -150,7 +150,7 @@ class ModalService {
     doAutoFocus($modal) {
         const inputs = $modal.find('[tabindex], :input').filter(':visible');
         const autofocus = inputs.filter('[autofocus]');
-        const input = (autofocus.length > 0) ? autofocus.first() : inputs.first();
+        const input = autofocus.length > 0 ? autofocus.first() : inputs.first();
 
         if (input.length > 0) {
             input.focus().select();

js/src/services/panel.service.js

@@ -313,7 +313,7 @@ class PanelService {
         const triggerElement = this.getPropertyValue(id, 'triggerElement');
         let isSame = false;
         if (el && triggerElement) {
-            isSame = (el.length === triggerElement.length && el.length === el.filter(triggerElement).length);
+            isSame = el.length === triggerElement.length && el.length === el.filter(triggerElement).length;
         }
 
         return isSame;
@@ -365,7 +365,7 @@ class PanelService {
      * @returns {boolean}
      */
     needConfirmation(id) {
-        return (this.getPropertyValue(id, 'modal') && this.isWarningOn(id));
+        return this.getPropertyValue(id, 'modal') && this.isWarningOn(id);
     }
 
     /**

js/src/services/upload.service.js

@@ -28,7 +28,7 @@ class UploadService {
         const formData = new FormData();
 
         for (let i = 0; i < files.length; i++) {
-            const param = (i === 0) ? 'file' : 'file-' + i;
+            const param = i === 0 ? 'file' : 'file-' + i;
             formData.append(param, files.item(i));
         }
 

js/src/vue-components/item-search.component.js

@@ -48,7 +48,7 @@ export default {
     computed: {
         classIcon: function () {
             return {
-                'search icon': (this.query === null || this.query === ''),
+                'search icon': this.query === null || this.query === '',
                 'remove icon': this.query !== null,
             };
         },
@@ -100,7 +100,7 @@ export default {
                 url: this.url,
                 data: options,
                 method: 'GET',
-                stateContext: (this.context) ? $(this.context) : $(this.$el),
+                stateContext: this.context ? $(this.context) : $(this.$el),
                 onComplete: function (e, r) {
                     that.isActive = false;
                 },

js/src/vue-components/multiline/multiline.component.js

@@ -258,7 +258,7 @@ export default {
         getUUID: function () {
             return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replaceAll(/[xy]/g, (c) => {
                 const r = Math.floor(Math.random() * 16);
-                const v = c === 'x' ? r : (r & (0x3 | 0x8)); // eslint-disable-line no-bitwise
+                const v = c === 'x' ? r : r & (0x3 | 0x8); // eslint-disable-line no-bitwise
 
                 return v.toString(16);
             });

js/src/vue-components/tree-item-selector/tree-item-selector.component.js

@@ -47,7 +47,7 @@ export default {
     computed: {
         itemMargin: function () {
             return {
-                marginLeft: (this.item.nodes && this.item.nodes.length > 0)
+                marginLeft: this.item.nodes && this.item.nodes.length > 0
                     ? (this.open ? '-13px' : '-10px')
                     : null,
             };
@@ -61,7 +61,7 @@ export default {
             return this.item.name;
         },
         isParent: function () {
-            return (this.nodes && this.nodes.length > 0);
+            return this.nodes && this.nodes.length > 0;
         },
         toggleIcon: function () {
             return this.isParent