Storybook crash cause of fullcalendar

Get Help and Help Others
1

Hello, i am trying redwoodjs so far it’s a great tools for me but i am facing to an issue when i try to use fullcalendar.

My projet have just 1 page who display the calendar, everything works fine but when i lunch storybook → yarn rw storybook tsc crashed with the follow log:

70% sealing plugins DocGenPlugin/home/ubuntu/workspace/perso/redwood/my-redwood-app/node_modules/typescript/lib/typescript.js:58844
            if (type.flags & 524288 /* TypeFlags.Object */) {
                     ^

TypeError: Cannot read properties of undefined (reading 'flags')
    at getPropertyOfObjectType (/home/ubuntu/workspace/perso/redwood/my-redwood-app/node_modules/typescript/lib/typescript.js:58844:22)

After i removed import of fullcalendar:
import '@fullcalendar/react/dist/vdom'
from my homePageComponent
storybook compile and works properly

by removing this import fullcalendar throw an error about import order and after my research the only way to fix is is by adding this import on top of the others fullcalendar import.

can someone help me to fix my issue please?

How to reproduce?

  • generate redwoodjs project following the doc

  • yarn workspace web add the following deps:
    “@fullcalendar/core”: “^5.11.3”,
    “@fullcalendar/daygrid”: “^5.11.3”,
    “@fullcalendar/interaction”: “^5.11.3”,
    “@fullcalendar/list”: “^5.11.3”,
    “@fullcalendar/react”: “^5.11.3”,
    “@fullcalendar/timegrid”: “^5.11.3”,

  • create home page using rd cli and add fullcalendar

import '@fullcalendar/react/dist/vdom'

import { DateSelectArg, EventChangeArg } from '@fullcalendar/core'
import frLocale from '@fullcalendar/core/locales/fr'
import dayGridPlugin from '@fullcalendar/daygrid'
import interactionPlugin, { DateClickArg } from '@fullcalendar/interaction' // needed for dayClick
import listPlugin from '@fullcalendar/list'

import FullCalendar, { EventApi } from '@fullcalendar/react'
import timeGridPlugin from '@fullcalendar/timegrid'

and use fullcalendar component

<FullCalendar
        businessHours={{
          daysOfWeek: [1, 2, 3, 4, 5, 6, 0],
          startTime: '4:00',
          endTime: '23:00', 
        }}
        selectConstraint="businessHours"
        eventConstraint="businessHours"
        height={'80vh'}
        locale={frLocale}
        allDaySlot={false}
        editable={true}
        selectable={true}
        timeZone="local"
        initialView="timeGridWeek"
        defaultTimedEventDuration="0:15"
        slotDuration={'01:00'}
        dateClick={(event)=>{}}
        snapDuration={'00:15'}
        plugins={[timeGridPlugin, interactionPlugin, dayGridPlugin, listPlugin]}
        events={[]}
        headerToolbar={{
          left: 'prev,next',
          center: 'title',
          right: 'timeGridWeek,timeGridFourDay,listWeek,dayGridMonth',
        }}
        views={{
        
          timeGridFourDay: {
            type: 'timeGrid',
            duration: { days: 1 },
            buttonText: 'Day',
          },
          listWeek: {
            type: 'listWeek',
            buttonText: 'Jour (pref)',
          },
        }}
      />

Thx for your time

Note: maybe i should exclude this component from storybook cause it don’t really need to be tested but cant find where i can managed this