Can't pass props to AnimatedWeatherIcon component & Missing types

[Adamy96]

Hey :)

I really enjoyed the library and it was just what I was looking for, but I wasn't able to customize the size and color/colour of icons. Looking at the code I saw that the components already have the support to handle this props, but in this version we are not passing the received props to the desired icon.

At react-native-animated-weather-icons/AnimatedWeatherIcon.tsx, render method (line 29)

var weatherIcon;
switch(this.props.weatherName) {
    case 'weather-rainy':
        weatherIcon = <RainIconAnimated />
        break;
    case 'weather-sunny':
        weatherIcon = <SunIconAnimated />
        break;
    case 'weather-lightning':
        weatherIcon = <ThunderIconAnimated />
        break;
    case 'weather-cloudy':
        weatherIcon = <SunCloudIconAnimated />
        break;
    case 'weather-snowy':
        weatherIcon = <SnowIconAnimated />
        break;
    case 'weather-hail':
        weatherIcon = <RainIconAnimated />
        break;
    case 'weather-fog':
        weatherIcon = <SunCloudIconAnimated />
        break;
    case 'weather-windy':
        weatherIcon = <WindCloudIconAnimated />
    default:
        weatherIcon = <SnowIconAnimated />
}

return weatherIcon;

It can be solved by adding {...this.props} to each component, like this:

var weatherIcon;
switch (this.props.weatherName) {
    case 'weather-rainy':
        weatherIcon = <RainIconAnimated {...this.props} />
        break;
    case 'weather-sunny':
        weatherIcon = <SunIconAnimated {...this.props} />
        break;
    case 'weather-lightning':
        weatherIcon = <ThunderIconAnimated {...this.props} />
        break;
    case 'weather-cloudy':
        weatherIcon = <SunCloudIconAnimated {...this.props} />
        break;
    case 'weather-snowy':
        weatherIcon = <SnowIconAnimated {...this.props} />
        break;
    case 'weather-hail':
        weatherIcon = <RainIconAnimated {...this.props} />
        break;
    case 'weather-fog':
        weatherIcon = <SunCloudIconAnimated {...this.props} />
        break;
    case 'weather-windy':
        weatherIcon = <WindCloudIconAnimated {...this.props} />
    default:
        weatherIcon = <SnowIconAnimated {...this.props} />
}

return weatherIcon;

Also, to solve typescript errors/warnings we can add the library @types/react, this way typescript will recognize this.state and this.props

yarn add @types/react