@spinnaker/eslint-plugin 3.0.0

package/rules/prefer-promise-like.ts

@@ -0,0 +1,108 @@
+import type { TSESTree } from '@typescript-eslint/types';
+import type { Rule } from 'eslint';
+import type { ImportDeclaration } from 'estree';
+import _ from 'lodash';
+
+/**
+ * No slashes in string literals passed to API.one() / API.all()
+ *
+ * @version 0.1.0
+ * @category
+ */
+const rule = function (context: Rule.RuleContext) {
+  return {
+    TSTypeReference: function (_node) {
+      const node = _node as TSESTree.TSTypeReference;
+      // var foo: IPromise<any> = bar()
+      //          ^^^^^^^^
+      const type_IPromise = {
+        type: 'TSTypeReference',
+        typeName: {
+          type: 'Identifier',
+          name: 'IPromise',
+        },
+      };
+
+      // var foo: ng.IPromise<any> = bar()
+      //          ^^^^^^^^^^^
+      const type_ng_IPromise = {
+        type: 'TSTypeReference',
+        typeName: {
+          type: 'TSQualifiedName',
+          left: {
+            type: 'Identifier',
+            name: 'ng',
+          },
+          right: {
+            type: 'Identifier',
+            name: 'IPromise',
+          },
+        },
+      };
+
+      const message = `Prefer using PromiseLike type instead of AngularJS IPromise.`;
+      const fix = (fixer) => fixer.replaceText(node.typeName, 'PromiseLike');
+      if (_.isMatch(node, type_IPromise)) {
+        context.report({ fix, node: node.typeName as Rule.Node, message });
+      } else if (_.isMatch(node, type_ng_IPromise)) {
+        context.report({ fix, node: node.typeName as Rule.Node, message });
+      }
+    },
+
+    // If there are any unused IPromise imports, remove them
+    ImportDeclaration: function (node: ImportDeclaration) {
+      const importIPromise = {
+        type: 'ImportSpecifier',
+        imported: {
+          type: 'Identifier',
+          name: 'IPromise',
+        },
+      };
+
+      const message = `Unused IPromise import`;
+
+      // import { foo, IPromise, bar } from 'angular';
+      //               ^^^^^^^^
+      const specifiers = node.specifiers || [];
+      const foundIPromiseImport = specifiers.find((s) => _.isMatch(s, importIPromise));
+
+      const variables = context.getScope().variables;
+      const variable = variables.find((x) => x.defs.some((def) => def.node === foundIPromiseImport));
+      const unused = variable && variable.references.length === 0;
+
+      const fix = (fixer: Rule.RuleFixer) => {
+        const importCount = node.specifiers.length;
+        if (importCount === 1) {
+          // Delete the whole import
+          return fixer.replaceText(node, '');
+        } else {
+          // Delete only IPromise from the import
+          const source = context
+            .getSourceCode()
+            .getText(node)
+            .replace(/,\s*IPromise/g, '')
+            .replace(/IPromise\s*,\s*/g, '');
+
+          return fixer.replaceText(node, source);
+        }
+      };
+
+      if (foundIPromiseImport && unused) {
+        context.report({ node, message, fix });
+      }
+    },
+  };
+};
+
+const ruleModule: Rule.RuleModule = {
+  meta: {
+    type: 'problem',
+    docs: {
+      description: ``,
+    },
+    fixable: 'code',
+  },
+  create: rule,
+};
+
+export default ruleModule;

package/rules/react2angular-with-error-boundary.spec.ts

@@ -0,0 +1,29 @@
+import ruleTester from '../utils/ruleTester';
+import rule from './react2angular-with-error-boundary';
+const errorMessage = `Wrap react2angular components in an error boundary using 'withErrorBoundary()'`;
+
+ruleTester.run('api-no-slashes', rule, {
+  valid: [
+    {
+      code: `react2angular(withErrorBoundary(MyComponent), ['foo', 'bar']);`,
+    },
+  ],
+
+  invalid: [
+    {
+      code: `react2angular(MyComponent, ['foo', 'bar']);`,
+      errors: [errorMessage],
+      output: `import { withErrorBoundary } from '@spinnaker/core';\nreact2angular(withErrorBoundary(MyComponent, 'react2angular component'), ['foo', 'bar']);`,
+    },
+
+    {
+      errors: [errorMessage],
+      code: `import { SpinnakerContainer } from '@spinnaker/core';
+module(SPINNAKER_CONTAINER_COMPONENT, []).component('spinnakerContainer',
+react2angular(SpinnakerContainer, ['authenticating', 'routing']));`,
+      output: `import { SpinnakerContainer, withErrorBoundary } from '@spinnaker/core';
+module(SPINNAKER_CONTAINER_COMPONENT, []).component('spinnakerContainer',
+react2angular(withErrorBoundary(SpinnakerContainer, 'spinnakerContainer'), ['authenticating', 'routing']));`,
+    },
+  ],
+});

