Rename JSX files with proper .jsx extension (#23733)

.eslintrc.js

@@ -43,7 +43,7 @@ module.exports = {
       version: 'detect',
     },
     'import/extensions': [
-      '.js',
+      '.js', '.jsx',
     ],
     'import/ignore': [
       'node_modules',
@@ -52,6 +52,7 @@ module.exports = {
     'import/resolver': {
       node: {
         paths: ['app/javascript'],
+        extensions: ['.js', '.jsx'],
       },
     },
   },
@@ -111,6 +112,7 @@ module.exports = {
     semi: 'error',
     'valid-typeof': 'error',
 
+    'react/jsx-filename-extension': ['error', { 'allow': 'as-needed' }],
     'react/jsx-boolean-value': 'error',
     'react/jsx-closing-bracket-location': ['error', 'line-aligned'],
     'react/jsx-curly-spacing': 'error',
@@ -185,6 +187,7 @@ module.exports = {
       'always',
       {
         js: 'never',
+        jsx: 'never',
       },
     ],
     'import/newline-after-import': 'error',

.github/workflows/lint-js.yml

@@ -10,6 +10,7 @@ on:
       - '.prettier*'
       - '.eslint*'
       - '**/*.js'
+      - '**/*.jsx'
       - '.github/workflows/lint-js.yml'
 
   pull_request:
@@ -20,6 +21,7 @@ on:
       - '.prettier*'
       - '.eslint*'
       - '**/*.js'
+      - '**/*.jsx'
       - '.github/workflows/lint-js.yml'
 
 jobs:

.github/workflows/test-js.yml

@@ -8,6 +8,7 @@ on:
       - 'yarn.lock'
       - '.nvmrc'
       - '**/*.js'
+      - '**/*.jsx'
       - '**/*.snap'
       - '.github/workflows/test-js.yml'
 
@@ -17,6 +18,7 @@ on:
       - 'yarn.lock'
       - '.nvmrc'
       - '**/*.js'
+      - '**/*.jsx'
       - '**/*.snap'
       - '.github/workflows/test-js.yml'