fix(linter): update eslint plugins for @typescript-eslint v6 naming (n…

…rwl#21221)

Co-authored-by: Steven Rathbauer <[email protected]>
Co-authored-by: James Henry <[email protected]>

packages/eslint-plugin/src/configs/javascript.ts

@@ -18,6 +18,9 @@ const isPrettierAvailable =
  * it should yield a performance improvement but could introduce subtle
  * breaking changes - we should also look to replace all the @typescript-eslint
  * related plugins and rules below.
+ *
+ * TODO: Reevaluate stylistic plugin and added specific rules in the next major
+ * version of Nx. Related to https://github.com/nrwl/nx/pull/21066
  */
 export default {
   env: {
@@ -34,12 +37,33 @@ export default {
     'eslint:recommended',
     'plugin:@typescript-eslint/eslint-recommended',
     'plugin:@typescript-eslint/recommended',
+    /**
+     * This was added to preserve the linting rules that were previously
+     * defined v5 of @typescript-eslint. v6 of @typescript-eslint changed
+     * how configurations are defined. This should be reevaluated in the
+     * next major version of Nx.
+     */
+    'plugin:@typescript-eslint/stylistic',
     ...(isPrettierAvailable ? ['prettier'] : []),
   ],
   rules: {
     '@typescript-eslint/explicit-member-accessibility': 'off',
     '@typescript-eslint/explicit-module-boundary-types': 'off',
     '@typescript-eslint/explicit-function-return-type': 'off',
+    /**
+     * These 3 rules:
+     *   `no-extra-semi`
+     *   `@typescript-eslint/no-extra-semi`
+     *   `@typescript-eslint/no-non-null-assertion`
+     * were added to preserve the linting rules that were
+     * previously defined v5 of `@typescript-eslint`. v6 of `@typescript-eslint`
+     * changed how configurations are defined. This should be reevaluated in
+     * the next major version of Nx.
+     */
+    'no-extra-semi': 'off',
+    '@typescript-eslint/no-extra-semi': 'error',
+    '@typescript-eslint/no-non-null-assertion': 'warn',
+
     '@typescript-eslint/no-parameter-properties': 'off',
     /**
      * Until ESM usage in Node matures, using require in e.g. JS config files

packages/eslint-plugin/src/configs/typescript.ts

@@ -10,6 +10,9 @@ const isPrettierAvailable =
  *
  * It should therefore NOT contain any rules or plugins which are specific
  * to one ecosystem, such as React, Angular, Node etc.
+ *
+ * TODO: Reevaluate stylistic plugin and added specific rules in the next major
+ * version of Nx. Related to https://github.com/nrwl/nx/pull/21066
  */
 export default {
   parser: '@typescript-eslint/parser',
@@ -23,12 +26,32 @@ export default {
     'eslint:recommended',
     'plugin:@typescript-eslint/eslint-recommended',
     'plugin:@typescript-eslint/recommended',
+    /**
+     * This was added to preserve the linting rules that were previously
+     * defined v5 of @typescript-eslint. v6 of @typescript-eslint changed
+     * how configurations are defined. This should be reevaluated in the
+     * next major version of Nx.
+     */
+    'plugin:@typescript-eslint/stylistic',
     ...(isPrettierAvailable ? ['prettier'] : []),
   ],
   rules: {
     '@typescript-eslint/explicit-member-accessibility': 'off',
     '@typescript-eslint/explicit-module-boundary-types': 'off',
     '@typescript-eslint/explicit-function-return-type': 'off',
+    /**
+     * These 3 rules:
+     *   `no-extra-semi`
+     *   `@typescript-eslint/no-extra-semi`
+     *   `@typescript-eslint/no-non-null-assertion`
+     * were added to preserve the linting rules that were
+     * previously defined v5 of `@typescript-eslint`. v6 of `@typescript-eslint`
+     * changed how configurations are defined. This should be reevaluated in
+     * the next major version of Nx.
+     */
+    'no-extra-semi': 'off',
+    '@typescript-eslint/no-extra-semi': 'error',
+    '@typescript-eslint/no-non-null-assertion': 'warn',
     '@typescript-eslint/no-parameter-properties': 'off',
   },
 };

packages/expo/src/generators/component/files/__fileName__.tsx.template

@@ -26,7 +26,7 @@ export function <%= className %>(props: <%= className %>Props) {
       <Text>Welcome to <%= name %>!</Text>
     </View>
   );
-};
+}
 <% } %>
 
 export default <%= className %>;

packages/next/src/generators/application/files/pages/__fileName__.tsx__tmpl__

@@ -25,6 +25,6 @@ export function Index() {
       <%- appContent %>
     </<%= wrapper %>>
   );
-};
+}
 
 export default Index;

packages/node/src/generators/e2e-project/files/server/common/src/__fileName__/__fileName__.spec.ts__tmpl__

@@ -4,7 +4,7 @@ describe('GET /', () => {
   it('should return a message', async () => {
     const res = await axios.get(`/`);
 
-    expect(res.status).toBe(200);;
+    expect(res.status).toBe(200);
     expect(res.data).toEqual({ message: 'Hello API' });
   });
 })

packages/node/src/generators/e2e-project/files/server/nest/src/__fileName__/__fileName__.spec.ts__tmpl__

@@ -4,7 +4,7 @@ describe('GET /api', () => {
   it('should return a message', async () => {
     const res = await axios.get(`/api`);
 
-    expect(res.status).toBe(200);;
+    expect(res.status).toBe(200);
     expect(res.data).toEqual({ message: 'Hello API' });
   });
 })

packages/react-native/src/generators/component/files/__fileName__.tsx__tmpl__

@@ -26,7 +26,7 @@ export function <%= className %>(props: <%= className %>Props) {
       <Text>Welcome to <%= name %>!</Text>
     </View>
   );
-};
+}
 <% } %>
 
 export default <%= className %>;

packages/react/src/generators/component/files/__fileName__.tsx__tmpl__

@@ -64,7 +64,7 @@ const Styled<%= className %> = styled.div`
         <% } %>
       </<%= wrapper %>>
     );
-  };
+  }
   <% } %>
 
   export default <%= className %>;

packages/react/src/generators/hook/files/__fileName__.ts__tmpl__

@@ -1,15 +1,15 @@
-import { useState, useCallback } from 'react'
-
-// eslint-disable-next-line @typescript-eslint/no-empty-interface
-export interface <%= hookTypeName %> {
-  count: number;
-  increment: () => void;
-}
-
-export function <%= hookName %>(): <%= hookTypeName %> {
-  const [count, setCount] = useState(0)
-  const increment = useCallback(() => setCount((x) => x + 1), [])
-  return { count, increment }
-};
-
-export default <%= hookName %>;
+import { useState, useCallback } from 'react'
+
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+export interface <%= hookTypeName %> {
+  count: number;
+  increment: () => void;
+}
+
+export function <%= hookName %>(): <%= hookTypeName %> {
+  const [count, setCount] = useState(0)
+  const increment = useCallback(() => setCount((x) => x + 1), [])
+  return { count, increment }
+}
+
+export default <%= hookName %>;