Реагирует на FullCalendar UI Сломан, но исправлен при изменении размера окна

Question

Я использую полный календарь с React в моем приложении. Когда страница отображается, кажется, что пользовательский интерфейс календаря сломан, как показано ниже.

Но когда я изменяю размер окна браузера, оно возвращается к нормальному состоянию, как показано ниже.

Мой компонент рендеринга,

 <FullCalendar
                defaultView="timeGridWeek"
                header={{
                    left: 'prev,next today',
                    center: 'title',
                    right: 'dayGridMonth,timeGridWeek,timeGridDay,listWeek'
                }}
                minTime='07:00:00'
                maxTime='24:00:00'
                timezone ='local'
                plugins={[dayGridPlugin, timeGridPlugin, interactionPlugin]}
                ref={this.calendarComponentRef}
                weekends={this.state.calendarWeekends}
                events={this.state.calendarEvents}
                dateClick={this.handleDateClick}
                eventRender={this.EventDetail}
                eventClick={this.EventClicked}
            />

в App.s css,

@import '~@fullcalendar/daygrid/main.css';

Почему компонент сломался при первой загрузке?