package/rules/react2angular-with-error-boundary.ts

@@ -0,0 +1,118 @@
+import type { Rule } from 'eslint';
+import type { CallExpression, ImportDeclaration } from 'estree';
+import _ from 'lodash';
+import { isLiteral } from '../utils/utils';
+
+/**
+ * react2angular: Always wrap react components in an error boundary
+ * Uses withErrorBoundary from core/presentation
+ * @version 0.1.0
+ */
+const rule = function (context: Rule.RuleContext) {
+  let coreImport: ImportDeclaration;
+
+  return {
+    // Find an import from @spinnaker/core or core/presentation
+    // This will be used to add the import for withErrorBoundary
+    ImportDeclaration: function (node: ImportDeclaration) {
+      // import { foo, bar } from 'package';
+      //                           ^^^^^^^
+      const from = node.source.value || '';
+      if (from === '@spinnaker/core') {
+        coreImport = node;
+      }
+    },
+    CallExpression: function (node: CallExpression & Rule.NodeParentExtension) {
+      // Find:
+      // react2angular(SomeComponent, ...)
+      const match = {
+        type: 'CallExpression',
+        callee: {
+          type: 'Identifier',
+          name: 'react2angular',
+        },
+      };
+
+      if (!_.isMatch(node, match)) {
+        return;
+      }
+
+      const r2aComponent = node.arguments[0];
+
+      const wrappedInErrorBoundaryMatch = {
+        type: 'CallExpression',
+        callee: {
+          type: 'Identifier',
+          name: 'withErrorBoundary',
+        },
+      };
+
+      // The react2angular component is already wrapped, nice!
+      if (_.isMatch(r2aComponent, wrappedInErrorBoundaryMatch)) {
+        return;
+      }
+
+      const message = `Wrap react2angular components in an error boundary using 'withErrorBoundary()'`;
+      const filename = context.getFilename();
+      const originalComponentSrc = context.getSourceCode().getText(r2aComponent);
+
+      // Try to determine the angularjs component name
+      // Look for component('angularComponentName', react2angular(ReactComponent, ....))
+      //                    ^^^^^^^^^^^^^^^^^^^^^^
+
+      const parentMatch = {
+        type: 'CallExpression',
+        callee: {
+          property: {
+            type: 'Identifier',
+            name: 'component',
+          },
+        },
+      };
+      const isComponentCallExpression = (node): node is CallExpression => _.isMatch(node, parentMatch);
+
+      let componentName = `'react2angular component'`;
+      const parentNode = node.parent;
+      if (isComponentCallExpression(parentNode)) {
+        const [componentNameLiteralNode, arg2] = parentNode.arguments || [];
+        if (arg2 === node && isLiteral(componentNameLiteralNode)) {
+          componentName = componentNameLiteralNode.raw;
+        }
+      }
+
+      const fix = (fixer: Rule.RuleFixer) => {
+        const wrapped = `withErrorBoundary(${originalComponentSrc}, ${componentName})`;
+        const insertErrorBoundary = fixer.replaceText(r2aComponent, wrapped);
+
+        const fixes = [insertErrorBoundary];
+
+        if (coreImport && coreImport.specifiers.length > 0) {
+          // Append to the existing core/presentation or @spinnaker/core import
+          const lastImport = coreImport.specifiers[coreImport.specifiers.length - 1];
+          fixes.push(fixer.insertTextAfter(lastImport, `, withErrorBoundary`));
+        } else {
+          const importString = filename.includes('/modules/core/')
+            ? 'core/presentation/SpinErrorBoundary'
+            : '@spinnaker/core';
+          fixes.push(fixer.insertTextBeforeRange([0, 0], `import { withErrorBoundary } from '${importString}';\n`));
+        }
+        return fixes;
+      };
+
+      context.report({ message, node, fix });
+    },
+  };
+};
+
+const ruleModule: Rule.RuleModule = {
+  meta: {
+    type: 'problem',
+    docs: {
+      description: `react2angular: Always wrap react components in an error boundary`,
+    },
+    fixable: 'code',
+  },
+  create: rule,
+};
+
+export default ruleModule;

