Comments (3)
This issue is due to object mutation on the passed in events. The drag-and-drop wrapper is trying to add the "sourceResource" property to the selected event when attempting to move it. I assume redux marks any objects being added to the store as not extensible through the Object.preventExtensions() function to ensure immutability.
One solution is to just remap any objects being retrieved from the store so they are treated as new objects and the constraint is no longer applied.
const events = useSelector((state)=>state.event.items)
const remappedEvents = events.map((item) => ({ ...item }))
I do feel this may need to be changed in the library itself, as mutating props is not usually a reccommended approach, this is adding the "sourceResource" property to any passed in events only when that event is being moved which is quite unexpected and likely an unwanted side effect.
from react-big-calendar.
@bappyasif @AlexW29ChemE Thank you for bringing this issue to light. I resolved this issue by creating a copy of the draganddrop subfolder code from the library, importing withDragAndDrop from the subfolder, and modifying the one line in the EventWrapper.js to create a copy of the prop using JSON.parse() and JSON.stringify() so the original prop is not mutated following this discussion on StackOverflow
Essentially, changed this one line from:
let extendedEvent = this.props.event
to:
let extendedEvent = JSON.parse(JSON.stringify(this.props.event))
If we are able to get some consensus around the validity of this solution (perhaps @basstager you could chime in as the author of the original code), then hopefully @cutterbl can approve PR #2475 to be merged 🙂
from react-big-calendar.
Related Issues (20)
- View button does not respond when clicked HOT 5
- `onSelectSlot` missing `bounds`/`box` in week view all day section
- Action of "onSelectSlot" is "click" when minimal range selected HOT 1
- Show events as dots in mobile, month view
- Agenda AM,PM
- Custom UI elements for every individual day in week & day views
- week layout header...
- Horizontal scrolling on drag&drop with resurces
- Setting `min` and `max` displays calendar events a week earlier than they are scheduled the week of DST HOT 5
- Unable to add full image HOT 2
- react-big-calendar rbc-event width, height size
- Event width bug with no-overlap prop in week and day view
- Selecting time slots programmatically via react-testing-library
- Display event on full calendar [Day & Week view] HOT 1
- N/A
- Expose scrollElementRef from RBC
- I'm trying to switch to Spanish but it shows me the entire days instead of the first 3 letters. HOT 1
- Drag and drop inside shadow dom,
- range time error at AGENDA mode with febrary HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-big-calendar.