Ant Design Charts: How to plot an area range in dual axes chart?

In a dual axes graph I am trying to plot a chart that has a green line overlayed on an area (with range). Therefor, between the blue lines (which are generated from dataSet1), I would like to have a background color

I have the following configuration:

const config: any = {
  data: [dataSet1,dataSet2],
  xField: 'year',
  yField: ['price','price'],
  legend: false,
  geometryOptions:  [
    {
      geometry: 'line',
    },
    {
      geometry: 'line',
      color: 'green',
      lineStyle: {
        lineWidth: 4,
      },
      point: {
        shape: 'breath-point',
      },
    },
  ],
};


<DualAxes {...config} />

I have tried multiple things, like setting an isRange: true, area: true, area: 'red' in various parts of the config but I am unable to get it done.

NOTE: a dual axes graph is not necessary. as long as the setup below (green line, custom points, area with background color) can be plotted.