FullCalendar - start/end date is off by one day

Question

I'm using fullCalendar and it use work fine except recently and maybe its updated to new version which I don't know. so the issue I'm having is start/end date is off. so I fixed the start date off by 1 day by adding timeZone: 'UTC'

and end date still have one day short and I debug and it looks like its getting the correct data from the server but when it renders its getting one day short. for an example:

my end date ends March 8 but in the calendar showing March 7

I looked at this existing solution but could not find the answer: FullCalendar End Date Off By One Fullcalendar show "end date" one day off

when I debug this is the data I'm getting which is correct:

{
    "id": "SDFDS23",
    "editable": true,
    "startEditable": true,
    "durationEditable": true,
    "start": "2024-03-04T00:00:00.000Z",
    "end": "2024-03-08T00:00:00.000Z",
    "allDay": true,
    "title": "test",
     
}

here is my code:

this.calendar = new FullCalendar.Calendar(ele, {
        plugins: [ 'interaction', 'dayGrid', 'timeGrid', 'list' ],
        defaultView: 'dayGridMonth',
        timeZone: 'UTC',
        navLinks: true,  
        editable: true,
        droppable: true,  
        selectable: this.selectable,
        selectMirror: true,
        eventLimit: true,  
        eventDurationEditable: true,
        eventStartEditable: true,
        eventResizableFromStart: true,
        slotDuration: "00:30:00",
        snapDuration: "00:30:00",
        defaultTimedEventDuration: "01:00:00" ,
        footerToolbar: true,
        nowIndicator: true,
        now: new Date(),
        eventTimeFormat: {
          hour: '2-digit',
          minute: '2-digit',
          meridiem: true
        },

read all the documentation and search the stackoverflow but could not find any answer