Merge pull request #475 from appuniversum/chore/fix-eslint-gts-setup

Apply the `@typescript-eslint/eslint-recommended` rules to .gts files

Author: Windvis

.eslintrc.js

@@ -1,5 +1,10 @@
 'use strict';
 
+// Copied from https://github.com/ember-cli/eslint-plugin-ember/pull/2107/files
+const typescriptEslintRecommendedRules =
+  require('@typescript-eslint/eslint-plugin').configs['eslint-recommended']
+    .overrides[0].rules;
+
 module.exports = {
   root: true,
   parser: '@typescript-eslint/parser',
@@ -16,11 +21,12 @@ module.exports = {
     // ts files
     {
       files: ['**/*.{gts,ts}'],
-      extends: [
-        'plugin:@typescript-eslint/eslint-recommended',
-        'plugin:@typescript-eslint/recommended',
-      ],
+      extends: ['plugin:@typescript-eslint/recommended'],
       rules: {
+        // https://github.com/ember-cli/eslint-plugin-ember/issues/2106
+        // TODO: remove this when eslint-plugin-ember ships it, or when we switch to the flat config setup
+        ...typescriptEslintRecommendedRules,
+
         // This works around an issue in Glint https://github.com/typed-ember/glint/issues/697
         // It also makes adding state to a component easier, since no other code changes would be needed.
         'ember/no-empty-glimmer-component-classes': 'off',

addon/components/au-alert.gts

@@ -24,7 +24,7 @@ export default class AuAlert extends Component<AuAlertSignature> {
   @tracked isVisible = true;
 
   get skin() {
-    let skin = this.args.skin;
+    const { skin } = this.args;
 
     if (skin === 'info') return 'au-c-alert--info';
     if (skin === 'success') return 'au-c-alert--success';
@@ -34,7 +34,7 @@ export default class AuAlert extends Component<AuAlertSignature> {
   }
 
   get size() {
-    let size = this.args.size;
+    const { size } = this.args;
     if (size === 'tiny') return 'au-c-alert--tiny';
     if (size === 'small') return 'au-c-alert--small';
     return '';

package-lock.json

@@ -132,8 +132,8 @@
     "@types/inputmask": "^5.0.7",
     "@types/qunit": "^2.19.9",
     "@types/rsvp": "^4.0.8",
-    "@typescript-eslint/eslint-plugin": "^6.14.0",
-    "@typescript-eslint/parser": "^6.14.0",
+    "@typescript-eslint/eslint-plugin": "^7.1.1",
+    "@typescript-eslint/parser": "^7.1.1",
     "broccoli-asset-rev": "^3.0.0",
     "chromatic": "^6.5.4",
     "concurrently": "^8.2.2",

package.json

@@ -89,7 +89,7 @@ module('Integration | Component | au-main-container', function (hooks) {
       </template>,
     );
 
-    let containerElement = document.querySelector(
+    const containerElement = document.querySelector(
       MAIN_CONTAINER.CONTENT,
     ) as HTMLElement;
     assert.notStrictEqual(