feat: update eslint to v9 (#794)

### Summary

This PR updates ESLint to version 9 for all created projects and for
this very same repository as well.

Upgrading to ESLint 9 implies moving the inline ESLint config (located
at `package.json`) to a separate file: `.eslint.config.mjs`
([docs](https://eslint.org/docs/latest/use/migrate-to-9.0.0#flat-config)).

We are coming from discussion
#793

### Test plan

- Run `yarn lint` in this project to make sure linting is unaffected.
- Create a new project with `create-react-native-library` and run `yarn
lint` on the newly created project to make sure linting does not report
any error.

Author: Serchinastico

docs/next.config.js

@@ -1,3 +1,4 @@
+// eslint-disable-next-line @typescript-eslint/no-require-imports
 const withNextra = require('nextra')({
   theme: 'nextra-theme-docs',
   themeConfig: './theme.config.jsx',

eslint.config.mjs

@@ -0,0 +1,16 @@
+// eslint-disable-next-line import-x/extensions,import-x/no-unresolved
+import { defineConfig } from 'eslint/config';
+import satya164 from 'eslint-config-satya164';
+
+export default defineConfig([
+  ...satya164,
+  {
+    ignores: [
+      'node_modules/',
+      '**/coverage/',
+      '**/lib/',
+      '**/templates/',
+      '**/__fixtures__/',
+    ],
+  },
+]);

package.json

@@ -23,13 +23,17 @@
   },
   "devDependencies": {
     "@commitlint/config-conventional": "^17.0.2",
+    "@eslint/compat": "^1.2.7",
+    "@eslint/eslintrc": "^3.3.0",
+    "@eslint/js": "^9.22.0",
     "@evilmartians/lefthook": "^1.5.0",
     "@lerna-lite/cli": "^1.13.0",
     "@lerna-lite/run": "^1.13.0",
     "commitlint": "^17.0.2",
     "concurrently": "^7.2.2",
-    "eslint": "^8.52.0",
-    "eslint-config-satya164": "^3.2.0",
+    "eslint": "^9.23.0",
+    "eslint-config-satya164": "^4.0.1",
+    "globals": "^16.0.0",
     "prettier": "^3.0.3",
     "typescript": "^5.2.2"
   },

packages/create-react-native-library/src/index.ts

@@ -23,6 +23,7 @@ import { resolveNpmPackageVersion } from './utils/resolveNpmPackageVersion';
 const FALLBACK_BOB_VERSION = '0.38.3';
 const FALLBACK_NITRO_MODULES_VERSION = '0.22.1';
 
+// eslint-disable-next-line @typescript-eslint/no-unused-expressions
 yargs
   .command(
     '$0 [name]',

packages/create-react-native-library/templates/common/$package.json

@@ -78,19 +78,22 @@
   },
   "devDependencies": {
     "@commitlint/config-conventional": "^19.6.0",
+    "@eslint/compat": "^1.2.7",
+    "@eslint/eslintrc": "^3.3.0",
+    "@eslint/js": "^9.22.0",
     "@evilmartians/lefthook": "^1.5.0",
 <% if (example === 'vanilla' && (project.moduleConfig === 'turbo-modules' || project.viewConfig === 'fabric-view')) { -%>
     "@react-native-community/cli": "15.0.0-alpha.2",
 <% } -%>
-    "@react-native/eslint-config": "^0.73.1",
+    "@react-native/eslint-config": "^0.78.0",
     "@release-it/conventional-changelog": "^9.0.2",
     "@types/jest": "^29.5.5",
     "@types/react": "^19.0.12",
     "commitlint": "^19.6.1",
     "del-cli": "^5.1.0",
-    "eslint": "^8.51.0",
-    "eslint-config-prettier": "^9.0.0",
-    "eslint-plugin-prettier": "^5.0.1",
+    "eslint": "^9.22.0",
+    "eslint-config-prettier": "^10.1.1",
+    "eslint-plugin-prettier": "^5.2.3",
     "jest": "^29.7.0",
 <% if (project.moduleConfig === 'nitro-modules') { -%>
     "nitro-codegen": "^<%- versions.nitroCodegen %>",
@@ -154,30 +157,6 @@
       }
     }
   },
-  "eslintConfig": {
-    "root": true,
-    "extends": [
-      "@react-native",
-      "prettier"
-    ],
-    "rules": {
-      "react/react-in-jsx-scope": "off",
-      "prettier/prettier": [
-        "error",
-        {
-          "quoteProps": "consistent",
-          "singleQuote": true,
-          "tabWidth": 2,
-          "trailingComma": "es5",
-          "useTabs": false
-        }
-      ]
-    }
-  },
-  "eslintIgnore": [
-    "node_modules/",
-    "lib/"
-  ],
   "prettier": {
     "quoteProps": "consistent",
     "singleQuote": true,

packages/create-react-native-library/templates/common/eslint.config.mjs

@@ -0,0 +1,41 @@
+import { fixupConfigRules } from '@eslint/compat';
+import { FlatCompat } from '@eslint/eslintrc';
+import js from '@eslint/js';
+import prettier from 'eslint-plugin-prettier';
+import { defineConfig } from 'eslint/config';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all,
+});
+
+export default defineConfig([
+  {
+    extends: fixupConfigRules(compat.extends('@react-native', 'prettier')),
+    plugins: { prettier },
+    rules: {
+      'react/react-in-jsx-scope': 'off',
+      'prettier/prettier': [
+        'error',
+        {
+          quoteProps: 'consistent',
+          singleQuote: true,
+          tabWidth: 2,
+          trailingComma: 'es5',
+          useTabs: false,
+        },
+      ],
+    },
+  },
+  {
+    ignores: [
+      'node_modules/',
+      'lib/'
+    ],
+  },
+]);

packages/react-native-builder-bob/babel-config.js

@@ -1,4 +1,4 @@
-/* eslint-disable import/no-commonjs */
+/* eslint-disable @typescript-eslint/no-require-imports, import-x/no-commonjs, no-undef */
 
 const path = require('path');
 const { cosmiconfigSync } = require('cosmiconfig');

packages/react-native-builder-bob/babel-preset.js

@@ -1,4 +1,4 @@
-/* eslint-disable import/no-commonjs */
+/* eslint-disable @typescript-eslint/no-require-imports, import-x/no-commonjs, no-undef */
 
 const browserslist = require('browserslist');
 

packages/react-native-builder-bob/metro-config.js

@@ -1,4 +1,4 @@
-/* eslint-disable import/no-commonjs */
+/* eslint-disable @typescript-eslint/no-require-imports, import-x/no-commonjs, no-undef */
 
 const path = require('path');
 const escape = require('escape-string-regexp');

packages/react-native-builder-bob/src/__tests__/babel.test.ts

@@ -1,9 +1,9 @@
-import { expect, it } from '@jest/globals';
+import { expect, test } from '@jest/globals';
 import { transformFileAsync } from '@babel/core';
 import fs from 'node:fs';
 import path from 'node:path';
 
-it.each(['imports', 'exports'])(`adds extension to %s`, async (name) => {
+test.each(['imports', 'exports'])(`adds extension to %s`, async (name) => {
   const filepath = path.resolve(
     __dirname,
     `../__fixtures__/project/code/$${name}-input.ts`

packages/react-native-builder-bob/src/__tests__/init.test.ts

@@ -1,4 +1,4 @@
-import { afterEach, beforeEach, expect, it, jest } from '@jest/globals';
+import { afterEach, beforeEach, expect, test, jest } from '@jest/globals';
 import { readFile } from 'fs-extra';
 import mockFs from 'mock-fs';
 import { stdin } from 'mock-stdin';
@@ -61,7 +61,7 @@ afterEach(() => {
   jest.restoreAllMocks();
 });
 
-it('initializes the configuration', async () => {
+test('initializes the configuration', async () => {
   jest.spyOn(process.stdout, 'write').mockImplementation(() => true);
 
   process.chdir(root);

packages/react-native-builder-bob/src/index.ts

@@ -13,6 +13,7 @@ const args = {
   },
 } satisfies Record<ArgName, yargs.Options>;
 
+// eslint-disable-next-line @typescript-eslint/no-unused-expressions
 yargs
   .command('init', 'configure the package to use bob', {}, init)
   .command('build', 'build files for publishing', args, build)

packages/react-native-builder-bob/src/init.ts

@@ -7,7 +7,7 @@ import prompts, { type PromptObject } from './utils/prompts';
 import * as logger from './utils/logger';
 import { loadConfig } from './utils/loadConfig';
 
-// eslint-disable-next-line import/no-commonjs, @typescript-eslint/no-var-requires
+// eslint-disable-next-line @typescript-eslint/no-require-imports,import-x/no-commonjs
 const { name, version } = require('../package.json');
 
 const FLOW_PRGAMA_REGEX = /\*?\s*@(flow)\b/m;

packages/react-native-builder-bob/src/targets/codegen/patches/patchCodegenAndroidPackage.test.ts

@@ -1,4 +1,4 @@
-import { expect, it, describe, beforeEach, afterEach } from '@jest/globals';
+import { expect, test, describe, beforeEach, afterEach } from '@jest/globals';
 import fs from 'fs-extra';
 import path from 'node:path';
 import { patchCodegenAndroidPackage } from './patchCodegenAndroidPackage';
@@ -76,7 +76,7 @@ describe('patchCodegenAndroidPackage', () => {
     mockfs.restore();
   });
 
-  it('moves the files to correct dir', async () => {
+  test('moves the files to correct dir', async () => {
     await patchCodegenAndroidPackage(
       mockProjectPath,
       mockPackageJson,
@@ -91,7 +91,7 @@ describe('patchCodegenAndroidPackage', () => {
     expect(await fs.pathExists(expectedDir)).toBe(true);
   });
 
-  it('replaces the package name in the files', async () => {
+  test('replaces the package name in the files', async () => {
     await patchCodegenAndroidPackage(
       mockProjectPath,
       mockPackageJson,
@@ -110,7 +110,7 @@ describe('patchCodegenAndroidPackage', () => {
     expect(fileContent).toContain('package com.bobtest;');
   });
 
-  it('removes the old package dir', async () => {
+  test('removes the old package dir', async () => {
     await patchCodegenAndroidPackage(
       mockProjectPath,
       mockPackageJson,
@@ -120,7 +120,7 @@ describe('patchCodegenAndroidPackage', () => {
     expect(await fs.pathExists(mockCodegenModuleSpecsPath)).toBe(false);
   });
 
-  it("doesn't delete the view manager specs", async () => {
+  test("doesn't delete the view manager specs", async () => {
     const mockPackageJsonWithTypeAll = {
       ...mockPackageJson,
       codegenConfig: {

packages/react-native-builder-bob/src/targets/codegen/patches/removeCodegenAppLevelCode.test.ts

@@ -1,4 +1,4 @@
-import { expect, it, describe, beforeEach, afterEach } from '@jest/globals';
+import { expect, test, describe, beforeEach, afterEach } from '@jest/globals';
 import fs from 'fs-extra';
 import path from 'node:path';
 import { removeCodegenAppLevelCode } from './removeCodegenAppLevelCode';
@@ -50,7 +50,7 @@ describe('patchCodegenAndroidPackage', () => {
     mockfs.restore();
   });
 
-  it('removes the duplicate iOS files', async () => {
+  test('removes the duplicate iOS files', async () => {
     await removeCodegenAppLevelCode(mockProjectPath, mockPackageJson);
 
     expect(
@@ -62,7 +62,7 @@ describe('patchCodegenAndroidPackage', () => {
     ).toBe(0);
   });
 
-  it('removes the unnecessary Android files', async () => {
+  test('removes the unnecessary Android files', async () => {
     await removeCodegenAppLevelCode(mockProjectPath, mockPackageJson);
 
     expect(
@@ -74,7 +74,7 @@ describe('patchCodegenAndroidPackage', () => {
     ).toBe(0);
   });
 
-  it("doesn't crash the process when there are no files to remove", async () => {
+  test("doesn't crash the process when there are no files to remove", async () => {
     mockfs({
       [mockProjectPath]: {
         'package.json': JSON.stringify(mockPackageJson),

packages/react-native-builder-bob/src/utils/loadConfig.ts

@@ -1,6 +1,6 @@
 import { cosmiconfig } from 'cosmiconfig';
 
-// eslint-disable-next-line import/no-commonjs, @typescript-eslint/no-var-requires
+// eslint-disable-next-line @typescript-eslint/no-require-imports,import-x/no-commonjs
 const { name } = require('../../package.json');
 
 const root = process.cwd();