React-Native with TypeScript breaks on typecheck #465

[Ztarbox]

Summary

To fix #465 I updated the type annotations for react-native.

I also found to support the eslint rule @typescript-eslint/explicit-function-return-type we would need to add the return type if the typescript flag is present. But I have no idea how to implement that.

Test plan

I didn't get it with jest. It gave me (w/o changes) so much errors and deprecated snapshots. I lost sight.
Also I tried to just add to cli/src/index.test.js to 'should support various args', but jest didn't run it.
So I did manual tests:

1. target functionality
   svgr --native --typescript ../../../__fixtures__/simple/file.svg --silent

import * as React from 'react'
import Svg, { SvgProps, Path } from 'react-native-svg'

function SvgFile(props: SvgProps) {
  return (
    <Svg width={48} height={1} {...props}>
      <Path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
    </Svg>
  )
}

export default SvgFile

2. default functionality still working:
   node svgr --native ../../../__fixtures__/simple/file.svg --silent

import * as React from 'react'
import Svg, { Path } from 'react-native-svg'

function SvgFile(props) {
  return (
    <Svg width={48} height={1} {...props}>
      <Path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
    </Svg>
  )
}

export default SvgFile

3. with ref
   node svgr --native --typescript --ref ../../../__fixtures__/simple/file.svg --silent

import * as React from 'react'
import Svg, { SvgProps, Path } from 'react-native-svg'

function SvgFile(
  props: SvgProps,
  svgRef?: React.Ref<React.Component<SvgProps>>,
) {
  return (
    <Svg width={48} height={1} ref={svgRef} {...props}>
      <Path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
    </Svg>
  )
}

const ForwardRef = React.forwardRef(SvgFile)
export default ForwardRef

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/gregberge/svgr/468u6w8fe
✅ Preview: https://svgr-git-mybranch.gregberge.vercel.app

[Ztarbox]

By looking into Travis output and reducing the test down to yarn jest --runInBand --ci --coverage packages/babel-plugin-transform-svg-component/src/index.test.js I was able to run some tests (the full package or even only the cli packages results in a lot of timeouts and other errors travis isn't showing on my machine). So I found one bug and extended the babel-plugin-transform-svg-component/src/index.test.js with some additional native tests.

[gregberge]

@Ztarbox thanks, could you please remove the change in the yarn.lock. I don't know why it is there?

[Ztarbox]

@Ztarbox thanks, could you please remove the change in the yarn.lock. I don't know why it is there?

I reset my changes of yarn.lock. But I did nothing manually. These were created by just running yarn.
I did a double check on this and it created the same changes again.

[yjose]

👋 @gregberge , When you can merge this PR, please? Any expectation!