export interface PropsFromState {
  loading: boolean
  data: Attributes[]
  errors?: string
  vehicles: any
}

interface PropsFromDispatch {
    fetchRequest: typeof fetchRequest
    fetchVehicles: typeof fetchVehicles
}

interface IState {
    attributes: AttributesResponseInterface[] | any;
    tableAttributes: any;
}

type AllProps = PropsFromState & PropsFromDispatch

class IndexPage extends React.PureComponent<AllProps, IState> {

constructor(props: AllProps) {
    super(props);
//инициализация переменных
}

render() {
return (
    <Page>
        <Container>
    ….

     { this.renderData() }

);}
public renderData();


componentWillReceiveProps(nextProps: any){
  if (nextProps.data !== this.props.data) {

        if(nextProps.data && nextProps.data.length > 0 && this.state.tableAttributes.length <= 0){
       
        const cloneAttributeList  = Object.assign([], nextProps.data);
        const cloneAttributes  = Object.assign([], nextProps.data);

        cloneAttributes.map((item: AttributesResponseInterface) => item.selected = false);
        this.setState({...this.state, attributes: cloneAttributes, tableAttributes: cloneAttributeList});
     }
  }
}

}

// It's usually good practice to only include one context at a time in a connected component.
// Although if necessary, you can always include multiple contexts. Just make sure to
// separate them from each other to prevent prop conflicts.
const mapStateToProps = ({ vehicle }: ApplicationState) => ({
  loading: vehicle.loading,
  errors: vehicle.errors,
  data: vehicle.vehicles_attributes,
  vehicles: vehicle.vehicles
})

// mapDispatchToProps is especially useful for constraining our actions to the connected component.
// You can access these via `this.props`.
const mapDispatchToProps = {
  fetchRequest,
  fetchVehicles
}

// Now let's connect our component!
// With redux v4's improved typings
export default connect(
  mapStateToProps,
  mapDispatchToProps
)(IndexPage)