Support for "external" appointment dragging and dropping in scheduler

[jshaw-blueprintprep]

I'm using ...

• [ ] React Grid
• [ ] React Chart
• [x] React Scheduler

Description

Given a list of Appointments (or, rather, an array of objects of information that essentially represent the data that an Appointment component expects), allow for the DragAndDropProvider component to act on some handler, say, an onExternalDrop event so that it can receive the custom data and re-render the Scheduler component with the added Appointment data.

I know the AppointmentTooltip sends the data for event creation, so if we think of these external Appointments as pre-made bundles of Appointment data, then we have a predictable path to send the data to get it saved where it needs to be.

An initial idea I had in doing some in-the-meantime work for this is to setup my own components that can be moved with react-draggable or react-movable, wrap the Scheduler component in a custom component that can receive this drop, and then try and invoke the Scheduler's method to add the event - but maybe if I just add the event data how I normally would (outside of the paradigm of the Scheduler) and have Redux repopulate the state for the Scheduler component this could work?

I'm not sure how much more detailed I need to be with this feature request; apologies if this request doesn't follow the rules explicitly, be gentle, it's my first time!

[MaximKudriavtsev]

Hi @jshaw-blueprintprep,

We have ideas to implement Drag & Drop between schedulers, but it is a complex feature and we should make global research for it.

As for DnD between Scheduler and external form, this is very interesting, however, we cannot give you any workarounds for now since we didn’t plan it before. Do you have a real use-case for it? If yes, could you explain it in detail? We can try to find a workaround together.

I recommend you read our tutorials about Reactive Core principles of creating a custom logic around Reactive Scheduler, please see the following guides:

Reactive Core Principles Custom Plugin Development

[jshaw-blueprintprep]

Hi Maxim, thanks for the reply! I'll check out those links when I get done with my response.

As for a use-case, yes, even though it's not fully implemented (I'm still in the design phase which is what lead me to post a suggestion while researching Schedulers in React).

A user can choose "pre-built" or "pre-made" appointments from a collapsible accordion/list in a sidebar; these would get given some context that has meaning to the user in the use of the app, and they get to set their own schedules with these appointments. So they're different types of appointments based on certain contexts, including an approximation of how long the appointment should take. These pre-built appointments are basically "finalized" representations of the AppointmentModel.

If the DayCell component can be reliably augmented to allow for setting a custom onDrop handler, then it can (or should) handle knowing where to place the event on update.

This is still kind of new to me and I am still doing research and designing but the blocker from what I can see is providing a way to find the drop location and how it relates to the date information stored within, so it knows how to at least set the startDate and endDate fields in the AppointmentModel.

Does that help?

[MaximKudriavtsev]

@jshaw-blueprintprep,

Thank you for your detailed response. This information will be very helpful while implementing this feature.

I added the enhancement label for this thread. We will consider your feature request while planning our roadmap.

[sahanjith]

Hi @MaximKudriavtsev

Is this feature available on current stable version (2.7.6) or the library's roadmap? I Checked the version log but couldn't find it. I'm in a situation to choose DevExtreme React wrapper over devextreme-reactive library only because of this feature.

DevExtreme React wrapper has this featuire: CustomDragAndDrop

[sahanjith]

Hi @jshaw-blueprintprep

Did you find possible workaround for this use case?

[sehcheese]

Commenting to bump interest here. I also noticed the CustomDragAndDrop mentioned by @sahanjith, but I haven't gotten it to work in the context of @devexpress/dx-react-scheduler-material-ui.