as you see below, instead of making the fifth start a half-star, a small star is added, althoug I’m setting the max property to 5!

here is my code:
import Rating from ‘@mui/material/Rating’;

export default function RatingStars({rating}) {
    return(
            <Rating className="w-24" readOnly name="half-rating" size="medium" value={rating} precision={0.5} max={5}/>
    );
}

I also copied the same code in the MUI docs, it has the same issue too.