search

wix-incubator / vscode-glean

The extension provides refactoring tools for your React codebase
MIT License
1.46k stars 56 forks source link

Suggestion: annotate function components with `SFC` type #34

Closed OliverJAsh closed 6 years ago

OliverJAsh commented 6 years ago

Thanks for this amazing project!

When converting from class to function components, could we annotate (in TypeScript files) the function component using the SFC type?

For example:

const MyComponent: SFC<Props> = props => <div />;

Annotating the type allows the props to be defined outside of the function definition, similar to how classes work. It's also an extra precaution to ensure the function returns the correct types.

borislit commented 6 years ago

Hey @OliverJAsh. Glad you like the project. Thanks of awesome suggestions! One of the latest releases improved class->functional transformation when using TS, but transforming it to const MyComponent = (props: Props) => <div />;

Isn't that not sufficient? Could you present the benefits of annotating the variable instead?

borislit commented 6 years ago

@OliverJAsh i've implemented the behavior. Look for it in https://github.com/wix/vscode-glean/tree/v4.1.0

OliverJAsh commented 6 years ago

Thank you! ❤️