Uncaught TypeError: Cannot read properties of undefined (reading 'hasOwnProperty')

• Scheduler package version
• Share scheduler and datetimepicker related code snippets
• Share a video demo depicting the issue
• Share any issue reproducing sample(if possible)

I am currently using the version 19.3.55, and below you can see the code of the scheduler as well as the editorTemplate:

 SchedulerComponent:

    return (

        <div>

            <ScheduleComponent timeFormat='HH:mm' currentView='Week' weekRule='FirstFullWeek' eventClick={() => { }} cellClick={() => { }}

                showWeekNumber={true} firstDayOfWeek={1} workHours={{ highlight: false }} showQuickInfo={false}

                eventSettings={{ dataSource: appointmentsRequest.response }} editorTemplate={AppointmentComponent}

                views={['Day', 'Week', 'Month', 'Agenda']} >

                <Inject services={[Day, Week, Month, Agenda]} />

            </ScheduleComponent>

        </div >

    )

}

And the editor Template with the DateTimePicker component

export const AppointmentComponent = (props: any) => {

    const [newAppointment, setNewAppointment] = useRecoilState(newAppointmentState)

    const [boatList,]: any = useRecoilState(orgBoatList)

    return (

        <table className='custom-event-editor'>

            <tbody>

                <tr>

                    <td className='e-textlabel'>Type of training</td>

                    <td>

                        <DropDownListComponent id='TypeOfTraining' dataSource={['Rowing', 'Strength training', 'Ergometer training']} className='e-field'

                            placeholder='Choose type of training' onChange={(args: any) => setNewAppointment({ appointment: { ...newAppointment.appointment, Type: args?.value } })} data-name='Type' value={props.EventType || null}>

                        </DropDownListComponent>

                    </td>

                </tr>

                <tr>

                    <td className='e-textlabel'>From</td>

                    <td>

                        <DateTimePickerComponent id='StartTime' data-name='StartTime' format='dd/MM/yyyy HH:mm'

                            value={new Date(props.StartTime)} className='e-field'

                            created={() => { console.log(props.StartTime); setNewAppointment({ ...newAppointment, appointment: { ...newAppointment.appointment, StartTime: new Date(props.StartTime), EndTime: new Date(props.EndTime) } }) }}

                            onChange={(args: any) => { console.log(args); setNewAppointment({ appointment: { ...newAppointment.appointment, StartTime: new Date(args?.value) } }) }} >

                        </DateTimePickerComponent>

                    </td>

                </tr>

                <tr>

                    <td className='e-textlabel'>To</td>

                    <td>

                        <DateTimePickerComponent id='EndTime' data-name='EndTime' format='dd/MM/yyyy HH:mm'

                            value={new Date(props.endTime || props.EndTime)} className='e-field'

                            onChange={(args: any) => { console.log(args); setNewAppointment({ appointment: { ...newAppointment.appointment, EndTime: new Date(args?.value) } }) }}>

                        </DateTimePickerComponent>

                    </td>

                </tr>

                {(newAppointment.appointment.Type == 'Rowing') && <>

                    <tr>

                        <td className='e-textlabel'>Boatclass</td>

                        <td>

                            <DropDownListComponent id='Boatclass' dataSource={boatList.map(({ boatClass }: any) => boatClass)} className='e-field'

                                placeholder='Choose boatclass' onChange={(args: any) => setNewAppointment({ appointment: { ...newAppointment.appointment, Boatclass: args?.value } })} data-name='Boatclass' value={newAppointment.appointment.Boatclass}>

                            </DropDownListComponent>

                        </td>

                    </tr>

                    <tr>

                        <td className='e-textlabel'>Boatname</td>

                        <td>

                            <DropDownListComponent id='Boatname' dataSource={newAppointment.appointment.Boatclass ? boatList.map(({ name, boatClass }: any) => boatClass == newAppointment.appointment.Boatclass ? name : null).filter((name: string) => name != null) : boatList.map(({ name }: any) => name)} className='e-field'

                                placeholder='Choose boatname' onChange={(args: any) => { setNewAppointment({ appointment: { ...newAppointment.appointment, Boatname: args?.value } }); if (!(newAppointment.appointment.Boatclass)) { console.log(newAppointment.appointment.Boatclass); setNewAppointment({ appointment: { ...newAppointment.appointment, Boatclass: boatList.find((e: any) => e.name === args?.value).boatClass } }) } }} data-name='Boatname' value={newAppointment.appointment.Boatname}>

                            </DropDownListComponent>

                        </td>

                    </tr>

                </>

                }

                <tr>

                    <td className='e-textlabel'>Notes</td>

                    <td>

                        <textarea id='Notes' name='Notes' rows={4} cols={50} className='e-field'></textarea>

                    </td>

                </tr>

            </tbody>

        </table >

    )

}

I solved the issue, it looks i made a mistake when trying to refill the data in the object, in the improved code i reset and refill the object without the create event listener, instead I just use a useEffekt hook with the component props in the dep. array.

Unfortunately i still dont know exactly what caused the error.

It seems I have used various Components of the Library wrong or not like they were supposed to. I was able to do a lot fo code refactoring but nevertheless i feel like there could be done more.

I searched a bit but couldnt find a List with all the propertier and functions of the Scheduler Class for example and the documentation in the TS file is not really detailed either. For example: the explanation for 'getAnnouncementString' is just 'Method to generate the announcement string', it may be good to also have a quick explanation what exactly an announcement String is and things like that.

Maybe there is such a chapter in the API Docs and I am just too blind to find them, but although i like the Components you provide I get the impression that the Docs lack short and informative explanations.