package/rules/rest-prefer-static-strings-in-initializer.spec.ts

@@ -0,0 +1,34 @@
+import ruleTester from '../utils/ruleTester';
+import rule from './rest-prefer-static-strings-in-initializer';
+
+ruleTester.run('rest-prefer-static-strings-in-initializer', rule, {
+  valid: [
+    { code: "REST('/foo/bar').path(id).get()" },
+    { code: "REST('/foo/bar').path().get()" },
+    { code: "REST(id).path('foo').get()" },
+  ],
+  invalid: [
+    {
+      code: "REST().path('foo').path('bar')",
+      output: "REST('/foo').path('bar')",
+      errors: ["Prefer REST('/foo/bar') over REST().path('foo', 'bar')"],
+    },
+    {
+      code: "REST('foo').path('bar').get()",
+      output: "REST('foo/bar').get()",
+      errors: ["Prefer REST('/foo/bar') over REST().path('foo', 'bar')"],
+    },
+    {
+      // Process one path arg at a time
+      code: "REST('foo').path('bar', 'baz').get()",
+      output: "REST('foo/bar').path('baz').get()",
+      errors: ["Prefer REST('/foo/bar') over REST().path('foo', 'bar')"],
+    },
+    {
+      // Process one path arg at a time
+      code: "REST('foo').path('bar', 'baz').get()",
+      output: "REST('foo/bar').path('baz').get()",
+      errors: ["Prefer REST('/foo/bar') over REST().path('foo', 'bar')"],
+    },
+  ],
+});

package/rules/rest-prefer-static-strings-in-initializer.ts

@@ -0,0 +1,89 @@
+/**
+ * Migrate REST().path('foo', 'bar').path('baz').get() to REST('/foo/bar/baz').get()
+ */
+
+import type { Rule } from 'eslint';
+import type { CallExpression, Literal } from 'estree';
+import * as _ from 'lodash/fp';
+
+import { getCallChain, getCallingIdentifierName, isLiteral } from '../utils/utils';
+const getCallName = _.get('callee.property.name');
+
+const ruleModule: Rule.RuleModule = {
+  create(context) {
+    return {
+      /**
+       * Look for chains of CallExpressions that are part of a REST().path() call
+       */
+      CallExpression(node: CallExpression & Rule.NodeParentExtension) {
+        const callingIdentifierName = getCallingIdentifierName(node);
+        if (node.parent.type === 'MemberExpression' || callingIdentifierName !== 'REST') {
+          return undefined;
+        }
+
+        // an array of CallExpressions, i.e. for API.one().all().get() -> [.one, .all, .get]
+        const callChain = getCallChain(node);
+
+        // Look for a REST().path().whatever() call
+        if (!callChain[1] || getCallName(callChain[1]) !== 'path') {
+          return;
+        }
+
+        const restCall = callChain[0];
+        const pathCall = callChain[1];
+
+        const restArg = restCall.arguments[0] as Literal;
+        const firstPathArg = pathCall.arguments[0] as Literal;
+
+        // Only REST('literal').path('literal', ...)
+        // Ignores: REST(variable) and REST().path(variable)
+        if ((restArg && !isLiteral(restArg)) || !isLiteral(firstPathArg)) {
+          return undefined;
+        }
+
+        const message = `Prefer REST('/foo/bar') over REST().path('foo', 'bar')`;
+
+        function fix(fixer) {
+          const fixes = [];
+          const restCallEnd = restCall.range[1];
+          if (restArg) {
+            // REST('/foo').path('bar')
+            // Join '/foo' and '/bar' and replace the rest arg
+            // REST('/foo/bar').path('bar');
+            fixes.push(fixer.replaceText(restArg, `'${restArg.value}/${firstPathArg.value}'`));
+          } else {
+            // REST().path('foo')
+            // Insert text between the parentheses
+            // REST('foo').path('foo');
+            fixes.push(fixer.insertTextAfterRange([restCallEnd - 1, restCallEnd - 1], `'/${firstPathArg.value}'`));
+          }
+
+          if (pathCall.arguments.length === 1) {
+            // REST('foo').path('foo');
+            // Remove the entire .path() call
+            // REST('foo');
+            fixes.push(fixer.removeRange([restCallEnd, pathCall.range[1]]));
+          } else {
+            /** @type {Literal} */
+            const secondPathArg = pathCall.arguments[1];
+            // Remove the first .path() call argument
+            fixes.push(fixer.removeRange([firstPathArg.range[0], secondPathArg.range[0]]));
+          }
+
+          return fixes;
+        }
+
+        context.report({ node, message, fix });
+      },
+    };
+  },
+  meta: {
+    fixable: 'code',
+    type: 'problem',
+    docs: {
+      description: 'Migrate from API.xyz() to REST(path)',
+    },
+  },
+};
+
+export default ruleModule;

