WHEN using dataSet property THEN some points/lines are not drawn

[Xaeryan]

I'm using the dataSet property and noticing in some cases points/lines are either being cutoff or not drawn. Take the following code:

import React from 'react';
import { View } from 'react-native';
import { LineChart } from "react-native-gifted-charts";

export default function TestComponenet1 () {
    const dataSet = [
            {   
                data: [{value: 12},{value: 22},{value: 33}], 
                color: 'orange', 
                dataPointsColor: 'orange' 
            },
            {   
                data: [{value: 15}, {value: 30}, {value: 26}, {value: 40}, {value: 33}],
                color: 'blue', 
                dataPointsColor: 'blue' 
            },
        ];

  return (
    <View style={{flex: 1, backgroundColor: 'white'}}>
      <LineChart dataSet={dataSet} backgroundColor={'gray'} 
       yAxisOffset={0}
       maxValue={50} 
       width={280}
       spacing={55}
        />
    </View>
  );
}

It results in the following. Note the BLUE line is missing the last point (4 instead of 5):

Now if we just add another point to the ORANGE line, the missing BLUE line/point shows up:

import React from 'react';
import { View } from 'react-native';
import { LineChart } from "react-native-gifted-charts";

export default function TestComponenet1 () {
    const dataSet = [
            {   
                data: [{value: 12},{value: 22},{value: 33},{value: 27}], 
                color: 'orange', 
                dataPointsColor: 'orange' 
            },
            {   
                data: [{value: 15}, {value: 30}, {value: 26}, {value: 40}, {value: 33}],
                color: 'blue', 
                dataPointsColor: 'blue' 
            },
        ];

  return (
    <View style={{flex: 1, backgroundColor: 'white'}}>
      <LineChart dataSet={dataSet} backgroundColor={'gray'} 
       yAxisOffset={0}
       maxValue={50} 
       width={280}
       spacing={55}
        />
    </View>
  );
}

Results in this (correct):

[keithorange]

Same issue! I think its to do with line charts. I am getting it cutoff too!

  // take just roi for each as {value: roi}
  const lineChartData = trades.map(trade => ({
    value: trade.roi
  }));

<LineChart data={lineChartData}/>;