Flow uncovered code warning when exporting react redux connect

Question

I'm trying to export a component with the react redux connect function like so:

//@flow
import React, { Component } from 'react';
import { connect } from 'react-redux';

type Props = {
    children?: any,
    someInfo: string
}

class ToDo extends Component<Props> {
    render() {
        let { someInfo } = this.props;

        return (
            <div className="todo-page">
                <pre>{ JSON.stringify(someInfo) }</pre>
            </div>
        );
    }
}

type StateProps = {
  someInfo: string
}

const mapStateToProps = (state: StateProps) => {
    const { someInfo } = state;
    return { someInfo };
};

export default connect(mapStateToProps, {})(ToDo);

and i'm getting uncovered code warning for the last line (export one).

The error that i'm getting:

---

How should I structure my code and remove this kind of warning?

Answer 1

Actually I have this on my projects as well, but I uncheck/unselect the flow coverage option at the bottom of VSCode. This will toggle between flow errors in your code and uncovered code.

Uncovered code is external code (imported modules), sometimes your own, more likely 3rd party dependencies (as in this instance) that do not define flow types. As a result flow is unable to check types for consistency.

You could install the react-redux type definitions from flow-typed as suggested in the comments. Actually I tried this in the past and lead to a whole world of pain, so I left it.

As a side note, consider this... aiming for 100% type checking coverage is as harmful as aiming for 100% test coverage (google it). Aim for a high, realistically achievable coverage and don't waste time chasing the last few percent.