I've been reading through the documentation [here](https://nextjs.org/docs/app/api-reference/config/eslint#additional-configurations) about how to configure my project to use the "eslint-config-airbnb" package in a Next.js project which says [here](https://nextjs.org/docs/app/api-reference/config/eslint#additional-configurations) that you should remove "eslint-config-next" and instead extend "eslint-plugin-import". I've done that but I still don't think my configuration is correct. I'm also confused on whether I should still use "next lint" or just run eslint if I'm using a different configuration.

 .eslintrc.json

{
  "extends": [
    "airbnb",
    "airbnb/hooks",
    "airbnb-typescript",
    "eslint:recommended",
    "plugin:@typescript-eslint/recommended",
    "plugin:testing-library/react",
    "plugin:jest-dom/recommended",
    "plugin:@next/next/recommended",
    "plugin:prettier/recommended"
  ],
  "plugins": ["@typescript-eslint", "testing-library", "jest-dom"],
  "parser": "@typescript-eslint/parser",
  "parserOptions": {
    "project": "./tsconfig.json",
    "ecmaVersion": 2022,
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true
    }
  },
  "rules": {
    "no-unused-vars": "off",
    "@typescript-eslint/no-unused-vars": [
      "error",
      {
        "argsIgnorePattern": "^_[^_].*$|^_$",
        "varsIgnorePattern": "^_[^_].*$|^_$",
        "caughtErrorsIgnorePattern": "^_[^_].*$|^_$"
      }
    ],
    "@typescript-eslint/no-explicit-any": "error",
    "testing-library/await-async-queries": "error",
    "testing-library/no-await-sync-queries": "error",
    "testing-library/prefer-screen-queries": "error",
    "react-hooks/exhaustive-deps": "off",
    "react/react-in-jsx-scope": "off",
    "react/jsx-uses-react": "off"
  },
  "settings": {
    "react": {
      "version": "detect"
    }
  },
  "ignorePatterns": [
    "*.config.js",
    "*.config.mjs",
    "/out",
    "/coverage",
    "/node_modules",
    "/bin",
    "/public",
    "/styles"
  ]
}