fix: adjusts fix for generic type arguments on TSX files

Fixes #27

src/prefer-arrow-functions.spec.ts

@@ -837,6 +837,30 @@ const invalidWhenAllowNamedFunctions = [
   },
 ];
 
+const validAndFileIsTSX = [
+  {
+    code: 'const Component = <T,>() => <div>test</div>;',
+  },
+  {
+    code: 'const Component = <T,U>() => <div>test</div>;',
+  },
+];
+
+const invalidAndFileIsTSX = [
+  {
+    code: 'function Component<T>() { return <div>test</div> }',
+    output: 'const Component = <T,>() => <div>test</div>;',
+  },
+  {
+    code: 'function Component<T,>() { return <div>test</div> }',
+    output: 'const Component = <T,>() => <div>test</div>;',
+  },
+  {
+    code: 'function Component<T,U>() { return <div>test</div> }',
+    output: 'const Component = <T,U>() => <div>test</div>;',
+  },
+];
+
 const ruleTester = new RuleTester({
   parser: require.resolve('@typescript-eslint/parser'),
   parserOptions: {
@@ -856,6 +880,16 @@ const withErrors = (errors) => (object) => ({
   errors,
 });
 
+const withTSX = () => (object) => ({
+  ...object,
+  filename: '/some/path/Component.tsx',
+  parserOptions: {
+    ecmaFeatures: { jsx: true },
+    ecmaVersion: 8,
+    sourceType: 'module',
+  },
+});
+
 describe('when function is valid, or cannot be converted to an arrow function', () => {
   describe('it considers the function valid', () => {
     ruleTester.run('lib/rules/prefer-arrow-functions', rule, {
@@ -1026,3 +1060,14 @@ describe('when allowNamedFunctions is true', () => {
     });
   });
 });
+
+describe('when file is TSX', () => {
+  describe('it properly fixes generic type arguments', () => {
+    ruleTester.run('lib/rules/prefer-arrow-functions', rule, {
+      valid: validAndFileIsTSX.map(withTSX()),
+      invalid: invalidAndFileIsTSX
+        .map(withTSX())
+        .map(withErrors([USE_ARROW_WHEN_FUNCTION])),
+    });
+  });
+});

src/prefer-arrow-functions.ts

@@ -38,13 +38,18 @@ export default {
       typeof options[name] !== 'undefined'
         ? options[name]
         : DEFAULT_OPTIONS[name];
+
     const allowNamedFunctions = getOption('allowNamedFunctions');
     const singleReturnOnly = getOption('singleReturnOnly');
     const classPropertiesAllowed = getOption('classPropertiesAllowed');
     const disallowPrototype = getOption('disallowPrototype');
     const returnStyle = getOption('returnStyle');
+
     const sourceCode = context.getSourceCode();
 
+    const filename = context.getPhysicalFilename();
+    const isTSX = filename?.endsWith('.tsx');
+
     const isBlockStatementWithSingleReturn = (node) => {
       return (
         node.body.body &&
@@ -97,7 +102,15 @@ export default {
     };
 
     const isGenericFunction = (node) => Boolean(node.typeParameters);
-    const getGenericSource = (node) => sourceCode.getText(node.typeParameters);
+    const getGenericSource = (node) => {
+      const genericSource = sourceCode.getText(node.typeParameters);
+      if (!isTSX) return genericSource;
+
+      const genericParameterCount = node.typeParameters?.params?.length || 0;
+      if (genericParameterCount === 1)
+        return `<${node.typeParameters.params[0].name.name},>`;
+      return genericSource;
+    };
     const isAsyncFunction = (node) => node.async === true;
     const isGeneratorFunction = (node) => node.generator === true;
     const isAssertionFunction = (node) =>