StackedAreaChart doesn't properly render all data points

What is the problem?

StackedAreaChart doesn’t properly render all the data points. In particular, it only renders the first keys.length data points.

When does it happen?

The following code should render a StackedAreaChart that looks like the one from the examples, but with one additional data point (making five total).

class StackedAreaExample extends React.PureComponent {

    render() {

        const data = [
            {
                month: new Date(2015, 0, 1),
                apples: 3840,
                bananas: 1920,
                cherries: 960,
                dates: 400,
            },
            {
                month: new Date(2015, 1, 1),
                apples: 1600,
                bananas: 1440,
                cherries: 960,
                dates: 400,
            },
            {
                month: new Date(2015, 2, 1),
                apples: 640,
                bananas: 960,
                cherries: 3640,
                dates: 400,
            },
            {
                month: new Date(2015, 3, 1),
                apples: 3320,
                bananas: 480,
                cherries: 640,
                dates: 400,
            },
            {
                month: new Date(2015, 4, 1),
                apples: 2320,
                bananas: 780,
                cherries: 440,
                dates: 400,
            },
        ]

        const colors = [ '#ED5314', '#FFB92A', '#FEEB51', '#9BCA3E' ]
        const keys   = [ 'apples', 'bananas', 'cherries', 'dates' ]

        return (
            <StackedAreaChart
                style={ { height: 200, paddingVertical: 16 } }
                data={ data }
                keys={ keys }
                colors={ colors }
                curve={ shape.curveNatural }
                showGrid={ false }
            />
        )
    }
}

However, this code only renders the first four data points.

What platform?

Occurs on both iOS and Android platforms.

Additional comments

I think the problem has something to do with this line, which seems to be using keys.length when it should be using data.length. However, changing that line alone does not fix the issue, so there must be another place where the number of data points is being calculated incorrectly.

[mrbodoia]

Looks good to me. Thanks!

[JesperLekland]

Released in v.2.2.2. Thank you for reporting the issue and helping with the fix 🥇