Typescript mapStateToProps не обновляет реквизиты компонента

Question

Я только начал использовать машинопись, поэтому извините, если я смотрю прямо на решение. У меня есть компонент следующим образом

import './weatherInfo.css';

import * as React from 'react';
import { connect } from 'react-redux';

import IWeatherInfo from '../../models/WeatherInfo';
import {IApplicationState} from '../../reducers';
import WeatherInfo from './weatherInfoItem';

interface IWeatherInfoList{
  weatherInfoList:IWeatherInfo[]
}
class WeatherInfoList extends React.Component<IWeatherInfoList> {

  componentWillReceiveProps(){
    console.log("Component will recieve props"); <------ 1
  }

   render() {
    console.log(this.props.weatherInfoList);
    return (
      <div className="weatherInfoContainer">
        {this.props.weatherInfoList.map((weatherInfoItem, index)=>{
          debugger
          return (<WeatherInfo key={index}  {...weatherInfoItem}/>);
        })}
      </div>
    );
  }
}

function mapStateToProps(state: IApplicationState):IWeatherInfoList {
<------- 2
    return {
      weatherInfoList: state.weatherInfo.citiesWeatherData
    }
}

const mapDispatchToProps = {

};
export default connect(mapStateToProps, mapDispatchToProps)(WeatherInfoList);

state.weatherInfo.citiesWeatherData имеет тип IWeatherInfo []

Теперь, когда я обновляю состояние магазина, все выглядит хорошо, магазин обновляется. Но компонент не получает новые реквизиты (следовательно, он не перерисовывается). Поэтому я установил точку останова на 2 и 1. Он останавливается на 2, но не на 1. Я попытался изменить тип weatherInfoList на строковый массив, и затем он работает. Что мне здесь не хватает?