Layout grid item is not made static when the "static" property of a layout is updated from false to true

[komoo1]

CodeSandbox Link
https://codesandbox.io/s/practical-elgamal-h3c6y?file=/src/ShowcaseLayout.js

Steps to Recreate Issue:

• Generate new layout and ensure that grid box 0 is not static
• Confirm Grid Item Box 0 is draggable
• Click the button "Update GridItem 0 to Static" to update Grid item box 0 to static in the layout
• See that Grid box 0 is still draggable. Though the property was updated, the behavior was not.

Expectation

• Layout Grid item should be static when the ''static'' attribute is updated from false to true

[ofekkazes]

Hi,

I have encountered the same exact issue, if the layout started with an item static, changing it's value to false will not change the GridItem's behavior, same as with isDraggable, and the same goes for if the layout has an item not static, changing the value will not change its behavior.

[adi-sekar]

@komoo1 I encountered same issue, but found a hack to fix it. The onLayoutChange 2nd parameter layouts, still holds on to the old values before the static update. You will have to update it with the new value, and set it in Redux store in my case/ react state.

[ofekkazes]

@adi-sekar this is only when onLayoutChange is triggered, if no item was repositioned or had a change of dimensions the function will not be triggered.
We can trigger a temporary position/dimension change after making items static to trigger the function, but that will also show the temporary changes on the items on React and will look "buggy".

Nevertheless it might work, and thank you for taking the time to check it.

[adisekar]

@ofekkazes Is there another event, which gets triggered if static is updated or say something like minWidth/isDraggable etc, some thing which does not affect the layout position immediately get changed?

[pietromassiccio]

Any update on this? I am encountering the same issue!

[adi-sekar]

@pietromassiccio The fix I did for this, is to
The onLayoutChange 2nd parameter layouts, still holds on to the old values before the static update. You will have to update it with the new value

[pietromassiccio]

@adi-sekar Thanks for the idea, however as @ofekkazes pointed out onLayoutChange gets fired only when the layout has changed by repositioning an item for instance.

[pietromassiccio]

@komoo1 I think it's just a bug in your code at line 75. You should be comparing against a string and not an integer. Exchange that with i === "0" and it should work.

updateGridItemStatic() { let idx = this.state.layouts.lg.findIndex((e) => e.i === 0); ... }

[ofekkazes]

For now I had used the isDraggable prop on RGL which locks the layout and is working as expected, instead of locking one item, locking every one is the best next thing :)

[github-actions]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this issue will be closed in 7 days