Make Xaxis to cross Yaxis on Y=0 point in rechart

Question

I want Linechart's XAxis to start at y=0 point and not on lowest y value, I tried <YAxis domain={['auto', 'auto']} /> <YAxis domain={[0, 'dataMax']} /> and same for Xaxis, I want X to start y at zero and on negative values Lines to cross X axis and go bellow it, my current code:

<LineChart
    width={700}
    height={400}
    data={statistic?.monthlyData || []}
    margin={{ top: 5, right: 30, left: 20, bottom: 5 }}
  >
    <CartesianGrid strokeDasharray="3 3" />
    <Legend />
    <XAxis dataKey="month" />
    <YAxis />
    <Tooltip />
    <Line
      type="linear"
      dataKey="income"
      stroke="#21C206"
      strokeWidth={3}
      activeDot={{ r: 8 }}
      dot={{ fill: "#21C206" }}
    />
    <Line
      type="linear"
      dataKey="expense"
      stroke="#EE3F19"
      strokeWidth={3}
      activeDot={{ r: 8 }}
      dot={{ fill: "#EE3F19" }}
    />
    <Line
      type="linear"
      dataKey="economy"
      stroke="#6200EE"
      strokeWidth={3}
      activeDot={{ r: 8 }}
      dot={{ fill: "#6200EE" }}
    />
  </LineChart>

Visaul I want:

Visaul I have: