Is there a way to have evenly sized ticks for recharts axis while keeping my max value?

I have a data array like below which I want to show in a particular way using recharts.

const severityExampleData: any = [
    {symptom_type: 'chest pain', mild: 1, moderate: 2, severe: 1, total: 4},
    {symptom_type: 'pursiness', mild: 2, moderate: 1, severe: 10, total: 13},
    {symptom_type: 'cough', mild: 0, moderate: 0, severe: 1, total: 1},
];

I want my Y-axis to have even tick sizes and I want them to be 5 ticks, So I used the following solution.

    <ResponsiveContainer width='100%' aspect={4.8/3.0}>
        <BarChart data={data} margin={{top: 0, left: 0, right: 0, bottom: 0}}>
            <CartesianGrid strokeDasharray="3" vertical={false} />
            <XAxis reversed dataKey="symptom_type" tickLine={false} axisLine={false}/>
            <YAxis orientation='right' tickLine={false} axisLine={false} tickCount={5} domain={['auto', MAX]}/>
            <Tooltip />
            {fieldNames.map((value: any, i:number) => {
                console.log(value);
                return (
                    <Bar name={value} barSize={50} 
                    radius={i === fieldNames.length - 1 ? [10, 10, 0, 0]: [0, 0, 0, 0]} 
                    dataKey={value} stackId='a' fill={colors[i]}/>);
            })}
        </BarChart>
    </ResponsiveContainer>

And the result will be as follows.even ticks image

But I want my high bound tick to be the sum of my 'total' fields (which in this case is 18). To achive this I tried to set 'domain' property in 'YAxis' component to ['0', MAX].(MAX is the sum of my 'total's) But now my chart looks like this.max value for ticks

Actually I want 5 ticks to evenly divide my Y-axis and my highest tick to be the MAX. Sorry if my english was rough, I am not very good in that.