VictoryAxis starts at the wrong position

I'm having trouble fitting my VictoryAxis to my VictoryChart. The Axis seems to start at the second value on my X-Axis.

This is how it is supposed to look (0 under first bars, 22 under last)

However when I add my labels as tickValues or tickFormat, I get this

This is my code

const dataX = ["0", "2", "4", "6", "8", "10", "12", "14", "16", "18", "20", "22"];

<VictoryChart width={Metrics.width - Metrics.gridSize * 4}
  padding={{ left: 20, top: 10, right: 10, bottom: 30  }}
  height={height}
  containerComponent={<VictoryContainer responsive={false} />}
  domain={{ x: [0, dataX.length] }}
>
    <VictoryGroup offset={10}>
      {data.map((chartData, index) => (
        <VictoryBar
          cornerRadius={3}
          barWidth={10}
          data={chartData.data}
          key={index}
          y="value"
        />
      ))}
    </VictoryGroup>

    {/* X-AXIS */}
    <VictoryAxis tickValues={dataX} />
</VictoryChart>

Any help to solve my problem is welcome! 🙏

[EDIT]

not providing a domain to the VictoryChart and removing tickValues results into this:

My mistake here was the format of my Data. this was something like

[{"value": 1}, {"value": 1.1}...]

I had to map my data to something like this

[{"x": 1, "y": 1}, {"x": 2, "y": 1.1}...]