Remove I prefix from props and state props

Author: Mohsen Azimi

README.md

@@ -36,18 +36,18 @@ class MyComponent extends React.Component {
 
 **output**
 ```ts
-interface IMyComponentProps {
+interface MyComponentProps {
   p: string;
   r: number | undefined;
 }
 
-interface IMyComponentState {
+interface MyComponentState {
   foo: number;
   bar: string;
   baz: number | undefined;
 }
 
-class MyComponent extends React.Component<IMyComponentProps, IMyComponentState> {
+class MyComponent extends React.Component<MyComponentProps, MyComponentState> {
   constructor() {
     super();
     this.state = { foo: 1, bar: 'str' };

src/transforms/react-hoist-generics-transform.ts

@@ -54,8 +54,8 @@ function hoist(reactClass: ts.ClassDeclaration, sourceFile: ts.SourceFile) {
     }
 
     const [propType, stateType] = reactType.typeArguments;
-    const propTypeName = `I${className}Props`;
-    const stateTypeName = `I${className}State`;
+    const propTypeName = `${className}Props`;
+    const stateTypeName = `${className}State`;
     const propTypeDeclaration = ts.createTypeAliasDeclaration([], [], propTypeName, [], propType);
     const stateTypeDeclaration = ts.createTypeAliasDeclaration([], [], stateTypeName, [], stateType);
     const propTypeRef = ts.createTypeReferenceNode(propTypeName, []);

test/end-to-end/basic/output.tsx

@@ -1,9 +1,9 @@
 import * as React from 'react';
 
-type IMyComponentProps = {};
-type IMyComponentState = void;
+type MyComponentProps = {};
+type MyComponentState = void;
 
-export default class MyComponent extends React.Component<IMyComponentProps, IMyComponentState> {
+export default class MyComponent extends React.Component<MyComponentProps, MyComponentState> {
     render() {
         return <div />;
     }

test/end-to-end/initial-state-and-proprypes-and-set-state/output.tsx

@@ -1,19 +1,19 @@
 import * as React from 'react';
 
-type IMyComponentProps = {
+type MyComponentProps = {
     baz: string;
 };
-type IMyComponentState = {
+type MyComponentState = {
     dynamicState: number;
     foo: number;
     bar: string;
 };
-export default class MyComponent extends React.Component<IMyComponentProps, IMyComponentState> {
+export default class MyComponent extends React.Component<MyComponentProps, MyComponentState> {
     state = { foo: 1, bar: 'str' };
     render() {
         return <div />;
     }
     otherFn() {
         this.setState({ dynamicState: 42 });
     }
-}
+}

test/end-to-end/initial-state-and-proprypes/output.tsx

@@ -1,15 +1,15 @@
 import * as React from 'react';
 
-type IMyComponentProps = {
+type MyComponentProps = {
     baz: string;
 };
-type IMyComponentState = {
+type MyComponentState = {
     foo: number;
     bar: string;
 };
-export default class MyComponent extends React.Component<IMyComponentProps, IMyComponentState> {
+export default class MyComponent extends React.Component<MyComponentProps, MyComponentState> {
     state = { foo: 1, bar: 'str' };
     render() {
         return <div />;
     }
-}
+}

test/react-hoist-generics-transform/propless-stateless/output.tsx

@@ -1,8 +1,8 @@
 import * as React from 'react';
 
-type IMyComponentProps = {};
-type IMyComponentState = void;
-export default class MyComponent extends React.Component<IMyComponentProps, IMyComponentState> {
+type MyComponentProps = {};
+type MyComponentState = void;
+export default class MyComponent extends React.Component<MyComponentProps, MyComponentState> {
     render() {
         return <div />;
     }

test/react-hoist-generics-transform/props-and-state/output.tsx

@@ -1,14 +1,14 @@
 import * as React from 'react';
 
-type IMyComponentProps = {
+type MyComponentProps = {
     foo: string;
     bar: object;
 };
-type IMyComponentState = {
+type MyComponentState = {
     baz: string;
     [k: string]: string;
 };
-export default class MyComponent extends React.Component<IMyComponentProps, IMyComponentState> {
+export default class MyComponent extends React.Component<MyComponentProps, MyComponentState> {
     render() {
         return <div />;
     }