Merge branch 'main' of github.com:redwoodjs/redwood into try/apollo-u…

…pload-link * 'main' of github.com:redwoodjs/redwood: chore(linting): Remove/fix references to non-existant files (redwoodjs#11245) chore(rsa): Use swc for parsing server actions (redwoodjs#11243) chore(lint): Remove override for 'unused-imports/no-unused-imports' (redwoodjs#11244) chore(linting): Separate out framework and user linting config (redwoodjs#11242) fix: Update default tsconfig options (target, module and moduleResolution) (redwoodjs#11170) chore(fixture): Update tailwind dep (redwoodjs#11241) chore(deps): bump fast-xml-parser from 4.4.0 to 4.4.1 (redwoodjs#11239) chore(rsc): Switch last remaining transform-server test to inline snapshot (redwoodjs#11240) chore: brought in typescript-eslint@v8 with stylistic preset (redwoodjs#10911) chore(deps): bump axios from 1.7.3 to 1.7.4 (redwoodjs#11237) docs(serverConfig): Remove server config option from TOML (redwoodjs#11236) fix(deps): update typescript-eslint monorepo to v8 (major) (redwoodjs#11235)
dac09 · Aug 14, 2024 · fc68303 · fc68303
2 parents 7c3c4ec + 74e942e
commit fc68303
Show file tree

Hide file tree

Showing 30 changed files with 852 additions and 517 deletions.
diff --git a/.changesets/10911.md b/.changesets/10911.md
@@ -0,0 +1,36 @@
+- chore: brought in typescript-eslint@v8 with stylistic preset (#10911) by @JoshuaKGoldberg
+
+This change updates Redwood linting config and introduces some changes to the linting rules that are applied to your project.
+
+Specifically:
+
+1. `jsx-a11y/no-noninteractive-element-to-interactive-role` has it's default config updated.
+3. `@typescript-eslint/explicit-function-return-type` used to be turned off, now it's no longer applied.
+4. `@typescript-eslint/no-empty-interface` - used to be turned off, now it's no longer applied.
+5. `@typescript-eslint/explicit-module-boundary-types` - used be turned off, now it's no longer applied.
+6. `@typescript-eslint/ban-types` - used to be 'warn', now it's no longer applied. This has been replaces with a set of smaller more specific rules.
+7. `no-empty-function` - used be turned off, now it's no longer applied. The ts-eslint flavour is still there and turned off still.
+8. `camelcase` - used to be turned off, now it's 'warn'.
+9. `@typescript-eslint/camelcase` - used to be turned off, now it's no longer applied.
+10. `no-use-before-define` - used to be turned off, now it's no longer applied.
+11. `@typescript-eslint/no-use-before-define` - used to be turned off, now it's no longer applied.
+12. `@typescript-eslint/prefer-namespace-keyword` - used to be turned off, now it's 'error'
+13. `unicode-bom` - used to be turned off, now it's no longer applied.
+14. `@typescript-eslint/adjacent-overload-signatures` - used to be 'error', now it's no longer applied.
+15. `@typescript-eslint/no-explicit-any` - used be 'warn', now 'error'
+16. `@typescript-eslint/no-inferrable-types` - used to be 'error', now it's no longer applied.
+17. `no-loss-of-precision` - used be 'off', now 'error'
+18. `@typescript-eslint/no-loss-of-precision` - used be 'error', now it's no longer applied.
+19. `@typescript-eslint/no-non-null-assertion` - used be 'warn', now it's no longer applied.
+20. `valid-typeof` - used be either 'error' or 'off', now always 'error'
+21. `no-unused-expressions` - used be always 'error', now either 'error' or 'off'
+22. `@typescript-eslint/prefer-function-type` - newly added as 'off'
+23. `@typescript-eslint/no-require-imports` - newly added as 'off'
+24. `@typescript-eslint/no-empty-object-type` - newly added as 'off'
+25. `unicorn/template-indent` - newly added as 'off'
+26. `@typescript-eslint/no-duplicate-enum-values` - newly added as 'error'
+27. `@typescript-eslint/no-unsafe-declaration-merging` - newly added as 'error'
+28. `@typescript-eslint/no-unsafe-function-type` - newly added as 'error'
+29. `@typescript-eslint/no-unused-expressions` - newly added as 'error'
+30. `@typescript-eslint/no-wrapper-object-types` - newly added as 'error'
+31. `no-new-native-nonconstructor` - newly added as 'off'
diff --git a/.changesets/11170.md b/.changesets/11170.md
@@ -0,0 +1,10 @@
+- fix: Update default tsconfig options (target, module and moduleResolution) (#11170) by @Josh-Walker-GM
+
+This changes the default values of:
+ - target
+ - module
+ - moduleResolution
+
+in the tsconfig files for both the API and web side. The benefit of this change is increased correctness for build time checking of the imports from packages which specify `exports` in their `package.json` files.
+
+This change will have a limited effect while Redwood apps are still built to CJS rather than ESM. After that switch to ESM there would be more breaking changes but they are not applied here and are a future concern.
diff --git a/.changesets/11176.md b/.changesets/11176.md
@@ -1,5 +1,6 @@
 - fix(api-server): Use createServer in all cases, to make fastify config consistent (#11176) by @dac09
 
-This PR removes all the cases where we use `createFastifyInstance` for the api server, and replaces it with `createServer`.
+[BREAKING] Removes serverConfig support, in favour of server file to configure your Fastify instance.
+You can still customise your server settings by running `yarn rw setup server-file` first. See docs for [Server File](https://docs.redwoodjs.com/docs/docker/#using-the-server-file)
 
-This makes sure that the API server config is always consistent - whether you use a server file or not. (createServer was only used when we had a server file before)
+This PR removes all the cases where we use `createFastifyInstance` for the api server, and replaces it with `createServer`. This makes sure that the API server config is always consistent - whether you use a server file or not.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1,5 +1,3 @@
-const path = require('path')
-
 const { findUp } = require('@redwoodjs/project-config')
 
 // Framework Babel config is monorepo root ./babel.config.js
@@ -13,37 +11,223 @@ const findBabelConfig = (cwd = process.cwd()) => {
 }
 
 module.exports = {
-  extends: path.join(__dirname, 'packages/eslint-config/shared.js'),
+  extends: [
+    'eslint:recommended',
+    'plugin:react/recommended',
+    'plugin:prettier/recommended',
+    'plugin:jest-dom/recommended',
+  ],
+  parser: '@babel/eslint-parser',
   parserOptions: {
     ecmaVersion: 'latest',
     babelOptions: {
       configFile: findBabelConfig(),
     },
   },
+  settings: {
+    react: {
+      version: 'detect',
+    },
+    // For the import/order rule. Configures how it tells if an import is "internal" or not.
+    // An "internal" import is basically just one that's aliased.
+    //
+    // See...
+    // - https://github.com/import-js/eslint-plugin-import/blob/main/docs/rules/order.md#groups-array
+    // - https://github.com/import-js/eslint-plugin-import/blob/main/README.md#importinternal-regex
+    'import/internal-regex': '^src/',
+  },
   ignorePatterns: [
+    'node_modules',
     'dist',
     'fixtures',
     'packages/babel-config/src/plugins/__tests__/__fixtures__/**/*',
     'packages/babel-config/src/__tests__/__fixtures__/**/*',
-    'packages/core/**/__fixtures__/**/*',
     'packages/codemods/**/__testfixtures__/**/*',
     'packages/cli/**/__testfixtures__/**/*',
-    'packages/core/config/storybook/**/*',
-    'packages/studio/dist-*/**/*',
   ],
-  plugins: ['unused-imports'],
+  plugins: [
+    'unused-imports',
+    'prettier',
+    '@babel',
+    'import',
+    'jsx-a11y',
+    'react',
+    'react-hooks',
+    'jest-dom',
+    '@redwoodjs',
+  ],
   rules: {
-    '@typescript-eslint/no-explicit-any': 'off',
     curly: 'error',
-    '@typescript-eslint/consistent-type-imports': 'error',
     'unused-imports/no-unused-imports': 'error',
+    '@redwoodjs/process-env-computed': 'error',
+    'prettier/prettier': 'warn',
+    'no-console': 'off',
+    'prefer-object-spread': 'warn',
+    'prefer-spread': 'warn',
+    'no-unused-expressions': [
+      'error',
+      { allowShortCircuit: true, allowTernary: true },
+    ],
+    'no-useless-escape': 'off',
+    camelcase: ['warn', { properties: 'never' }],
+    'no-new': 'warn',
+    'new-cap': ['error', { newIsCap: true, capIsNew: false }],
+    'no-unused-vars': [
+      'error',
+      { varsIgnorePattern: '^_', argsIgnorePattern: '^_' },
+    ],
+    // React rules
+    'react/prop-types': 'off',
+    'react/display-name': 'off',
+    'react-hooks/exhaustive-deps': 'warn',
+    'import/order': [
+      'error',
+      {
+        'newlines-between': 'always',
+        // We set this to an empty array to override the default value, which is `['builtin', 'external', 'object']`.
+        // Judging by the number of issues on the repo, this option seems to be notoriously tricky to understand.
+        // From what I can tell, if the value of this is `['builtin']` that means it won't sort builtins.
+        // But we have a rule for builtins below (react), so that's not what we want.
+        //
+        // See...
+        // - https://github.com/import-js/eslint-plugin-import/pull/1570
+        // - https://github.com/import-js/eslint-plugin-import/issues/1565
+        pathGroupsExcludedImportTypes: [],
+        // Only doing this to add internal. The order here maters.
+        // See https://github.com/import-js/eslint-plugin-import/blob/main/docs/rules/order.md#groups-array
+        groups: [
+          'builtin',
+          'external',
+          'internal',
+          'parent',
+          'sibling',
+          'index',
+        ],
+        pathGroups: [
+          {
+            pattern: 'react',
+            group: 'builtin',
+            position: 'after',
+          },
+          {
+            pattern: '@redwoodjs/**',
+            group: 'external',
+            position: 'after',
+          },
+          {
+            // Matches...
+            // - src/directives/**/*.{js,ts}
+            // - src/services/**/*.{js,ts}
+            // - src/graphql/**/*.sdl.{js,ts}
+            //
+            // Uses https://github.com/isaacs/minimatch under the hood
+            // See https://github.com/isaacs/node-glob#glob-primer for syntax
+            // eslint-disable-next-line prettier/prettier
+            pattern: 'src/*/**/*.?(sdl.){js,ts}',
+            patternOptions: {
+              nobrace: true,
+              noglobstar: true,
+            },
+            group: 'internal',
+            position: 'before',
+          },
+        ],
+        alphabetize: {
+          order: 'asc',
+          caseInsensitive: true,
+        },
+      },
+    ],
+    'no-restricted-imports': [
+      'error',
+      {
+        patterns: [
+          {
+            group: ['$api/*'],
+            message:
+              'Importing from $api is only supported in *.routeHooks.{js,ts} files',
+          },
+        ],
+      },
+    ],
   },
   env: {
     // We use the most modern environment available. Then we rely on Babel to
     // transpile it to something that can run on all node versions we support
     es2022: true,
   },
   overrides: [
+    {
+      files: ['*.tsx', '*.js', '*.jsx'],
+      excludedFiles: ['api/src/**'],
+      rules: {
+        'react-hooks/rules-of-hooks': 'error',
+      },
+    },
+    {
+      files: ['*.ts', '*.tsx'],
+      parser: '@typescript-eslint/parser',
+      extends: ['plugin:@typescript-eslint/recommended', 'prettier'],
+      rules: {
+        // TODO: look into enabling these eventually
+        '@typescript-eslint/no-empty-function': 'off',
+        '@typescript-eslint/prefer-function-type': 'off',
+
+        // Specific 'recommended' rules we alter
+        '@typescript-eslint/no-var-requires': 'off',
+        '@typescript-eslint/no-require-imports': 'off',
+        '@typescript-eslint/no-empty-object-type': 'off',
+        '@typescript-eslint/no-unused-vars': [
+          'error',
+          { varsIgnorePattern: '^_', argsIgnorePattern: '^_' },
+        ],
+      },
+    },
+    {
+      files: ['*.test.*', '**/__mocks__/**'],
+      env: {
+        node: true,
+        es6: true,
+        commonjs: true,
+        jest: true,
+      },
+    },
+    {
+      files: [
+        '.babelrc.js',
+        'babel.config.js',
+        '.eslintrc.js',
+        '*.config.js',
+        'jest.setup.js',
+      ],
+      env: {
+        node: true,
+        commonjs: true,
+        jest: true,
+      },
+    },
+    {
+      extends: ['plugin:@typescript-eslint/stylistic'],
+      files: ['*.ts', '*.tsx'],
+      rules: {
+        // TODO: Look into enabling these eventually
+        '@typescript-eslint/array-type': 'off',
+        '@typescript-eslint/consistent-generic-constructors': 'off',
+        '@typescript-eslint/consistent-indexed-object-style': 'off',
+        '@typescript-eslint/consistent-type-definitions': 'off',
+        '@typescript-eslint/no-empty-function': 'off',
+        '@typescript-eslint/no-empty-object-type': 'off',
+        '@typescript-eslint/no-explicit-any': 'off',
+        '@typescript-eslint/no-require-imports': 'off',
+        '@typescript-eslint/prefer-for-of': 'off',
+        '@typescript-eslint/prefer-function-type': 'off',
+        '@typescript-eslint/consistent-type-imports': 'error',
+
+        // Specific 'stylistic' rules we alter
+        camelcase: 'off',
+        curly: 'error',
+      },
+    },
     {
       files: ['packages/structure/src/**'],
       rules: {
@@ -109,7 +293,7 @@ module.exports = {
     },
     // Entry.js rules
     {
-      files: ['packages/web/src/entry/index.js'],
+      files: ['packages/web/src/entry/index.jsx'],
       env: {
         browser: true,
       },
@@ -123,7 +307,6 @@ module.exports = {
         'packages/api/src/**',
         'packages/api-server/src/**',
         'packages/cli/src/**',
-        'packages/core/config/**',
         'packages/create-redwood-app/src/*.js',
         'packages/internal/src/**',
         'packages/prerender/src/**',
@@ -177,11 +360,7 @@ module.exports = {
     },
     // Allow computed member access on process.env in NodeJS contexts and tests
     {
-      files: [
-        'packages/core/config/webpack.common.js',
-        'packages/testing/**',
-        'packages/vite/src/index.ts',
-      ],
+      files: ['packages/testing/**', 'packages/vite/src/index.ts'],
       rules: {
         '@redwoodjs/process-env-computed': 'off',
       },
@@ -204,15 +383,5 @@ module.exports = {
         ],
       },
     },
-    {
-      files: [
-        'packages/create-redwood-app/templates/js/scripts/seed.js',
-        'packages/create-redwood-app/templates/ts/scripts/seed.ts',
-        'packages/testing/src/web/global.ts',
-      ],
-      rules: {
-        'unused-imports/no-unused-imports': 'off',
-      },
-    },
   ],
 }
diff --git a/__fixtures__/test-project/api/tsconfig.json b/__fixtures__/test-project/api/tsconfig.json
@@ -3,9 +3,9 @@
     "noEmit": true,
     "allowJs": true,
     "esModuleInterop": true,
-    "target": "esnext",
-    "module": "esnext",
-    "moduleResolution": "node",
+    "target": "ES2023",
+    "module": "Node16",
+    "moduleResolution": "Node16",
     "skipLibCheck": false,
     "rootDirs": [
       "./src",

diff --git a/__fixtures__/test-project/web/package.json b/__fixtures__/test-project/web/package.json
@@ -27,6 +27,6 @@
     "postcss": "^8.4.41",
     "postcss-loader": "^8.1.1",
     "prettier-plugin-tailwindcss": "^0.5.12",
-    "tailwindcss": "^3.4.9"
+    "tailwindcss": "^3.4.10"
   }
 }
diff --git a/__fixtures__/test-project/web/tsconfig.json b/__fixtures__/test-project/web/tsconfig.json
@@ -3,9 +3,9 @@
     "noEmit": true,
     "allowJs": true,
     "esModuleInterop": true,
-    "target": "esnext",
-    "module": "esnext",
-    "moduleResolution": "node",
+    "target": "ES2022",
+    "module": "ES2022",
+    "moduleResolution": "Bundler",
     "skipLibCheck": false,
     "rootDirs": [
       "./src",

diff --git a/docs/docs/app-configuration-redwood-toml.md b/docs/docs/app-configuration-redwood-toml.md
@@ -111,7 +111,10 @@ Don't make secrets available to your web side. Everything in `includeEnvironment
 | `host`         | Hostname for the api server to listen at               | Defaults to `'0.0.0.0'` in production and `'::'` in development              |
 | `schemaPath`   |  The location of your Prisma schema. If you have [enabled Prisma multi file schemas](https://www.prisma.io/docs/orm/prisma-schema/overview/location#multi-file-prisma-schema), then its value is the directory where your `schema.prisma` can be found, for example: `'./api/db/schema'` | Defaults to `'./api/db/schema.prisma'` |
 | `debugPort`    | Port for the debugger to listen at     | `18911`                    |
-| `serverConfig` | [Deprecated; use the [server file](./docker.md#using-the-server-file) instead] Path to the `server.config.js` file | `'./api/server.config.js'` |
+
+
+Additional server configuration can be done using [Server File](docker.md#using-the-server-file)
+
 
 ### Multi File Schema
 

diff --git a/packages/codemods/src/codemods.ts b/packages/codemods/src/codemods.ts
@@ -2,7 +2,7 @@
 
 import yargs from 'yargs'
 
-// eslint-disable-next-line no-unused-expressions
+// eslint-disable-next-line @typescript-eslint/no-unused-expressions
 yargs
   .scriptName('codemods')
   .example([['$0 add-directives', 'Run the add-directives codemod']])