Fullcalendar timeGridWeek and timeGridDay not loading correctly

For my calendar, I'm trying to use the timeGridWeek and timeGridDay views. Instead of loading correctly like this:

it loads like this:

My calendar defaultview is dayGridMonth, which works fine. When I click the buttons that change the view to week or day, it doesn't render correctly AND also doesn't let me change the view further with button clicks (essentially I'm stuck in the view I selected).

Here is my code for the calendar element + imports:

import timeGridPlugin from "@fullcalendar/timegrid";
import FullCalendar from "@fullcalendar/react";
import dayGridPlugin from "@fullcalendar/daygrid";
import interactionPlugin, { Draggable } from "@fullcalendar/interaction";

          <FullCalendar
            ref={this.calendarRef}
            defaultView="dayGridMonth"
            height={"parent"}
            width={"parent"}
            droppable={true}
            drop={this.handleDrop}
            dateClick={this.handleDateClick}
            eventClick={this.handleEventClick}
            header={{
              left: "prev,next, today",
              center: "title",
              right: "dayGridMonth,timeGridWeek,timeGridDay"
            }}
            plugins={[dayGridPlugin, timeGridPlugin, interactionPlugin]}
            editable={true}
            events={this.state.events}
            eventLimit={true}
          />

Thanks in advance :)

Nevermind, it's fixed! it seems to just be wonky rendering on the local side. When I hosted the app on heroku the timeGridWeek and day both rendered fine. It seems to have just been a faulty installation.