package/template/template-rule.spec.ts

@@ -0,0 +1,17 @@
+import ruleTester from '../utils/ruleTester';
+import rule from './RULENAME';
+
+ruleTester.run('RULENAME', rule, {
+  valid: [
+    {
+      code: "import { Something } from 'somewhere';",
+    },
+  ],
+  invalid: [
+    {
+      code: "import { API } from '@spinnaker/core';",
+      output: "import {  } from '@spinnaker/core';",
+      errors: ['Do not import API'],
+    },
+  ],
+});

package/template/template-rule.ts

@@ -0,0 +1,21 @@
+import type { Rule } from 'eslint';
+
+const rule: Rule.RuleModule = {
+  create: (context) => ({
+    ImportSpecifier(node) {
+      if (node.local.name === 'API') {
+        const message = 'Do not import API';
+        context.report({ node, message, fix: (fixer) => fixer.remove(node) });
+      }
+    },
+  }),
+  meta: {
+    fixable: 'code',
+    type: 'problem',
+    docs: {
+      description: 'Do not import API',
+    },
+  },
+};
+
+export default rule;

package/test.eslintrc

@@ -0,0 +1,20 @@
+{
+  parser: '@typescript-eslint/parser',
+  "rules": {
+  },
+  "parserOptions": {
+    "ecmaVersion": 8,
+    "sourceType": "module"
+  },
+  "env": {
+    "browser": true,
+    "node": true,
+    "es6": true,
+    "jasmine": true,
+  },
+  "globals": {
+    "angular": true,
+    "$": true,
+    "_": true,
+  }
+}

package/test_rule_against_deck_source.sh

@@ -0,0 +1,18 @@
+#!/bin/sh
+RULESDIR=`dirname $0`/rules;
+RULESDIRTEMP=$RULESDIR/temp
+if [[ -z "$1" ]] ; then
+  echo "please provide the rule to run against ../../app and ../../packages:\n";
+  ls $RULESDIR | grep -v '\.spec\.' | sed -e 's/\.js$//'
+else
+  RULEFILE=$(basename $(ls $RULESDIR/$1.[tj]s));
+  RULECONFIG={\"$1\":2}
+  echo RULE=$RULE
+  echo RULECONFIG=$RULECONFIG
+  mkdir -p $RULESDIRTEMP
+  ln -s ../$RULEFILE $RULESDIRTEMP
+  shift;
+  echo "node ${NODE_OPTS} ../../node_modules/.bin/eslint --ext js,ts,jsx,tsx --no-eslintrc -c test.eslintrc --rulesdir $RULESDIRTEMP --rule $RULECONFIG ../../app ../../packages $*"
+  node ${NODE_OPTS} ../../node_modules/.bin/eslint --ext js,ts,jsx,tsx --no-eslintrc -c test.eslintrc --rulesdir $RULESDIRTEMP --rule $RULECONFIG ../../app ../../packages $*
+  rm -rf $RULESDIRTEMP
+fi

package/tsconfig.json

@@ -0,0 +1,17 @@
+{
+  "compilerOptions": {
+    "allowJs": true,
+    "allowSyntheticDefaultImports": true,
+    "esModuleInterop": true,
+    "module": "CommonJS",
+    "noEmit": true,
+    "lib": ["ES2020"],
+    "skipLibCheck": true,
+    "downlevelIteration": true,
+    "types": ["node", "jest"]
+  },
+  "include": ["rules/**/*.ts", "utils/**/*.ts"],
+  "ts-node": {
+    "transpileOnly": true
+  }
+}